#工具实践
前端包体积开始失控后，我一般会先砍哪几类东西
前端首屏慢，很多时候不是代码逻辑太复杂，而是资源下得太多。本文结合图表库、编辑器、图片、字体和第三方 SDK 这些常见来源，聊聊我现在发现包体积变大后，会优先从哪些地方下手。
5月12日
2026
文章归档
文章归档按时间整理
这里按年份整理了文章，查找内容会方便一些。
年份
2026
14 篇记录
这一年
查看文章
#工具实践
前端工程里，我为什么越来越在意接口边界、错误处理和日志
很多前端项目后期难维护，并不是因为组件不够优雅，而是接口返回太散、异常分支没人接、问题出了也查不到。本文结合列表页、表单提交、权限接口和线上排障这些场景，聊聊我为什么现在越来越重视接口边界、错误处理和日志。
5月12日
2026
#React
前端页面变慢时，我一般不是先优化代码，而是先定位瓶颈
性能优化最怕的不是做得不够多，而是还没看清问题就开始改代码。本文结合接口慢、渲染卡、首屏重和列表掉帧这些常见场景，聊聊我现在做前端性能优化时，为什么会先判断瓶颈到底在网络、计算、渲染还是资源体积。
5月12日
2026
#Next.js
在 Next.js 里，我怎么判断页面该静态化、缓存，还是实时请求
Next.js 的强项不只是服务端渲染，更在于它把静态生成、缓存和动态请求放进了一套统一模型里。本文结合博客、价格页、后台看板和搜索结果这些场景，聊聊我现在怎么判断一个页面应该提前生成、设置缓存，还是每次都实时请求。
5月12日
2026
#Vue3
Vue3 项目里，什么时候我会优先写 composable，什么时候不会
Vue3 的 composable 很好用，但不是所有重复逻辑都值得立刻抽。本文结合请求、表单、弹窗、权限判断和页面级状态这些常见场景，聊聊我现在怎么判断一段逻辑应该抽成 composable，还是先老老实实留在组件里。
5月12日
2026
#React
React 项目里，我怎么判断状态该放局部、Context，还是 Zustand
很多 React 项目后期变乱，不是因为状态太多，而是状态放错了层级。本文结合表单、主题、筛选、弹窗和跨页共享这些常见场景，聊聊我现在怎么判断一段状态应该留在组件里、上提到 Context，还是交给 Zustand。
5月12日
2026
#React
在 React 里，什么时候我会把逻辑抽成 hook，什么时候不会
自定义 hook 很方便，但不是所有重复代码都值得立刻抽。本文结合表单、列表请求、弹窗控制和局部状态这些常见场景，聊聊我现在怎么判断一段 React 逻辑到底该不该抽成 hook。
5月9日
2026
#CSS
为什么我现在很少再用 absolute 硬摆页面元素
absolute 很好用，但很多页面一旦开始靠它“摆位置”，后面通常会越来越难维护。本文结合角标、按钮、卡片覆盖层和响应式场景，聊聊我现在什么时候还会用 absolute，什么时候会优先换成更稳定的布局方式。
5月9日
2026
#Next.js
在 Next.js 里，什么内容该放服务端，什么内容该放客户端
刚接触 Next.js 时，很多人最容易混乱的不是语法，而是“这段东西到底该写在服务端还是客户端”。本文不讲抽象概念，直接从博客页、工具页、筛选栏、点赞按钮这些常见场景出发，聊聊我现在的判断方式。
5月9日
2026
#CSS
为什么我现在更喜欢用 gap，而不是给列表项硬写 margin
很多布局问题表面上是在调间距，实际上是在和 margin 的副作用打架。本文结合列表、卡片、导航和响应式场景，聊聊我为什么现在更习惯优先用 gap，以及什么时候 margin 还是更合适。
5月9日
2026
#字体#工具实践
变量字体到底怎么用：从预览、验收到 CSS 落地
变量字体看起来很强大，但真正落到项目里时，很多人卡在“怎么预览、怎么验收、怎么写 CSS”这几个环节。本文会从实际使用场景出发，聊聊变量字体在开发中的基本工作流：先看清字体本身支持什么，再确认轴信息是否可用，最后把预览结果稳定地落到 CSS 和页面里。
4月27日
2026
#Next.js
为什么我在内容站里优先选择 Next.js，而不是传统前后端分离
Next.js 不是万能方案，但对于博客、工具页、专题页这类内容型网站，它在 SEO、渲染策略和开发效率之间给出了一个比较均衡的解法。本文结合实际建站经验，聊聊我为什么会优先选择它。
4月27日
2026
#CSS
Grid进阶：行列组合和区域规划
还在靠“脑补”来写 CSS Grid 布局？面对 grid-template-areas 的引号迷阵和 1fr 的动态缩放，新手往往难以直观理解其背后的空间分配逻辑。本文将带你走进一个手写的 React 交互式“网格实验室”，通过“建筑师”视角，将枯燥的代码拆解为户型设计、空间划分、间距调节三个可视化步骤。告别盲打，让你的 Grid 布局逻辑从此肉眼可见！
1月7日
2026
#CSS
Grid 进阶：对齐与间距
Grid 全功能调试看板：一个让 CSS Grid 布局“所见即所得”的工具。支持实时调节间距（Gap）、整体对齐（Content）及单元格对齐（Items）。通过图形化控制，帮助用户直观理解 Grid 布局逻辑，并一键获取对应的 CSS 样式代码，大幅提升布局开发效率。
1月6日
2026
年份
2025
2 篇记录