关于我
一个狂热的前端开发者,喜欢折腾各种新技术。从jQuery时代一路走来,经历了Angular、React、Vue的更迭,始终保持着对前端技术的热爱。
日常工作主要是开发企业级中后台系统,业余时间喜欢研究性能优化、工程化方案,偶尔也会写写小程序和移动端项目。
这个博客主要记录我在开发过程中遇到的问题和解决方案,希望能帮助到同样在路上的你。
踩坑记录
前端知识沉淀
JavaScript核心 ▼
事件循环机制
宏任务、微任务执行顺序与队列调度原理
闭包与内存管理
闭包的形成条件、内存泄漏风险与优化
原型链继承
原型链查找机制与多种继承方案对比
Promise实现原理
手写Promise理解异步流程控制
Generator与迭代器
生成器函数与可迭代协议的应用
模块化规范
ESM、CommonJS、AMD模块系统对比
TypeScript进阶 ▼
泛型约束与推断
泛型参数约束、条件类型推断技巧
映射类型
Partial、Required、Readonly实现原理
模板字面量类型
字符串类型操作与类型推导
类型守卫
类型收窄与自定义类型守卫函数
声明合并
接口、命名空间的声明合并规则
类型体操实战
DeepReadonly、DeepPartial等高级类型
React深度 ▼
Fiber架构原理
时间切片、优先级调度与可中断渲染
Diff算法策略
同层比较、key的作用与优化策略
Hooks实现原理
链表结构存储状态与更新队列
并发模式
Concurrent Mode与优先级调度机制
服务端渲染
Next.js SSR/SSG/ISR渲染策略
状态管理演进
Flux、Redux、Zustand架构对比
Vue生态 ▼
响应式系统原理
Proxy依赖收集与触发更新机制
编译器优化
静态提升、PatchFlag与Block Tree
组合式API设计
setup函数与Composable设计模式
虚拟DOM diff
Vue3双端diff算法优化点
KeepAlive原理
组件缓存与LRU缓存策略
Teleport组件
DOM传送门与模态框实现
浏览器原理 ▼
渲染流水线
DOM树、样式计算、布局、绘制、合成
V8引擎优化
JIT编译、内联缓存、隐藏类
垃圾回收机制
分代回收、增量标记、并发回收
缓存策略
强缓存、协商缓存与Service Worker
跨域解决方案
CORS、JSONP、代理与postMessage
安全防护
XSS、CSRF攻击原理与防御策略
工程化实践 ▼
Webpack核心概念
Entry、Loader、Plugin、Chunk关系
Vite原理
ESM开发服务器与Rollup生产构建
Babel编译流程
解析、转换、生成三阶段原理
CI/CD流程
GitHub Actions自动化构建部署
Monorepo管理
Turborepo、Nx多包构建优化
代码规范工具
ESLint、Prettier、Husky配置实践
性能优化 ▼
Core Web Vitals
LCP、FID、CLS指标优化策略
代码分割
动态import与路由懒加载
资源预加载
preload、prefetch、preconnect使用
长列表优化
虚拟滚动与时间分片渲染
内存优化
内存泄漏检测与对象池模式
网络优化
HTTP/2、压缩、CDN加速策略
CSS进阶 ▼
BFC原理与应用
块级格式化上下文与布局隔离
层叠上下文
z-index层叠规则与层叠上下文形成
CSS Containment
contain属性与渲染性能优化
动画性能
GPU加速、will-change与合成层
容器查询
Container Queries响应式组件设计
CSS Houdini
自定义属性与绘制API扩展
Node.js后端 ▼
事件驱动架构
EventEmitter与发布订阅模式
Stream流处理
管道、背压与大文件处理
Cluster集群
多进程模型与负载均衡
Koa中间件
洋葱模型与async/await处理
数据库连接池
连接管理、事务与性能调优
进程通信
IPC、SharedArrayBuffer多进程协作