성능 - 일부 이미지의 다운로드 속도가 느림

Question

성능 문제가있는 웹 사이트가 있습니다.
일부 이미지는 브라우저에서을 다운로드하는 데 많은 시간이 필요합니다.

문제는 이미지 만 (안 JS 스크립트 나 CSS)

나는 개발자 도구 구글 크롬의에 네트워크 창을 사용하고 관련된 것으로 보인다.

이 이미지는 크지 않습니다 ... 그 중 일부는 1KB 미만이지만 30 초 이상 필요합니다!

다운로드 속도가 느린 이미지가 항상 동일하지는 않습니다 ... 이미지가 istance에서 istance로 변경됩니다.

다른 지리적 영역에있는 많은 사용자로부터 문제가보고되었습니다 ... 그래서 연결에 문제가 있다고 생각하지 않습니다.

개발자 도구

언젠가 많은 시간이 많은 시간 그런데 대기

간다 어떤 다른 사람에 대한 받기 에가는 것을 말한다, 나는이 레이블에 대한 스탠드 대해 확실하지 않다 (대기 중, 수신 중, 차단 중, 수신 거부 중) Google에서 공식 가이드를 찾을 수 없지만 다른 사람이 더 알고 있습니까?

무엇이 문제 일 수 있습니까?

Answer 1

많은 작은 이미지가있는 것이 문제입니다. 모든 단일 이미지는 모든 헤더와 지연이 포함 된 HTTP 호출로 다운로드해야합니다. 소량의 데이터에 대해 많은 HTTP 요청이 발생합니다. 가장 좋은 방법은 이미지 스프라이트를 사용하여 이미지로드 지연을 낮추는 것입니다. 이미지 스프라이트를 사용하면 작은 이미지를위한 서버를 호출하고 모든 이미지를 얻을 수 있습니다.

당신의 솔루션은 이미지 스프라이트를 사용하고 있습니다. Google과 Facebook이하는 것과 똑같습니다. 여기에 자신의 스프라이트입니다, 그리고 여기이 일을위한 가이드 : CSS Sprites: Image Slicing’s Kiss of Death :