Web平台
Traveloka 的 Core Web Vitals 与网页性能
针对高流量、对转化至关重要的页面做性能优化，以真实用户数据和性能预算为依据。
- 角色
- Software Engineer (Web)
- 时间
- 2018–2025
- 技术栈
- Core Web Vitals · Next.js · Real-user monitoring · Code splitting
问题
这些是高流量、对转化至关重要的网页体验，所以性能必须以用户真实感受到的为准，而不是开发者笔记本上的数据。
方案
- 先衡量真实用户。 由真实用户数据决定该修什么，性能预算则防止问题悄悄回潮。
- 减少浏览器必须运行的 JavaScript： 代码拆分、懒加载和依赖优化。
- 修复路径上的其余环节： JavaScript 执行、渲染、网络、图片和第三方脚本。
分享经验
我把这些经验整理成演讲：2023 年 DevFest Jakarta 的“Performance: Core Web Vitals Top Recommendations + INP”，以及 2022 年 Google I/O Extended Jakarta 的“Bridging the Gap: Making It Easier to Build for the Web”。
我也写文章：事件循环并不是你以为的那样解释了导致 INP 不佳的长任务，以及如何拆分它们。