스크롤 없이 볼 수 있는 콘텐츠의 크기 축소

이 규칙은 PageSpeed Insights에서 페이지의 스크롤 없이 볼 수 있는 콘텐츠를 렌더링하는 데 추가적인 네트워크 왕복이 필요함이 감지되면 트리거됩니다.

개요

필요한 데이터 양이 초기 혼잡 윈도우(일반적으로 14.6 KB 압축)를 초과하면 서버와 사용자 브라우저 간에 추가 왕복이 필요합니다. 모바일 네트워크와 같이 지연 시간이 긴 네트워크를 사용하는 사용자의 경우 이로 인해 페이지 로드가 크게 지연될 수 있습니다.

권장사항

페이지 로드 속도를 높이려면 페이지에서 스크롤 없이 볼 수 있는 콘텐츠를 렌더링하는 데 필요한 데이터(HTML 마크업, 이미지, CSS, 자바스크립트)의 크기를 제한하세요. 다음과 같은 여러 가지 방법이 있습니다.

스크롤 없이 볼 수 있는 중요한 콘텐츠를 먼저 로드하도록 HTML 구성

페이지의 주요 콘텐츠를 먼저 로드하세요. 서버의 초기 응답에서 페이지의 중요한 부분을 렌더링하는 데 필요한 데이터를 즉시 전송하고 나머지는 연기하도록 페이지를 구조화합니다. 즉, CSS를 콘텐츠의 ATF 부분의 스타일을 지정하는 인라인 부분과 지연할 수 있는 부분, 이렇게 두 부분으로 분할해야 할 수 있습니다.

사이트의 로드 속도를 높이기 위해 재구성하는 방법에 관한 다음 예를 고려하세요.

  • HTML에서 제3자 위젯을 로드한 후 주요 콘텐츠를 로드하는 경우 주요 콘텐츠를 먼저 로드하도록 순서를 변경합니다.
  • 사이트에서 탐색 사이드바와 자료가 포함된 2열 디자인을 사용하는데 HTML에서 사이드바를 내용보다 먼저 로드하는 경우 내용을 먼저 로드해 보세요.

리소스에서 사용하는 데이터의 양 축소

여러 기기에서 원활하게 작동하고 중요한 콘텐츠를 먼저 로드하도록 사이트를 새롭게 디자인한 후 다음 기법을 사용하여 페이지를 렌더링하는 데 필요한 데이터의 양을 줄이세요.

의견

이 페이지가 도움이 되셨나요?