工具

我的写法，亲测靠谱 做前端这几年，性能优化从“锦上添花”变成了“上线必过”。我一开始也以为加个懒加载、压缩下图片就完事了，结果线上一跑，Lighthouse 分数还是 40 多，用户反馈“卡得像幻灯片...

又踩坑了，自定义审计规则不生效 上周在搞一个内部工具的性能优化，想用 Lighthouse 的自定义审计（Custom Audit）来检测我们自己的一些业务指标。结果折腾了半天，写好的规则死活不跑，L...

为什么我又要折腾 Commit 规范？ 说实话，我一开始对 Commit 规范是无感的。自己写代码，自己看，随便写个“fix bug”不也挺好？但自从项目上了 CI/CD、开始自动生成 CHANGEL...

我的 Monorepo 写法，亲测靠谱 我折腾 Monorepo 已经快三年了，从一开始用 Lerna 硬扛，到后来迁移到 pnpm + workspace，踩过的坑能写半本《前端避雷手册》。现在项目...

先上代码：懒加载图片亲测有效 我之前做的一个项目首页加载巨慢，首屏白屏将近3秒。打开 Network 一看，好家伙，几十张高清图一股脑全在 HTML 里用 <img src="..."> ...

先看效果，再看代码 最近在重构一个老项目，团队里新来的同事提了个 PR，箭头函数写得五花八门：有的带括号，有的不带，还有的单参数加了括号但多参数又没加。我一看就头大，赶紧在 Prettier 配置里加...

项目初期的技术选型 上个月接了个老项目重构，前端资源包体积大得离谱——首屏 JS 超过 1.8MB，CSS 近 500KB。用户反馈加载慢，尤其在弱网环境下基本要等 5 秒以上。团队内部讨论后，决定先...

又踩坑了，StyleLint 集成搞崩了整个构建流程 上周重构一个老项目，想把 StyleLint 加进去统一 CSS 代码规范。结果一配完，CI 直接红了，本地开发也跑不起来。折腾了快一天，最后发现...

项目初期的技术选型 上个月接了个配置后台的活儿，需求是让运营同学能批量导入商品数据。一开始我直接想用 CSV，毕竟轻量、Excel 友好。但产品那边说他们手头已经有现成的 JSON 文件，而且字段嵌套...

为什么我要折腾 Issue 自动化 最近接手了一个开源项目，Issue 区天天被各种“怎么用”“能不能加个功能”刷屏，看得我头大。手动打标签、关重复 issue、催 PR 更新，这些活儿干多了真上头。...

先看效果，再看代码 上周做商品价格区间筛选功能，用户拖动滑块选最低价和最高价，然后从几千条商品里快速找出匹配的。一开始我用 filter() 暴力遍历，结果卡得不行。后来同事提醒：你这数据是排好序的，...

项目初期的技术选型 最近一个内部管理后台的重构项目，UI框架用了 Ant Design，但样式部分没直接用它的 CSS 变量方案，而是自己搭了一套基于 CSS Modules + PostCSS 的组...

文档这事儿，一开始真没当回事 上个月收尾一个内部工具项目，前端三人小团队，后端甩过来一堆接口文档，格式是 Markdown。我心想：不就是写文档嘛，能有多难？结果第一周就翻车了——同事按文档调接口，愣...

优化前：卡得不行 上周上线一个新功能，用户反馈“点一下要等好几秒才反应”，我一开始以为是后端接口慢，结果打开 DevTools 一看，Network 里 API 响应才 200ms，但整个页面从点击到...

优化前：卡得不行 上周上线一个新功能，页面里一堆参数筛选器：日期范围、状态多选、分类下拉、关键词搜索……全靠 URL 的 searchParams 同步。结果 QA 一测就喊：“点一下筛选，页面卡两秒...

先看效果，再看代码 上周上线一个后台管理页，打包后 vendor.js 有 1.2MB。我盯着 webpack-bundle-analyzer 的饼图看了三分钟，叹了口气——又来了。 点开一看，lod...

项目初期的技术选型 去年年底接手一个内部运营后台，需求挺典型：一堆表单、配置项、状态开关，要支持多语言、主题切换、权限粒度控制……本来想直接上 Ant Design Pro，结果发现 UI 层级太重，...

谁更灵活？谁更省事？ 最近给团队新搭一个组件库的发布流程，又翻出来 CLI 工具这事。不是那种“写个 hello world 就完事”的玩具 CLI，而是真要跑在 CI 里、要支持多环境配置、要能本地...

谁更灵活？谁更省事？Vitest、Jest 和 Cypress 的真实对比 我写这篇不是因为闲得慌，是上周又在 CI 上被 Jest 卡了 4 分钟——就跑 80 个单元测试，它自己先干起了“加载动画...

优化前：卡得不行 上个月上线一个数据看板，用 Stash 暂存用户筛选状态（比如时间范围、指标分组、排序字段），方便刷新后还原。结果一上线就被产品拉着连问三遍：“为啥点个筛选要等5秒才响应？”我打开控...