全部文章
React 应用的分层
跟着 Juntao Qiu 关于 React 模块化的文章，把支付页面拆成 view、model、data 三层。还整理了亲自运行示例仓库时发现的 useMemo 失效和 fetch 反复调用，以及什么时候该用这种结构的判断。
决策模型，Jev 与 Kev
有个模型不返回文本，只返回概率。confidence 不是学出来的值而是算术，校准也不是模型的性质而是分布的性质。本文用公开的 Jev 实测 5,743 条，以及把复现实现 Kev 直接跑在本博客音译闸门上的结果来验证。
overlay-kit
把用全局状态保存模态框开关的代码换成一行 await，我得到了什么又失去了什么。顺着源码追踪 overlay-kit 的事件、reducer 与 openAsync 核心逻辑，并亲手测试重新打开的行为，直到发现它与文档不符之处。
LLM 的校准与过度自信
校准不是准确率，而是知道自己能答对百分之几的能力。本文整理 ECE 如何衡量这种偏离，GPT-4 技术报告中 post-training 后 ECE 从 0.007 恶化到 0.074 的结果，以及其原因目前弄清到了什么程度。
共享语言
当产品经理和 developer 用同一个词指代不同事物时该怎么办。本文借助 Evans 的 ubiquitous language 与 Clark 的 grounding 理论，梳理跨职能沟通失败的结构，并整理出对齐分辨率的实务工具。
Harness（系统）工程
从 prompt engineering 到 context engineering，下一步将走向哪里？本文以 Anthropic 工程博客近期呈现的脉络为线索，梳理 harness 设计、eval、containment（隔离）三个方向及其与 token 节省讨论的联系。
Kalyx
整理了我为什么开发 React headless DatePicker Kalyx，以及它与 Ark UI、React Aria、react-day-picker 的区别。结合代码与实测，讲解 ISO 8601 UTC 值模型、基于 Intl 的夏令时处理和覆盖全部 IANA 时区的属性测试。
AI Token 节省方法
AI 编程工具的 Token 成本从哪里产生，又该如何降低。文章结合 Anthropic 价格表，用 React POC 实测 prompt caching、subagent、精简 MCP、context engineering 与 Cursor Composer 等已验证的节省策略。
Token 的工作原理
AI Token 既不是单词也不是字符。本文系统讲解 BPE tokenizer 如何生成 Token、Token 如何变为 embedding 向量并进入模型、为何 decode 输出比 prefill 输入更贵，以及 KV cache 与 prompt caching 降低成本的原理。
上下文文件
梳理 CLAUDE.md、AGENTS.md、SKILL.md 与 Cursor rules 何时、如何被智能体读取，并根据 CLAUDE.md 以 user message 注入的机制、上下文遗忘与 ETH Zurich 研究，给出上下文文件该写什么的判断标准。
代码智能的四个层级
将降低 AI 编程智能体查找相关代码成本的工具分为四个层级进行比较，梳理 Repomix 等上下文打包、Aider 的 tree-sitter 仓库地图、CodeGraph 知识图谱，以及 Serena 等基于 LSP 的工具分别能理解代码到什么程度。
MCP 与 function calling
从协议结构梳理 MCP（Model Context Protocol）与 function calling 的区别：六种 primitive、stdio 与 Streamable HTTP、从 tools/list 到 tool_use 循环的调用流程，以及 Tool Poisoning 等安全问题。
状态管理
本文把前端状态分为局部、全局、服务端、表单、URL、外部和守卫 7 类，分别梳理适合的工具与边界，最后归纳为创建状态之前要问的四个问题。
领域模型
以综合所得税为例，讨论前端的领域逻辑应该放在哪里：把混在组件里的税额计算拆成纯函数，并梳理贫血领域模型、API 响应转换层、ViewModel 分离、类与函数式的内聚差异，以及拆分应在何处停止的标准。
领域术语
以 Eric Evans 与 Martin Fowler 的定义，梳理领域、领域模型、领域对象与领域对象模型的区别，并用综合所得税的例子说明为什么 API 响应类型不是领域模型，以及如何区分实体与值对象。
Toss Frontend Fundamentals 模拟考试第 2 期重构复盘
分享在 Toss Frontend Fundamentals 模拟考试第 2 期中重构会议室预订应用的经历。文中梳理单体组件的拆分方式、领域逻辑的提取过程，以及以测试为基础推进重构的完整步骤，并记录其中做出的取舍与复盘，供准备同类练习的开发者参考。
AI 前端工程师
在 AI 代替人编写代码的时代，前端工程师该如何成长并生存下去？本文基于 Karpathy 的 agentic engineering、Vercel v0、Stack Overflow Survey、METR 研究等可靠资料，梳理以验证、规格与判断力为核心的新能力和学习策略。
抽象
前端开发中的抽象究竟是什么，好的抽象与坏的抽象又有何不同。本文从 React 组件、自定义 hook 与函数设计的角度，梳理抽象层级的统一、揭示意图的命名，以及把部件组合起来的设计方法，并讨论抽象泄漏带来的代价，以及可以直接套用到现有代码里的重构方向。
queryKey
梳理 TanStack Query 的 queryKey 管理方式如何从内联数组、常量对象、query key factory 演进到 v5 的 queryOptions，并从实践角度讨论编写规则、DataTag 类型推断与缓存失效模式。
queryKey 比较原理
梳理 TanStack Query 如何把每次渲染新建的 queryKey 数组判定为同一个键：hashKey 序列化如何改变键顺序、undefined、Map 等值，以及过滤器如何比较键的结构。
ErrorBoundary 放在哪里
在使用 React Router 与 TanStack Query 的页面里，用已安装的源码核对 ErrorBoundary 该放几个、放在哪里的标准：路由、屏幕、区域各自接收的错误与撤回方式，统一 fallback 的方法，以及重试条件。
重试按钮为什么不起作用
用已安装的源码核对在 react-error-boundary 的 fallback 上按重试却回到同一个 fallback 的三种情况：查询错误用 QueryErrorResetBoundary，渲染错误用 queryFn 里的检查，React.lazy 分块失败用刷新来解开。
错误的传播
把同一个错误从七个位置抛出去，只有四个能到达 ErrorBoundary。这篇文章用官方文档和本地安装的源码确认编译期、渲染与生命周期、服务端数据、页面切换、外部库、事件与异步分别传播到哪里。
彻底掌握 React Fiber
基于 React 源码，深入分析 React Fiber 架构，从 Stack Reconciler、Fiber 节点结构、双缓冲、Lane 优先级、Work Loop、Render 与 Commit Phase 到 Concurrent Features。
React 为什么使用 MessageChannel
结合 React 的 PR 记录与在 Chrome 中实测的 setTimeout 4ms 延迟，梳理 React Scheduler 为何不用 requestIdleCallback、requestAnimationFrame、setTimeout，而用 MessageChannel 调度工作。
Biome 能取代 ESLint 和 Prettier 吗？
对比 Biome 与 ESLint、Prettier 组合的 lint 与格式化性能。基于把这款 Rust 一体化工具链引入实际项目的经验，整理配置迁移的具体步骤、容易卡住的地方，以及它目前能替代的范围和仍然遗留下来的问题，帮助你判断现在是否值得迁移。
Zustand，你到底为什么是 ProviderLess？
通过阅读源码深入探究 Zustand 无需 Provider 就能管理状态的原理。文中比较它与 React Context API 的差异，梳理基于模块作用域的 store 设计，以及 useSyncExternalStore 的订阅机制。
理解压缩算法
对比 ZIP、GZIP、ZSTD、BZIP2、XZ、Brotli 的结构、速度与压缩率，解释 tar.gz 比 zip 更小的固实归档原理，并整理上传构建产物时该选 tar.gz 还是 tar.zst。
LZ77 与 LZ78 的区别
整理 LZ77 与 LZ78 处理字典的方式有何不同：滑动窗口与显式字典的差异、遗忘旧内容方式的差异，以及经由 DEFLATE 延续到 ZIP、GZIP、Zstd 的 LZ77 一系谱系。