큰 CSS 스프 라이트 이미지 (저속 컴퓨터에서 느리게 작동)

Question

내 사이트에는 큰 CSS 스프라이트 이미지가 있습니다.

사이트 : http://www.protohaber.com/demo

스프라이트 이미지 : http://www.protohaber.com/demo/templates/v1/images/proto_sprite.png

내 사이트가 일부 컴퓨터의 브라우저에서 (, 등 느린 스크롤 예를 들어 페이지) 작품 느린 (낮은 CPU 컴퓨터)

Answer 1

나는 생각한다 이것의 주된 이유는 이미지가 너무 크기 때문에 (거의 1.5 메가 바이트), 단지 한면에서 다른면으로 배경을 이동시키기 위해 얼마나 많은 CPU가 계산되어야하는지 상상해보십시오. 나는 스프라이트가 그것에 속하지 않는 많은 자원을 가지고 있다고 생각한다. (어떤 이미지 (소녀,주의 경고 등)와 같다.) 또한 더 많은 이미지를 가지기 때문에 같은 스프라이트에서 많은 색상을 혼합하고있다.

나는 하나의 옵션으로 스프라이트를 분리하여 파일을 더 작게 만들 것이라고 생각한다. (소녀,주의 경보 등) 이미지를 제거하고 그 파일을 jpg 파일로 만들 것입니다. 또한 작은 파일.

를 스프라이트의 아이디어가 서버에 요청을 줄일 수 있지만 이것은 당신 응용 프로그램의 성능을 줄일 경우 더 요청 몇을하고 최종 사용자에게 더 나은 성능을 가지고 좋은 생각입니다.

을

Answer 2

어쩌면 PNG Gauntlet을 사용하여 이미지를 최적화해야합니다.

또 다른 해결책은 Sprite를 두 개 이상으로 분할하는 것일 수 있습니다.