做前端这几年，真的受够了那些所谓的“最佳实践”。

每次开会，产品经理拿着大厂背书的PPT，满嘴LCP、FCP、CLS，听得我头皮发麻。然后转头就给我加一堆花里胡哨的动画，问我为什么页面加载慢。我心想，你图片都不压缩，加载个4K原图，神仙也救不了你。

最近重读《高性能网站建设进阶指南pdf》，虽然这书有点年头了，但里面的核心逻辑，到现在依然扎心。很多人觉得这是老黄历，其实不然。技术栈在变，React、Vue、Svelte满天飞，但浏览器渲染的原理没变。HTTP协议也没变。

咱们来点实在的。

第一，减少HTTP请求。

这句话被说烂了，但真做到的没几个。我见过一个项目，为了追求所谓的“模块化”，把一个小图标拆成几十个SVG，每个都单独请求。结果首屏加载，光图标就发了五十多个请求。浏览器并发连接数有限，后面全排队。

合并资源，按需加载，这是基本功。别搞那些花哨的代码分割，如果业务逻辑没那么复杂，直接上bundle，反而更稳。

第二，使用CDN。

别省那点钱。CDN不是奢侈品，是必需品。特别是做国内业务，节点分布直接决定用户体验。我有个朋友，服务器在上海，用户主要在东北。每次加载静态资源都要横跨半个中国，延迟高达200ms。换成CDN后，直接降到20ms以内。这差距，用户感觉得到。

第三，压缩与优化。

图片压缩，别用PS导出一遍就完事。要用工具，比如ImageOptim或者在线的TinyPNG。文字压缩，gzip、brotli，服务器配置好。代码压缩，terser、cssnano，该上的上。

我看过一个案例，一个电商首页，首屏图片没优化，总大小超过5MB。优化后，通过WebP格式和懒加载，压到800KB。加载速度提升了三倍。这就是钱啊。

第四，缓存策略。

强缓存和协商缓存，得配合好。静态资源，版本号命名，强缓存。动态内容，协商缓存。别搞混了。我见过有人把API接口也设了强缓存，结果数据变了，前端还显示旧的，用户投诉不断。

第五，渲染优化。

JS执行阻塞渲染，这是大忌。把非关键JS放到底部，或者用async、defer。CSS放头部，避免重排重绘。别在JS里频繁操作DOM，批量更新。

这些道理，谁都知道。但执行起来，难。

为什么？因为懒。因为赶进度。因为没人检查。

很多团队，代码审查流于形式。性能测试，只在最后上线前跑一次。发现问题，再改，成本巨大。

《高性能网站建设进阶指南pdf》里提到的很多细节，比如避免空src的img标签，比如使用font-display: swap，这些看似小事，积少成多，就是性能瓶颈。

我现在带团队，第一件事就是立规矩。代码提交前，必须跑Lighthouse。分数低于90，打回重写。别跟我扯业务紧急，紧急不是烂代码的借口。

性能优化，不是一次性的工作，是持续的过程。

你要监控，要分析，要迭代。

别指望一次优化，永保平安。浏览器在更新，用户设备在升级，网络环境在变化。

你得跟上。

最后说句得罪人的话。

那些还在用jQuery写大型项目的，该醒醒了。不是jQuery不好，是时代变了。

用现代的工具，做现代的事。

高性能，不是炫技，是对用户的尊重。

你加载慢一秒，用户流失率可能增加百分之几。

这钱，你亏得起吗？

反正我亏不起。

所以，别整那些虚的。

把《高性能网站建设进阶指南pdf》里的建议，一条条落地。

从压缩图片开始，从合并请求开始，从配置CDN开始。

别等用户骂娘了，再后悔。

真的，别装。

承认自己做得不好，才能变得更好。

共勉。