2013-05-02 2 views
1

CSS 스프라이트를 사용하여 페이지로드 시간을 줄일 수 있다는 것을 알고 있습니다. 왕복 등을 줄일 수 있습니다.얼마나 많은 CSS 스프라이트가 페이지 로딩 시간을 단축합니까?

CSS 스프라이트를 사용하여 평균 페이지 로딩 시간을 절약 할 수있는 수치 또는 성능 테스트입니다. 이 사이트에 따라 달라질 수 있습니다. Amazon.com과 같은 전자 상거래 사이트의 일반 데이터에 대해 알고 싶습니다.

JAIL과 같은 비동기 이미지로드를 저장하면 얼마 동안 저장할 수 있습니까? 나는 모든 것을 비동기 적으로로드 할 수 없다는 것을 알고있다.

+1

그것은 스프라이트와 얼마나 빨리 서버가 ruquests 처리에 투입되는 이미지의 수에 따라 달라집니다 수 있습니다. –

+0

확실히, 그러나 나는 이익을 측정하는 일반적인 실험이 있는지 궁금합니다. – KhanSharp

+1

단순 : 스프라이트가 있거나없는 페이지 로딩 속도를 높입니다. 그게 가장 좋은 방법입니다. Google의 페이지 속도는 유용한 도구이기도합니다. –

답변

1

대용량 스프라이트가 작은 이미지보다 크다면 큰 스프라이트는 작은 이미지보다 파일 크기가 크지 않으므로 스프라이트에 이미지를 가로로 배치한다고 가정합니다.

대부분의 브라우저는 한 번에 약 6 개의 동시 다운로드를 수행합니다. 엄지 손가락의 일반적 규칙은 6 개 이상의 아이콘 또는 테마 그래픽이있는 경우 표시해야합니다. 사진이나 삽화를 가지고 있다면, 그것들을 털어서는 안됩니다.

+0

의미 상으로 확장하기 위해 사진 등은 ''이미지가되고 아이콘은 자연스럽게 CSS 스타일 (스프라이트)의 일부가되는 반면, – babonk

1

스프라이트를 잘못 사용하면 서버가 과부하가됩니다. 스프라이트는 서버 요청 수를 줄이기 위해 사용되지만 jpg 형식의 크기가 크면 좋지 않을 수 있습니다.

그것은 균형 비슷하거나 더 적은 크기 나 스프라이트의 모든 작은 이미지가 포함 작은 크기의 내가 더 많은 이미지

http://coding.smashingmagazine.com/2010/03/26/css-sprites-useful-technique-or-potential-nuisance/

그들이 사용하는 경우 페이지 로딩이 10 배 요인 개까지 줄일 수 있습니다 최적!

희망이

관련 문제