全部文章
共 1299 篇文章
一键 i18n 国际化库
作为一名 前端开发 ，给项目做多语言早已是家常便饭。 可每次面对成百上千条文案，“ + ”仍然是让人头秃的体力活。 🎯i18n auto extractor 用 包一层，剩下的交给机器人 安装即可跑， 开箱即用 、 、原生项目全部通吃 内置谷歌翻译，支持 语言 极小包体，运行时动态切换语言 使用 3 步走 构建后会自动生成： 🎯auto i18n translation plugins 连 都不用写，源码中文自动翻译 完全零侵入，...
📦 npm、yarn、pnpm、bun 是什么
🎯 什么是包管理器？ 在 JavaScript 和 Node.js 生态中，一个项目往往依赖很多第三方库，比如 Vue、React、Lodash 等。\ \ 包管理器（Package Manager）\ \ 的作用，就是： 安装/卸载这些依赖库； 管理依赖的版本； 构建依赖树； 提供运行脚本（如 npm run dev）等功能。 最早是 npm，后来有了性能更好的 yarn，又有了极致节省空间的 pnpm，最近还杀出了一个全能选手 —...
JavaScript 原型链深度解析
JavaScript 原型链深度解析：从概念到实践 前言 JavaScript 原型链是前端开发中最重要也是最容易混淆的概念之一。理解原型链不仅有助于我们掌握 JavaScript 的面向对象编程，更是深入理解继承、方法查找等核心机制的关键。本文将从基础概念开始，逐步深入到原型链的实际应用。 1\. 核心概念理解 什么是原型？ 在 JavaScript 中，每个对象都有一个内部属性指向另一个对象，这个被指向的对象就是原型。原型本身也是一...
DOM截图snapDom介绍
在日常业务开发里， DOM 截图 几乎是刚需场景。 无论是生成分享卡片、导出报表，还是保存一段精美排版内容，前端同学都绕不开它。 但问题来了——市面上的截图工具，比如 html2canvas，虽然用得多，却有一个致命缺陷：慢！ 普通截图动辄 1 秒以上，大一点的 DOM，甚至能直接卡到怀疑人生，用户体验一言难尽。 最近发现一个保存速度惊艳到我的库 snapDOM 。 这货在性能上的表现，完全可以用“碾压”来形容： 👉 相比 html2...
JavaScript 中的this
引言：为什么 让开发者又爱又恨？ 在 JavaScript 的生态系统中， 是一个极具争议的核心概念。它灵活、动态，却又常常“出人意料”。许多开发者在调试时都会遇到类似问题： “为什么 是 ？” “明明是对象的方法，怎么 指向了 ？” “箭头函数到底有没有 ？” 这些问题的背后，是 JavaScript 独特的 执行上下文机制 与 动态绑定策略 。与 Java、C++ 等静态绑定语言不同，JavaScript 的 是在函数 运行时 根据...
提升前端性能的 几个高级 API
一、requestIdleCallback：巧用浏览器空闲时光 当浏览器忙碌于渲染、响应等关键任务时，低优先级任务若贸然插队，极易引发卡顿。requestIdleCallback 应运而生，它能让任务在浏览器闲暇之际执行。 它适用于日志上报等场景。借助以下代码，可以高效调度任务： 这就像在喧嚣的火车站，巧妙地利用等候间隙，迅速而优雅地完成额外任务。 二、IntersectionObserver：智能洞察元素与视口的邂逅 过去，开发者常依...
Blob 居然这么强大
一、什么是 Blob？ Blob（Binary Large Object）是 HTML5 提供的一个用于表示不可变的、原始二进制数据块的对象。 特点： 不可变性：一旦创建，内容不能修改。 可封装任意类型的数据：字符串、ArrayBuffer、TypedArray 等。 支持 MIME 类型描述，方便浏览器识别用途。 示例： 二、Base64 编码的前世今生 虽然名字听起来像是某种“64进制”，但实际上它是一种 编码方式 ，不是数学意义上...
JavaScript 运行机制详解:再谈 Event Loop
常常在各种场合被问到类似下面代码的输出顺序。 如果你能毫不犹豫地答出 ，并解释其原因，那么你对 JS 的异步机制已经有了不错的理解。如果你还有一丝困惑，希望本文能帮助你彻底梳理清楚。 这个问题的背后，是整个 JavaScript 的运行模型（runtime model），也就是我们常说的“事件循环”（Event Loop）。理解它，是前端工程师进阶的必经之路。 为什么 JavaScript 是单线程？ 首先，我们必须记住一个基本事实：...
原型链 & this 指向总结
一、JavaScript 原型链 1\. 基础概念 每个对象都有一个 内部属性 \[\[Prototype\]\] ，可以通过 或 访问。 构造函数 有一个 属性，指向一个对象，这个对象作为实例的原型。 查找属性的顺序： 实例 → 原型 → 原型的原型 … → Object.prototype → null 2\. 典型例题示意 | 表达式 | 值/说明 | | | | | | 1 （实例自身没有，去原型链找） | | | Foo.pr...