speed up background css sprite, but loading it as an image early on?

Forum Moderators: open

Message Too Old, No Replies

speed up background css sprite, but loading it as an image early on?

inspired by speed up technique.

urbanzen

4:03 am on Jan 18, 2008 (gmt 0)

Hello Everyone,

Background images are loaded after the </body> event, and on some sites that are css graphics heavy, it may give slow internet users a turn-off before it completely finishes loading.

What if I were to pre-load the css sprites with a javascript preload, and also a 1px by 1px of the css sprite right after the <body> tag?

Will that work? And has anybody tried it?

vincevincevince

3:46 pm on Jan 23, 2008 (gmt 0)

I don't think you need to do both at any rate. CSS background, if they are large, are a major problem for some sites. They take time to load and they don't involve the 'loading' indicator on most browsers.

In addition to your technique I strongly suggest that you get the file size down on your CSS background image and also very importantly you must host it on another domain. This could be another subdomain of the same domain, but it cannot be the same domain as your site. By doing this, the CSS download will start as soon as the CSS is loaded.

urbanzen

4:30 pm on Jan 23, 2008 (gmt 0)

Thanks vince I'll try this out. I wish I could get a stripped down server that only serves static content, but I'll have to make do until traffic explodes.

vincevincevince

2:49 am on Jan 24, 2008 (gmt 0)

Sounds like what you need is a caching server to sit in front of your site. This can be fairly easy to do - a rented box with squid can be configured to do that. Have a sysadmin remove all other server software.