前端
开发
fanchenblog.com · 技术分享 · 凡尘前端笔记

代码如诗,
构筑前端世界

记录 HTML/CSS、JavaScript、React、Vue 等前端技术分享与实战心得。 从基础语法到工程化架构,从页面交互到性能优化,于一行行代码中,看见前端的星辰大海。

前端开发 · 共 86 篇文章

Vue.js 2026-10-15

Vue3 Composition API 实战:组合式函数的设计哲学

通过一个完整的表单组件案例,深入理解 Composition API 相对 Options API 的优势,以及 composables 的复用模式。从基础到进阶,一篇讲透组合式函数的精髓,让你的 Vue3 代码更加优雅可维护。

4.6k 12 约 8 分钟
阅读全文
React 2026-10-28

React Hooks 使用心得:useState 与 useEffect 的正确打开方式

总结三年 React 开发中遇到的 Hooks 常见误用,包括闭包陷阱、依赖数组、副作用清理等关键问题。帮助你避开 90% 的 Hooks 暗坑,编写出更加健壮和可维护的函数组件。

4.1k 8 约 6 分钟
阅读全文
JavaScript 2026-11-05

JavaScript 异步编程深入理解:Promise 与 async/await

从回调地狱出发,逐步推导 Promise 的设计思想,再到 async/await 的语法糖本质。结合 Event Loop 机制,彻底弄懂 JavaScript 异步编程的核心原理与最佳实践。

7.4k 25 约 12 分钟
阅读全文
CSS3 2026-11-12

CSS Grid 布局完全指南:从入门到精通

通过 10 个实战案例彻底搞懂 Grid 容器与项目属性,掌握二维布局的精髓。告别 Flexbox 在复杂场景下的局限,让你的页面结构更加灵活优雅,响应式开发如虎添翼。

5.8k 15 约 10 分钟
阅读全文
TypeScript 2026-09-18

TypeScript 进阶之路:泛型与高级类型的实战应用

TypeScript 不仅仅是加上类型注解,本文带你深入泛型推断、条件类型、映射类型等高级特性。通过实际业务场景的封装,写出更优雅、更具表现力的类型代码。

3.5k 9 约 9 分钟
阅读全文
前端工程化 2026-09-02

Webpack 与 Vite 的核心差异,以及如何平滑迁移

Vite 凭借原生 ESM 带来了极致的开发体验,但 Webpack 依然是中大型项目的主力。本文对比二者底层原理,并给出一份详尽的项目迁移方案与踩坑记录。

6.2k 18 约 11 分钟
阅读全文
性能优化 2026-08-20

前端性能优化实战:从首屏加载到运行时流畅的全面指南

首屏加载慢?滚动卡顿?本文从网络请求、资源压缩、渲染路径到内存泄漏排查,系统梳理前端性能优化的全链路策略,并结合 Lighthouse 给出量化指标。

9.1k 32 约 15 分钟
阅读全文
浏览器原理 2026-08-05

深入理解浏览器渲染原理:重绘、重排与合成层

了解浏览器是如何将 HTML、CSS 转化为像素的。深入剖析重绘与重排的触发条件,以及如何利用硬件加速和合成层来编写高性能的动画与交互效果。

5.5k 14 约 10 分钟
阅读全文
提示信息