웹 성능 최적화는 어떤 영역으로 나누어 진행하나요?

이렇게 답해 보세요 (핵심 답변)

웹 성능 최적화는 먼저 사용자가 겪는 병목을 로딩 속도(LCP), 상호작용 반응성(INP), 시각적 안정성(CLS)으로 측정한 뒤, 원인을 네트워크·메인 스레드 실행·렌더링 세 영역으로 나누어 진행합니다. 네트워크 영역에서는 이미지 포맷/크기 최적화와 캐시·코드 분할·요청 병렬화를 다루고, 실행 영역에서는 초기 JS 번들 축소와 긴 작업(Long Task) 분할·불필요한 리렌더링 제거를 다루며, 렌더링 영역에서는 강제 동기 레이아웃 제거와 레이아웃 이동 방지를 적용합니다. 무엇보다 한 번에 하나씩 가설을 세워 적용하고, 동일한 환경 조건에서 전후 지표와 실제 사용자 데이터(RUM)를 비교해 검증하는 절차가 핵심입니다.

함께 설명하면 좋은 이유 (꼬리질문 대비)

1. 네트워크 전송이 아무리 빨라도 메인 스레드가 무거운 JS 실행으로 막혀 있으면 사용자는 화면이 멈춘 것으로 체감합니다.
2. 추상적인 최적화 기법을 나열하기보다 '측정 → 병목 식별 → 수정 → 동일 조건 재검증'이라는 공학적 사이클을 설명하는 것이 중요합니다.

면접에서 자주 하는 실수

실제 프로파일링이나 측정 없이 관습적인 코드 수정만 적용해 놓고 성능이 몇 퍼센트 개선되었다고 임의의 수치를 주장해서는 안 됩니다.