Web高性能

月初，财务把上个月的 OpenAI 账单甩在了 咱们 CTO 的桌子上。 数字很惊人：9000 刀。 我们那个所谓AI 赋能 的内部知识库助手，每个月光 Token 费就要烧掉一辆比亚迪秦PLUS😃。

上周面了一个自称5年全栈的兄弟🤔。 简历漂亮得像报菜名：精通 Vue/React，熟悉 Node.js/Go，玩过 K8s，能画原型图，甚至还写过两个 Flutter App。 我只问了一个问题：如果

什么是设备指纹？ 在讲实现之前，先纠正一个误区：设备指纹（Device Fingerprint）不是为了知道你是张三，而是为了知道 这台设备是编号 9527。 它的核心逻辑只有一条：利用浏览器暴露的硬

开始在重构旧项目的最近一个月，我每天打开项目代码，心情都像是在上坟😖。 这个项目是5年前的老代码，说是用了 TypeScript，但含 any 量高达 80%。 User 是 any，Response

下午茶时间，我给隔壁的后端老哥发了个链接。 他毫无防备地点开了。 三秒钟后，我听到他那台 16G 内存的 MacBook Pro 风扇开始狂啸，仿佛要起飞🤣。 五秒钟后，他的鼠标指针变成了彩虹圈，卡在

兄弟们，前天的瓜都吃了吗？🤣 说实话，作为一名还在写代码的打工仔，看到前天晚上快手那个热搜，我手里捧着的咖啡都不香了，后背一阵发凉。 12月22日晚上10点，正是流量最猛的时候，快手直播间突然失控。不

大家好😁。 上上周，我们在例会上送别了团队里的一位技术大牛，阿K。 说实话，阿K 的技术底子很强。他能手写 Webpack 插件，熟读 ECMA 规范，对 Chrome 的渲染管线了如指掌。 但最终，

大家好，来了来了😁。 如果你问我，电影史上有哪个镜头，让无数少年瞬间燃起了对计算机世界的无限向往？ 我会毫不犹豫地回答： 《黑客帝国》（The Matrix）开场的那一幕数字雨。 无数绿色的字符，像瀑

大家好，我来了😁。 前端代码在浏览器里是裸奔的。——这几乎是所有开发者的共识。 只要用户按一下 F12，你的源码、你的接口、你的数据结构，全部一览无余。黑客可以修改你的变量，脚本小子可以刷你的接口，竞

大家好😁。 上个月 Code Review，我拦下了一个新人的代码。 他写了一个转账功能，前端做了极其严密的校验： 金额必须是数字。 金额必须大于 0。 余额不足时，提交按钮是 disabled 的。

大家好，我又来了😁。 我们做性能优化，通常盯着的是 首屏加载速度（FCP, LCP）。我们压缩图片、拆分代码（Code Splitting）、上CDN... 拼了老命把首屏时间从 2s 压到了 1s。

大家好!😁。 Code Review 的时候，我最怕看到什么？ 不是复杂的算法，也不是什么正则。而是明明一个 HTML 标签就能搞定的事，有人非要写几百行 JS + CSS 去重新发明轮子 。 前几天

大家好😁。 还记得我之前那篇吐槽《当 Ant Design 成了你最大的技术债》的文章吗😂？在那篇文章里，我痛斥了 Antd 的黑盒样式、难以覆盖的 !important 地狱，以及臃肿的 CSS-i

大家好！ 最近面试，我发现一个很有意思的事情。几乎每个高级前端的简历上，都专门开辟了一栏，叫性能优化。 里面写满了各种高大上的名词😖： 看着这些，我通常会问一个问题： 你为什么要渲染一个有一万条数据的

大家好😁 如果你是一个前端，尤其是在B端（中后台）领域，Ant Design（antd）这个名字，你不可能没听过。 在过去的5年里，我们团队的所有新项目，技术选型里的第一行，永远是antd。它专业、开

大家好，我来了🙂。 我们团队，维护着一个有5年历史的史诗级中后台项目😖。在这座屎山里，有一个叫handleOrderSubmit.js的文件。 可以下载瞧一瞧 有多屎👉 handleOrderSubm

前几天，我们团队CI/CD流水线挂了，一个新来的前端同事跑来问我：“老大，我本地pnpm build明明是好的，为什么一到CI就报错？” 我看了看日志，node-gyp编译失败。我问他：“你本地的No

最近Code Review的时候，我看到我们组一个很聪明的年轻同事，用观察者模式，写了一个极其复杂的全局状态订阅系统，就为了在一个组件里，响应另一个不相关的组件的点击事件。 比较常见的场景：点击 Bu

随着后端微服务架构的普及，以及客户端形态（Web、iOS、小程序、桌面端）的日益多样化，我们前端开发常常会面临一个很尴尬的局面： 后端提供的API，往往是通用的、面向数据的，而我们前端需要的，却是定制

最近在Code Review里，我看到一个新同学在一个vite.config.js里，习惯性地加上了@vitejs/plugin-legacy，用来支持旧版浏览器。 我问他：“我们的目标用户里，真的还