前端2023年11月26日 22:21
AMD 和 ESModule 有什么区别？为什么 ESModule 能做 Tree-Shaking？核心区别：**AMD 是运行时加载，ESModule 是编译时静态分析**。这个根本差异决定了 ESModule 能做 Tree-Shaking，AMD 做不了。
AMD 用 `define(['dep1', 'dep2'], callback)` 声明模块，依赖列表虽然写死了，但 callback 里的逻辑是运行时才执行的——你完全可以在回调里根据条件 `require` 不同的模块。ESModule 的 `import/export` 必须写在模块顶层，引擎在解析代码时（还没执行）就能确定整个依赖图。Tree-Shaking 就靠这个：Webpack/Rollup 静态扫描 `im...
乐闻
前端2023年11月26日 22:14
如何用 JavaScript 广度优先遍历 DOM 树？用队列。从根节点入队，每次出队一个节点处理，再把它的子节点依次入队，循环到队列为空。
```javascript
function bfsTraverse(root) {
if (!root) return;
const queue = [root];
while (queue.length) {
const node = queue.shift();
console.log(node.tagName);
for (const child of node.children) {
queue.push(child);
}
}
}...前端2023年11月22日 22:18
什么是 JS Bridge？WebView 和原生通信有哪几种方式？JS Bridge 是 WebView 里 JS 和原生 App 之间互相调用的通信桥梁，Hybrid App 开发中几乎离不开它。实现方式主要有三种：**URL Scheme 拦截**——JS 通过 iframe.src 发自定义 scheme URL（如 `myapp://camera/open`），原生在 `shouldOverrideUrlLoading` 中拦截解析并执行，只能 JS→原生单向通信，且连续调用会丢消息需要队列化；**注入 API 对象**——原生通过 `addJavascriptInterface`（Android）或 `WKScriptMessageHandl...前端2023年11月21日 11:34
移动端如何画 0.5px 细线？3 种方案原理与实现移动端高清屏上 `1px` 线太粗，本质是设备像素比（DPR）的锅。CSS 的 `1px` 在 2 倍屏上渲染成 2 个物理像素，在 3 倍屏上渲染成 3 个。想要真正 0.5px 的细线，业界主流有三种方案。
**transform + 伪元素**是最稳的：用 `::after` 画 1px 边框，再 `scaleY(0.5)` 缩一半。伪元素独立缩放，不影响容器内子元素。需要适配 3 倍屏时，DPR 为 3 的设备用 `scaleY(0.333)`。
```css
.hairline::after {
content: '';
position: absolute;
...前端2023年11月22日 23:10
AMD 和 CommonJS 的区别是什么？一句话：**AMD 为浏览器设计，异步加载依赖；CommonJS 为 Node.js 设计，同步加载依赖。**
这个根本差异决定了它们在语法、执行时机、输出行为上的所有不同。
## 核心差异对照
| | AMD | CommonJS |
|---|---|---|
| 加载方式 | 异步（网络请求不阻塞） | 同步（磁盘读取即返回） |
| 声明语法 | `define(['dep'], fn)` | `require('dep')` |
| 依赖时机 | 前置声明，并行加载后执行 | 运行时加载，顺序执行 |
| 输出类型 | 值的引用（模块内变更对外可见） | 值的拷贝（req...前端2月16日 23:06
Bun 的启动速度和依赖安装速度为什么快？Bun 的启动速度和依赖安装速度之所以远超 Node.js 和 npm，核心原因在于它选择了完全不同的底层引擎和架构方案。下面从启动速度和依赖安装两个维度分别说明。
## 启动速度快的原因
Bun 启动速度远快于 Node.js，根本原因在于使用了 **JavaScriptCore（JSC）引擎**而非 V8，配合 **Zig 语言**编写的运行时实现。这和很多人印象中的"Bun 基于 V8"完全相反——Bun 从未使用 V8，它选择的是 WebKit/Safari 同源的 JSC 引擎。下面从引擎、语言、模块三个层面展开。
### JavaScriptCore 的分层编译策略
...前端2月16日 23:07
Bun 的 runtime 是如何设计的？和 Node.js 的事件循环有何不同？Bun 选用 JavaScriptCore 引擎 + Zig 语言实现运行时，采用"原生优先"架构绕过 libuv 抽象层，直接与操作系统 I/O 原语交互。Node.js 基于 V8 + libuv 的多阶段事件循环模型，两者在引擎选型、事件循环实现和性能表现上存在根本差异。
## 核心架构差异
Node.js 的执行链路：OS TCP → libuv 事件循环 → http_parser(C 绑定) → V8 JS 对象 → 处理函数
Bun 的执行链路：OS TCP → 原生 uWebSockets(C/Zig) → JavaScriptCore → 处理函数
Bun 少了...前端2月16日 23:02
Bun 的包管理器 bun install 与 npm、yarn、pnpm 有什么区别？## 四大包管理器的定位
- **npm**：Node.js 官方默认包管理器，随 Node.js 安装，采用扁平化依赖树，生态最成熟但安装速度最慢。
- **yarn**：Facebook（现 Meta）开发，Yarn Classic（v1）已进入维护模式，Yarn Berry（v4）引入 Plug'n'Play 引擎，消除 `node_modules` 实现零安装。
- **pnpm**：基于硬链接和全局 store 机制，通过符号链接指向全局唯一的包副本，节省 50-70% 磁盘空间，严格隔离依赖防止幽灵依赖。
- **Bun**：由 Jarred Sumner 开发，使用 Zi...服务端2月25日 23:35
如何获取 Canvas 的 2D 上下文并使用基本绘制方法？## 获取 Canvas 2D 上下文
通过 `canvas.getContext('2d')` 获取 2D 渲染上下文，返回 `CanvasRenderingContext2D` 对象：
```javascript
const canvas = document.getElementById('myCanvas');
const ctx = canvas.getContext('2d');
```
实际开发中建议做兼容性检查：
```javascript
const canvas = document.querySelector('canvas');
if (!canvas?....前端2月16日 21:07
Tauri 支持哪些前端框架？Tauri 是一个用 Rust 构建后端、用 Web 技术构建前端的跨平台应用框架。它的核心设计是前后端完全解耦——前端通过系统 Webview 渲染界面，后端通过 Rust 处理系统级操作，两者经 IPC 通信。这意味着 Tauri 天然支持任何基于 Web 标准的前端框架，开发者无需被特定技术栈限制。
## Tauri 为什么能支持所有前端框架
Tauri 的架构分两层：
- **前端层**：运行在系统 Webview 中，使用 HTML、CSS、JavaScript 渲染界面。任何能输出 DOM 的技术都能跑在这里。
- **后端层**：Rust 编写的原生代码，处理文件系统...