CODEWITHSUNDEEP
cssxhtmlspritecss-sprites
Meowing Cat
Meowing Cat

Reputation: 152

Big CSS Sprite Image (Works as slow in low cpu computers)

My site have a big css sprite image.

Site: http://www.protohaber.com/demo

Sprite Image: http://www.protohaber.com/demo/templates/v1/images/proto_sprite.png

My site is works slow (e.g. page scrolling slow, etc..) at browser in some computers (low cpu computers)

Upvotes: 2

Views: 237

Answers (2)

juleee
juleee

Reputation: 466

Maybe you should try to use PNG Gauntlet to optimize the image.

Another Solution could be to split the Sprite into two or even more.

Upvotes: 1

ncubica
ncubica

Reputation: 8495

I think the principal reason for this is because the image is too big (almost 1.5 Megabytes), So just imagine how much the cpu have to calculate to move the background from one side to another. I think you sprite has a lot of resources which doesn't belong to it (like some images (the girl, caution alert, etc). Also you are mixing a lot of color at the same sprite which make the images bigger because has more colors to render.

I think one option is break apart the sprite into separate one which will make the file smaller (the slow processors can handle, render and move better small images), remove the images like (the girl, caution alert, etc) and make them jpg file which will make the file also smaller.

the idea of sprites is reduce the request to the server but if this reduce the performance of you application is best idea to make a couple of more request and have a better performance for the final user.

Upvotes: 0

Related Questions