largest-contentful-paint

1 개의 포스트

네이버 통합검색 AIB 도입과 웹 성능 변화 분석 (새 탭에서 열림)

네이버 통합검색에 도입된 AI 브리핑(AIB)은 채팅 기반의 동적인 UI 특성으로 인해 기존의 핵심 웹 지표인 LCP(Largest Contentful Paint)를 지연시키는 결과를 초래했습니다. 분석 결과, 이는 서버 성능의 문제가 아니라 스트리밍 방식의 어절 단위 렌더링과 인터랙션을 위한 DOM 재구성 등 클라이언트 측의 구조적 특성이 LCP 측정 방식과 충돌하며 발생한 현상으로 확인되었습니다. 네이버는 이러한 UI 특성을 고려하여 LCP 위주의 단일 지표 관리에서 벗어나, TTFT(Time to First Token)와 같은 사용자 체감 성능에 특화된 새로운 측정 체계를 도입하여 성능 관리를 고도화할 계획입니다. **AIB 도입에 따른 성능 지표의 변화** * **LCP p95 지표 악화:** AIB 노출량이 증가함에 따라 통합검색의 LCP p95 값이 목표치인 2.5초를 상회하는 약 3.1초까지 상승하는 경향을 보였습니다. * **성능 분포의 변화:** AIB가 전체 LCP 분포의 꼬리(tail) 영역에 영향을 주면서, 'Good' 구간에 해당하는 사용자 비율이 감소하고 느린 구간의 사용자가 증가했습니다. * **렌더링 방식의 차이:** 구글의 AI Overview가 블록 단위로 렌더링하는 것과 달리, 네이버 AIB는 어절 단위의 점진적 노출과 적극적인 애니메이션을 사용하여 지표 측정에 더 큰 영향을 미쳤습니다. **채팅 UI에서 LCP 왜곡이 발생하는 기술적 원인** * **DOM 재구성 로직:** 텍스트 애니메이션이 끝난 후 하이라이트 기능을 위해 DOM 구조를 다시 변경하는 과정에서, 브라우저가 LCP 후보 영역의 렌더링 시점을 실제보다 늦게 기록하게 됩니다. * **어절 단위 렌더링의 한계:** 콘텐츠가 어절 단위로 쪼개져 렌더링되면 LCP 알고리즘이 '가장 큰 텍스트 블록'을 찾지 못하거나, 의미가 적은 작은 요소를 LCP로 잘못 선택하는 문제가 발생합니다. * **Chromium Paint Invalidation:** 스트리밍 방식으로 텍스트가 추가될 때마다 해당 레이어 전체에 페인트 무효화가 발생하며, 이로 인해 이미 화면에 그려진 요소의 `renderTime`이 프레임 단위로 계속 갱신되어 최종 측정값이 늦춰집니다. **네이버 통합검색의 성능 관리 개선 방향** * **독립적 성능 기준 수립:** AIB 영역을 제외한 일반 검색 결과의 LCP 'Good' 비율은 96%로 안정적이므로, AIB와 같은 특수 UI에는 별도의 성능 지표를 적용할 필요가 있습니다. * **TTFT(Time to First Token) 도입:** 사용자가 첫 번째 응답을 인지하는 시점을 측정하는 TTFT를 핵심 지표로 검토하여, 채팅 UI의 실제 체감 성능을 더 정확하게 반영하고자 합니다. * **지표 해석의 고도화:** 단순히 수치상의 LCP 최적화에 매몰되지 않고, UI의 특성과 사용자 경험을 더 잘 예측할 수 있도록 지표 분석 체계를 세분화하고 개선해 나갈 예정입니다. 현대적인 웹 환경에서는 스트리밍이나 동적 인터랙션이 강조되는 만큼, 기존의 정적 페이지 중심 지표인 LCP만으로 모든 성능을 대변하기 어렵습니다. 따라서 서비스의 UI 특성에 맞춰 TTFT와 같은 대안 지표를 함께 활용하고, 지표의 수치 너머에 있는 브라우저 렌더링 파이프라인의 동작 원리를 이해하는 것이 실질적인 사용자 경험 개선의 핵심입니다.