CSS 스프라이트 로딩 속도가 빨라 집니까?

Question

어떤 기법이 더 나은 렌더링 시간을 갖고 일반적으로 더 낫습니까? 작업중인 파일은 매우 커서 스프라이트에 300 개 이상의 작은 아이콘 (16x16)이 있습니다. 다음은 두 가지 예입니다. 먼저 자동으로 SpritesSticker

.sr-chat-min-btn { background: url(icons.png) no-repeat 0px -153px; } 
.sr-btn-views { background: url(icons.png) no-repeat -42px -141px; } 
.sr-star-gold-right { background: url(icons.png) no-repeat -21px -141px; } 

두 번째로 CSS를 생성 나를에 의해 버전을 "최적화"입니다.

.sr-chat-min-btn, .sr-btn-views, .sr-star-gold-right { background: url(icons.png) no-repeat } 
.sr-chat-min-btn { background-position: 0px -153px; } 
.sr-btn-views { background-position: -42px -141px; } 
.sr-star-gold-right { background-position: -21px -141px; } 

Answer 1

클라이언트 측에서 성능 차이가있는 경우 스타일 계산에 사용되며 스프라이트 이미지는로드되지 않습니다. 그리고 에의 성능 차이가 전혀 없음을 보장 할 수 있습니다.

로드 시간은 브라우저의 렌더링 엔진이 아니라 서버 또는 인터넷 연결과 관련된 문제입니다.