Traveloka의 Core Web Vitals와 웹 성능

문제

트래픽이 많고 전환에 직결되는 웹 경험이었기 때문에, 성능은 개발자 노트북이 아니라 사용자가 실제로 겪는 것으로 측정해야 했습니다.

접근 방식

• 먼저 실사용자를 측정. 무엇을 고칠지는 실사용자 측정으로 정하고, 성능 예산으로 성능 저하가 다시 스며들지 않게 했습니다.
• 브라우저가 실행할 JavaScript 줄이기: 코드 분할, 지연 로딩, 의존성 최적화.
• 나머지 경로 개선: JavaScript 실행, 렌더링, 네트워크, 이미지, 서드파티 스크립트.

경험 나누기

배운 내용을 발표로 정리했습니다. DevFest Jakarta 2023의 "Performance: Core Web Vitals Top Recommendations + INP"와 Google I/O Extended Jakarta 2022의 "Bridging the Gap: Making It Easier to Build for the Web"입니다.

글로도 씁니다. 이벤트 루프는 생각과 다르다에서 INP를 나쁘게 만드는 긴 작업과 그것을 나누는 방법을 설명합니다.