No replies
tenants's picture
Last seen: 9 years 34 weeks ago
Joined: 2010-10-13
Posts: 5
Points: 7

Hi there, this is an odd question that I haven't seen any where else...

I've noticed that when using sprites defined in the CSS, the packet for the sprite doesn't get retrieved until after the CSS is retrieved (This seems to be consistent on most sites, and makes sense... you wouldnt want to download imaged defined in the css that arent displayed on the page). I've been using firebug and pingdom tools (and others) to watch these packets.

This means the parallel downloads are slowed since the order of retrieval is

1) The HTML file
2) The CSS, Images and scripts ...
3) The images defined in the CSS (There are now 2 sections of image parallel downloads, and its not needed)

Downloading the images after the CSS has been retrieved will slow the performance unnecessarily.

What I'm suggesting is to add the images with display:none (hidden) within the page they are intended to be displayed, so the order of retrieval will be:

1) The HTML file
2) The CSS, Images and scripts

This will cut out the 3rd section of parallel downloads, since the images defined in the css have already been added to the page so dont need to be called again.

I wondering if anyone has also seen this, and would recommend for/against displaying hidden spites in the page
Before you do, have a look at your site using pingdom tools, and look at the order of the packets... you'll see what I mean about the order of packets, and unnecessarily retrieving images after the CSS has been retrieved.