干了8年Web开发，我总结了2024年还在踩坑的人都忽略的几件事
昨天晚上帮公司面试一个前端，简历上写着”精通React/Vue，熟悉前沿Web技术”，我问他Core Web Vitals的三个指标分别是什么，他支支吾吾半天答不上来。我又问他最近的项目里性能优化做了哪些工作，他说”用了按需加载，图片压缩，差不多就这些”。
面试结束我挺感慨的。我2016年入行写第一行jQuery代码到现在，快8年了，见过太多人沉迷追新框架，React出18了赶紧学，Vue3刚发布就把老项目全重构，却对最基础的用户体验、性能优化、架构设计这些真正决定项目质量的东西一知半解。
现在的Web开发圈特别浮躁，每天都有新名词冒出来，好像你不学就落伍了。但我这几年做了十几个大大小小的项目，踩过的坑能装满一个硬盘，最后发现真正能决定项目成败的，从来不是你会不会用最新的框架，而是那些你以为早就掌握了的”基础”。
别把技术选型做成技术炫技
去年我们团队接了个中小型电商项目，团队里新来的小伙子力主用微前端架构，说现在大厂都在用，技术先进。我问他这个项目一共几个页面？几个开发人员？他说6个页面，3个开发。我当场就否决了。
微前端好不好？当然好，但它是解决大型应用、多团队协作问题的。一个3个人开发的小项目，你搞微前端，最后只会把简单问题复杂化，平白增加维护成本。
我见过太多项目，技术选型完全不看业务场景。明明是个静态内容为主的博客站，非要用SSR搞服务端渲染；明明是个内部使用的管理系统，用户量不过百，非要上微服务拆成十几个服务。最后项目做出来，性能没提升多少，开发成本翻了三倍。
2024年的技术栈选择真的已经很成熟了，我给大家一个我用了好几年的选型思路：
- 前端框架：大型复杂应用选React + Next.js，中小型项目选Vue3 + Vite，企业级团队协作选Angular。别纠结哪个更好，适合你的场景才是最好的。
- 后端：高并发实时应用用Node.js + Fastify，数据密集型、要跟AI/机器学习集成的用Python FastAPI，追求极致性能的用Go。
- 数据库：需要事务支持的用PostgreSQL，灵活模式的用MongoDB，高并发读写的看场景选Cassandra或者时序数据库。
记住，技术是为业务服务的，不是用来装X的。我见过太多项目死在了过度设计上，反而那些用最简单的技术栈解决核心问题的项目，活得好好的。
AI写代码时代，别丢了基础能力
上个月我在GitHub Copilot里输入”写一个用户登录接口，包含密码加密和JWT验证”，10秒就生成了完整的代码。我当时心里咯噔一下，我刚入行的时候写这么个接口至少要半小时，还要查好几次文档。
现在的年轻开发者太幸福了，AI能帮你写样板代码，能帮你查bug，甚至能帮你设计架构。但我也发现了一个问题：很多人离开AI连基本的CRUD都写不利索，生成的代码有安全漏洞也看不出来。
上周我排查一个线上安全问题，发现有个接口直接把用户输入拼到了SQL语句里，明显是AI生成的代码，写的人根本没看就直接用了。要不是我们安全扫描及时发现，指不定出什么大乱子。
我现在给团队定了个规矩：AI生成的代码必须逐行检查，尤其是涉及到数据操作、权限验证的部分。AI是工具，不是你的替身。它能帮你提高效率，但不能替你思考。
现在AI能写代码了，很多人焦虑会不会被替代。我反而觉得这是好事，它把我们从重复性的劳动里解放出来，让我们有更多精力去做更有价值的事情：比如理解业务需求，设计更合理的架构，优化用户体验。这些才是AI暂时替代不了的核心能力。
性能优化已经不是加分项，是生存底线
前阵子我们给一个客户优化电商网站，他们的页面首屏加载时间是7秒，跳出率高达70%。我们花了两周时间优化，把LCP（最大内容绘制）压到了1.8秒，FID（首次输入延迟）控制在80毫秒，CLS（累积布局偏移）降到0.08，上线第一个星期，转化率就涨了27%。
很多开发者对性能优化的理解还停留在”压缩图片、代码分割”的层面，殊不知现在搜索引擎已经把Core Web Vitals作为排名的硬指标。你页面内容再好，加载慢，搜索引擎都不给你流量。更别说用户了，现在的用户耐心越来越差，页面3秒打不开就直接关了，谁等你慢慢加载。
我分享几个我们团队现在做性能优化的标配操作：
- 渲染策略选对：电商类动态内容多的用SSR，内容型站点用SSG，再配合边缘计算，把动态渲染搬到离用户最近的节点，首屏速度能快好几倍。
- 图片一定要优化：全部用AVIF/WebP格式，比JPEG体积小一半以上，再配合响应式图片，根据设备像素密度自动选分辨率。别再让移动端加载4K图了，纯纯的浪费。
- 资源加载顺序要对：关键CSS内联，非关键JS用requestIdleCallback延迟加载，路由组件动态导入，别一上来就把所有资源都加载完。
- 缓存策略要分层：静态资源用CDN缓存，设置immutable长缓存，动态内容用Service Worker做离线缓存，接口数据做本地缓存。能不用请求服务器的就别请求。
- HTTPS是底线，现在还有人网站不用HTTPS的，我真的想不通。
- 依赖管理一定要重视：lock文件要锁定版本，定期跑漏洞扫描，别什么包都往项目里引。
- 权限要做最小原则：数据库账号别给root权限，前端接口要做限流，第三方脚本要加Content Security Policy限制。
- 认证一定要用多因素，别再靠单一密码了，现在密码泄露太常见了。
我现在做项目，性能指标是需求评审的时候就定好的，开发过程中每两周跑一次性能审计，不达标不给上线。别等上线了用户投诉慢才想起优化，那时候用户早就跑光了。
安全防线要建在架构底层，不是事后打补丁
去年有个朋友的公司网站被黑客拖库了，用户信息泄露了十几万条，赔了好多钱，最后查原因，就是因为一个npm依赖包被植入了恶意代码，他们一直没升级。
现在Web开发的安全威胁真的比以前复杂多了，不是防个SQL注入、XSS攻击就完事了。API滥用、第三方脚本劫持、供应链攻击，这些都是新的风险点。我见过太多团队，安全全靠上线前扫一遍漏洞，这种事后补补丁的方式根本防不住。
真正的安全要做在架构设计的时候：
安全这个东西，没出事的时候你觉得没用，出了事就是灭顶之灾。别嫌麻烦，多花点时间在安全上，总比出事了赔钱强。
PWA是被低估的跨平台杀器
我发现很多人对PWA的印象还停留在”可以添加到桌面的网页”，觉得是个鸡肋功能。但我们去年做的一个东南亚出海项目，用PWA之后，用户留存率涨了40%，转化率涨了25%。
东南亚的用户大多用的是低端安卓手机，存储空间小，网络也不稳定。你让他下载个几十M的APP，他根本不愿意。PWA就不一样了，不用下载，点开就能用，占的空间不到1M，还能离线访问，推送通知也能发，跟原生APP体验差不多。
现在PWA的浏览器支持已经非常好了，移动端和桌面端都能用。尤其是做内容型、工具型产品的，真的可以试试PWA，开发成本比原生APP低太多，体验也不差。尤其是做海外市场的，PWA几乎是标配。
我去年把自己的个人博客也改成了PWA，现在用户可以直接添加到桌面，离线也能看文章，还能收到新文章的推送通知，反馈特别好。
给开发者的几个真心话
干了这么多年开发，我最大的感受是：Web开发的技术迭代很快，但底层的逻辑其实没变过。不管框架怎么变，性能优化的核心是减少请求、降低体积，用户体验的核心是快、稳、好用，这些永远不会变。
别每天追着新框架新名词跑，把基础打扎实了，比什么都强。React出18了，你知道Concurrent Mode的原理是什么吗？Vue3的组合式API，你知道它解决了什么问题吗？TypeScript用了好几年，你知道类型编程怎么写吗？这些才是你的核心竞争力。
还有，一定要理解业务。我见过太多开发者，产品说做什么就做什么，从来不问为什么。你知道做这个功能是为了解决什么用户问题吗？你知道这个功能上线后能带来什么业务价值吗？多想想这些问题，你就不会只停留在”实现需求”的层面，你会成长得更快。
最后说一句，AI时代来了，别焦虑。代码可以让AI写，但需求理解、架构设计、问题排查、质量把控这些需要思考的工作，暂时还替代不了。把这些能力练好，你永远不会失业。