前端

会用 Promise 和懂 Promise 是两回事。这篇从三个状态、then 的注册与触发讲起,一步步手写一个符合 Promise/A+ 核心语义的实现,把异步、链式调用、值穿透、错误冒泡这些机制彻底讲明白。

SPA 切换页面不刷新,URL 还能变、还能前进后退,这是怎么做到的?这篇讲清前端路由的两种实现——hash 模式和 history 模式,并各自手写一个极简路由,最后说清 history 模式为什么需要服务端配合。

用户快速切换 tab,旧请求的响应后回来覆盖了新数据——这种竞态 bug 很隐蔽。AbortController 是 Web 平台取消异步操作的标准方案。这篇讲清它怎么取消 fetch、处理竞态、配合超时,以及框架里的用法。

图片往往是页面里最大的资源,也是拖慢 LCP 的头号嫌疑。这篇从选对格式、用 srcset 适配屏幕、懒加载、到防止布局抖动,给一套能直接落地的图片优化清单。

Cookie、localStorage、sessionStorage、IndexedDB 各有各的容量、生命周期和适用场景,选错了要么不安全要么不够用。这篇把浏览器端的主要存储方案放在一起对比,给出一张选型表和常见误区。

面试高频开放题「从 0 到 1 搭一个项目要注意什么」该怎么答?按需求、选型、工程化、架构、质量、安全、部署运维、迭代九个阶段拆解每一步的注意事项与真实踩坑,并给出一个可直接复述的回答框架。

监听元素是否进入视口,过去要靠 scroll 事件加 getBoundingClientRect,既卡又难写。IntersectionObserver 把这件事交给浏览器异步处理。这篇用三个真实场景讲透它的用法和参数。

CSS 自定义属性不只是少写几个颜色值,它能在运行时被 JS 读写、随作用域级联。这篇从 CSS 变量的基础讲到一套完整的明暗主题方案,包含防止刷新闪烁、跟随系统、平滑过渡等实战细节。

事件委托是前端最实用的性能技巧之一,但要真正用对,得先搞懂事件流的三个阶段、target 和 currentTarget 的区别。这篇把事件冒泡、捕获讲透,再落到动态列表、阻止冒泡等真实场景。

扩展运算符只能拷一层,JSON.parse(JSON.stringify) 会丢失一堆类型,structuredClone 又有它的边界。这篇把浅拷贝、深拷贝的各种方案串起来,最后手写一个能处理循环引用和特殊类型的深拷贝。

防抖和节流是前端最常被问、也最常写错的两个工具函数。这篇从搜索框、滚动监听这些真实场景出发,把两者的差别、几种实现变体,以及可取消、Promise 化等进阶写法一次讲清。

泛型不是炫技,而是让类型跟着数据流动的工具。这篇从"为什么需要泛型"讲起,逐步深入约束、keyof、条件类型、映射类型和 infer,最后用几个真实工具类型把它们串起来。

Flexbox 是一维排布的利器,Grid 是二维布局的标准答案。这篇讲清两者的核心模型、各自的适用边界,以及在真实页面里如何把它们组合起来用。

XSS 是"别人的脚本在你的页面上跑",CSRF 是"借你的登录态偷偷办事"。这篇把两类最经典的前端安全问题讲清楚:它们怎么打进来、为什么有效,以及一套能落地的防御组合拳。

同样是刷新页面,为什么有的资源直接命中本地、有的要回服务器问一句、有的又重新下载?这篇把 Cache-Control、ETag、Last-Modified 串成一条决策链路,并给出一套静态资源 + HTML 的实战缓存策略。

为什么 setTimeout 总是慢半拍?Promise.then 凭什么插队?这篇从单线程模型出发,把调用栈、任务队列、宏任务与微任务、以及渲染时机串成一条完整的执行链路。

AI 工具让纯界面开发的天花板越来越明显。前端要不要转全栈?这篇从职业发展、技术本质和学习策略三个角度,拆清楚优势、短板和一条更踏实的学习路线。

Vue 3 的响应式不是数据一变就立刻改 DOM,中间还有依赖收集、任务调度、批量更新和 nextTick。本文用组件更新链路解释为什么读 DOM 会拿到旧值,以及如何写出更稳定的更新逻辑。

Nuxt 的 SSR 能带来更快首屏和更好的 SEO,但服务端渲染结果必须和客户端首次渲染对得上。本文梳理水合不一致的常见来源,以及在数据、时间、浏览器 API 和条件渲染上的处理方式。

性能优化不应该只在页面变慢后救火,更应该提前设定预算、持续测量并接入发布流程。本文介绍如何围绕 LCP、INP、CLS、资源体积和接口耗时建立一套可执行的前端性能预算。

Monorepo 不只是把多个项目放进同一个仓库,真正的难点是包边界、依赖方向、构建缓存和发布规则。本文用前端团队视角梳理如何设计 packages、apps 和 shared 模块,避免仓库越长越乱。

媒体查询关心视口宽度,但组件真正需要关心的往往是自己所在容器的空间。本文从卡片、侧栏和网格布局出发,讲清楚 Container Queries 的使用方式、适用场景和常见边界。

前端状态管理不是先选 Pinia 或 Redux,而是先判断状态属于哪里。本文用一套分层方法梳理组件状态、URL 状态、客户端缓存和服务端状态的设计边界。

原型链讲"对象怎么找属性",执行上下文讲"代码怎么跑起来",这一篇讲"标识符怎么被查找"。把全局/函数/块级作用域、自由变量、词法(静态)作用域、闭包本质、作用域和执行上下文的区别一次性讲透。

原型链讲"对象怎么找属性",执行上下文 + 调用栈讲的是"代码怎么跑起来"。这一篇把全局/函数上下文、创建阶段和执行阶段的两步流程、变量提升的本质、栈溢出和 let/const 的暂时性死区一次性讲透。

原型与原型链是 JS 最被反复"复习"也最容易绕晕的话题。这篇从"为什么有原型"开始,把 __proto__、prototype、constructor 三者画在一张图里,再讲清楚 ES6 class 只是语法糖,以及实战里 7 个常见坑。

一篇足够长的 RxJS 入门到进阶 —— Observable 是什么、为什么需要操作符、Subject 家族怎么用、热流 vs 冷流、内存泄漏怎么防,以及它跟 Promise / async-await 到底差在哪里。

从“能写”到“写得清楚”——把 setup 里的逻辑组织得更容易维护。

介绍 frontmatter、代码高亮、目录等常用能力。

常用 Utility Types 速查与使用技巧。