任鹏个人博客

pren 发布于 2026-09-21

浏览器存储是前端开发中最常打交道的底层能力之一。从早期只有 Cookie 可用，到 HTML5 引入 Web Storage，再到 IndexedDB 提供结构化数据库能力，四种方案各有明确的适用边界。选错存储方案，轻则代码臃肿，重则引发性能瓶颈或安全问题。本文从容量、生命周期、...

阅读(11)评论(0)赞 (0)

pren 发布于 2026-09-21

前端构建工具的演进，本质上是一场关于开发体验与构建性能的持续博弈。从早期的手动合并脚本，到 Grunt 的任务自动化，再到 Webpack 的模块化打包，直至 Vite 带来的原生 ESM 开发服务器，每一次迭代都在解决上一代工具暴露出的核心矛盾。理解这条演进脉络，不仅能帮你选对...

阅读(10)评论(0)赞 (0)

pren 发布于 2026-09-21

实时通信能力已经成为现代 Web 应用的基础设施。无论是聊天消息、协同编辑、股票行情还是任务进度推送，开发者都需要在浏览器与服务端之间建立一条“持续在线”的数据通道。在众多技术方案中，WebSocket 和 ServerSent Events（SSE）是最常被拿来比较的两种。它们...

阅读(11)评论(0)赞 (0)

pren 发布于 2026-09-21

在移动互联网和弱网环境依然普遍存在的今天，用户对 Web 应用的期待早已不再是“必须有网才能用”。无论是地铁里查看待办清单，还是飞机上继续编辑文档，离线优先（OfflineFirst）的设计理念正在成为现代 Web 应用的重要标准。而在浏览器提供的诸多存储方案中，IndexedD...

阅读(11)评论(0)赞 (0)

pren 发布于 2026-09-21

为什么需要 Service Worker 在移动互联网时代，用户对 Web 应用的期望已经不再局限于“联网才能使用”。地铁隧道、电梯间、飞机上——网络不稳定甚至完全断开的场景比比皆是。传统的 HTTP 缓存虽然能加速资源加载，但它完全依赖浏览器和服务器之间的协议约定，开发者能做的...

阅读(9)评论(0)赞 (0)

pren 发布于 2026-09-21

为什么前端需要路由 在传统多页应用中，每次页面跳转都由服务器返回一份全新的 HTML，浏览器负责重新渲染。而单页应用（SPA）把这一职责转移到了客户端：页面只加载一次，后续的“跳转”由 JavaScript 拦截并动态替换视图内容。前端路由就是这套机制的核心，它决定了 URL 如...

阅读(9)评论(0)赞 (0)

pren 发布于 2026-09-21

在过去十年里，前端性能优化的核心思路几乎都围绕着一个关键词展开：减少请求。雪碧图、文件合并、内联脚本、域名分片，这些手段的共同目标都是绕开 HTTP/1.1 的队头阻塞问题。但当 HTTP/2 和 HTTP/3 逐渐成为主流，很多传统优化手段反而变成了负优化。这篇文章不打算复述协...

阅读(8)评论(0)赞 (0)

pren 发布于 2026-09-21

为什么会有跨域问题？ 要理解 CORS，先得理解浏览器为什么要限制跨域请求。这一切的根源是同源策略（SameOrigin Policy）。 同源策略是浏览器最核心的安全机制之一。所谓“同源”，指的是协议、域名、端口三者完全相同。比如 https://example.com:443...

阅读(8)评论(0)赞 (0)

pren 发布于 2026-09-21

为什么我们需要理解事件循环？ JavaScript 是一门单线程语言，这意味着它在任意时刻只能执行一个任务。然而，我们在日常开发中却经常写出 setTimeout、Promise、requestAnimationFrame 等看似“并行”的代码。浏览器究竟是如何在单线程下协调这些...

阅读(11)评论(0)赞 (0)

pren 发布于 2026-09-21

为什么需要 Virtual DOM 在直接操作 DOM 的时代，频繁的 DOM 操作是性能瓶颈的主要来源。每次修改 DOM 都可能触发浏览器的重排（reflow）和重绘（repaint），而这两个过程的代价非常高昂。Virtual DOM 的核心思路是：用 JavaScript ...

阅读(7)评论(0)赞 (0)