중요 요청 체인은 페이지 렌더링에 필요한 일련의 종속적인 네트워크 요청입니다. 이 문제를 해결하거나 피하는 방법을 배우게 될 것입니다. 아래 내용을 읽어보세요!
긴급 요청이란 무엇인가요?
중요 요청이란 페이지를 렌더링하는 데 필수적인 요청을 말합니다. 즉, 해당 요청이 실패하면 페이지가 렌더링되지 않습니다. 중요 요청은 성공적인 완료를 보장하기 위해 다른 요청보다 우선순위를 부여해야 합니다.
긴급 요청을 하는 방법에는 여러 가지가 있습니다. 가장 일반적인 방법은 async 속성을 . 이 속성은 해당 스크립트가 다운로드되는 동안 브라우저가 다른 리소스를 계속 로드하도록 지시합니다. 또 다른 방법은 리소스를 HTML 코드 자체에 인라인하는 것입니다. 이렇게 하면 브라우저가 리소스를 가져오기 위한 왕복 통신을 기다릴 필요가 없지만, HTML 코드의 크기가 커집니다.
페이지 렌더링에 필수적인 리소스에 대해서만 중요한 요청을 하는 것이 중요합니다. 너무 많은 중요한 요청을 하면 페이지 로딩이 지연되고 궁극적으로 사용자 경험이 저하될 수 있습니다.
중요 요청이 연쇄적으로 발생하는 것을 방지하는 방법은 무엇입니까?
- 도메인 샤딩 기법 사용: 중요한 요청들이 연속적으로 발생하는 것을 방지하는 주요 방법 중 하나는 도메인 샤딩을 사용하는 것입니다. 도메인 샤딩을 통해 콘텐츠를 여러 도메인으로 분산시킬 수 있으며, 이는 DNS 조회 횟수를 줄이고 페이지 로딩 시간을 개선하는 데 .
- CDN 사용: CDN은 전 세계 서버에 콘텐츠를 캐싱하여 페이지 로딩 시간을 개선하는 데 도움이 되므로 방문자가 콘텐츠에 더 쉽고 빠르게 액세스할 수 있습니다.
- 웹사이트 성능 최적화: 웹사이트 성능을 최적화하면 중요한 요청들이 연쇄적으로 발생하는 것을 방지할 수 있습니다. 여기에는 HTML, CSS, JavaScript 파일 최소화, 이미지 압축, 캐싱 플러그인 사용 등이 포함됩니다.
중요 요청을 연쇄적으로 보내는 방식에 대한 대안
성능 향상에 도움이 될 수 있는 중요한 요청들을 연속적으로 처리하는 대신 사용할 수 있는 몇 가지 대안이 있습니다
1. 리소스 인라인화: 이는 작고 중요한 리소스를 별도의 HTTP 요청 없이 HTML 코드에 직접 삽입하는 것을 의미합니다. 데이터 URI 또는 인라인 스크립트 및 스타일을 사용하여 이를 구현할 수 있습니다.
2. 리소스 사전 로딩 : 이는 브라우저에게 특정 리소스를 미리 가져오도록 지시하여 필요할 때 사용할 수 있도록 합니다. 링크 태그 또는 리소스 힌트를 통해 이 작업을 수행할 수 있습니다.
3. 리소스 캐싱: 캐싱 저장소는 자주 사용하는 리소스에 로컬로 접근하므로, 사용할 때마다 서버에서 가져올 필요가 없습니다. 이를 위해 캐싱 헤더 또는 서비스 워커를 사용할 수 있습니다.
4. 요청 순서 최적화: 리소스 요청 순서는 성능에 영향을 미칠 수 있으므로 중요한 리소스를 먼저 요청하는 것이 중요합니다. 이를 위해 `preload` 키워드를 사용하거나 리소스 요청 순서를 수동으로 변경할 수 있습니다.
5. 왕복 시간 최소화: 왕복 시간(RTT)은 요청이 브라우저에서 서버로 이동했다가 다시 돌아오는 데 걸리는 시간입니다. RTT를 줄이면 성능 향상에 도움이 되며, 이를 위한 몇 가지 방법으로는 지속적인 연결 사용, DNS 조회 최적화, 리디렉션 감소 등이 있습니다.
결론
이 글을 통해 중요한 연속 요청을 피하는 것이 얼마나 중요한지 이해하셨기를 바랍니다. 이를 통해 웹사이트 로딩 속도를 향상시키고 사용자에게 더 나은 경험을 제공할 수 있습니다. 변경 사항을 실제 웹사이트에 적용하기 전에 반드시 테스트해 보시고, 궁금한 점이 있으면 언제든지 지원팀에 문의 .
