로딩 최적화

    [JavaScript] 로딩 최적화

    프론트엔드 최적화는 로딩 최적화와 렌더링 최적화로 대표될 수 있다. 렌더링 최적화는 이전 글에서 알아봤으니 이번엔 로딩 최적화를 알아보고자 한다. 로딩 최적화는 서비스의 첫인상을 결정한다. 사용자에게 컨텐츠를 더 빨리, 더 쾌적하게 제공할 수 있기 때문이다. 이 글에선 로딩 성능을 나타내는 지표와 로딩 최적화를 하는 방법에 대해 소개하겠다. 로딩 성능을 나타내는 지표 로딩 성능 지표의 측정 기준은 크게 브라우저와 사용자 입장으로 나눌 수 있다. 💻 브라우저 기준의 성능 측정 지표 내비게이션 타이밍 모델 (Navigation Timing Model) 내비게이션 타이밍 모델은 브라우저의 동작 단계별 시간을 측정하는 방식이다. 그림은 브라우저가 렌더링 되는 일련의 과정이다. 프론트엔드의 역할은 마지막의 Pro..