[기술포스팅 원문] https://d2.naver.com/helloworld/9582944

[기술포스팅 요약]

2024 네이버 통합검색의 웹 성능 리뷰

프로젝트 개요

• 네이버 검색의 웹 성능 최적화 작업
• LCP(Largest Contentful Paint) 최적화를 통해 p95 기준 2.31초 달성
• 서치 피드(Search Feed) 도입에 따른 새로운 성능 지표 개발

2024년 네이버 통합검색 성능 지표

• LCP Good Score 96.59% 기록, p95 기준 2.31초
• INP(Interaction to Next Paint) 0.26초, 목표 기준 60ms 초과로 추가 개선 필요

새로운 성능 지표 도입

무한 스크롤 방식의 서치 피드 도입으로 기존 성능 지표의 한계를 보완하기 위해 FUPP, FILT 지표 개발

FUPP(Feed User Perceived Performance)

• 서치 피드에서 API 호출 후 첫 번째 주요 이미지 렌더링까지의 시간 측정
• p95 기준 약 1.5초, 사용자가 1.5초 이내에 새로운 콘텐츠를 확인 가능

FILT(Feed Image Load Timing)

• 이미지 로드 타이밍을 4가지 유형(Standby, Early, Viewport, Late)으로 분석
• Early(미리 로드) 75%, Viewport(화면 내 로드) 11%, Standby(대기 중) 14%, Late(늦은 로딩) 0%

서치 피드 최적화 실험

• 로드 시점 최적화를 위한 AB 테스트 진행
• 화면 아래 600∼1,000px 구간에서 서치 피드를 호출하는 것이 가장 효율적
• 서버 호출량과 사용자 도달률을 고려하여 최적의 콘텐츠 로드 시점 결정

2024년 네이버 통합검색 성능 개선 사례

지역플러스 영역 LCP 개선

• 기존 background-image에서 img 태그 방식으로 변경
• p95 기준 LCP 3,000ms → 2,000ms로 30% 개선

브랜드검색 Flicking 성능 개선

• marginLeft 속성 대신 transform: translateX() 적용하여 GPU 가속 활용
• background-image 대신 img 태그 사용으로 이미지 로드 속도 향상

결론 및 향후 계획

• 성능 개선을 통해 LCP 2.31초 달성 및 안정적인 사용자 경험 제공
• 무한 스크롤 영역의 성능을 측정하는 새로운 지표(FUPP, FILT) 도입
• INP 지표 개선을 위한 추가 최적화 진행 예정

이 게시글은 [GPT-4o model]를 통해 요약되었으며, 정보 공유 목적으로 게시되었습니다. 원문 게시물에 대한 책임이나 이해 관계가 없습니다. - 소프트웨어QA 포럼