Comments on: A Look at How Browsers Download and Render CSS Background Images

By: Scott

Scott — Sun, 01 Aug 2010 09:49:42 +0000

Do you have any information on if a browser will download all the images referenced in a stylesheet, even if they are not used on the page?

I am starting to think that all “background-image” CSS rules are interpreted by the browser (and the image is downloaded) even if they are not required. This is at least the impression I get from the Pingdom tools: http://tools.pingdom.com/ and from the page speed results in Google Webmaster tools.

By: Rob Flaherty

Rob Flaherty — Tue, 23 Mar 2010 18:17:26 +0000

@Aaron

Thanks for the info. This may have to do with IE’s “blank white screen” problem. Reloads and pages opened in new windows render differently than pages opened via link, bookmark, or direct entry in the address bar.

OR, it could be a Vista vs XP thing. My tests were done on XP.

By: Aaron Peters

Aaron Peters — Tue, 23 Mar 2010 13:05:12 +0000

Rob,

fyi, I tested the scenario 3 page twice in IE7 on Vista, empty cache, and both times the screen is white until the seconds css file finishes downloading.

By: Rob Flaherty

Rob Flaherty — Tue, 15 Dec 2009 22:15:41 +0000

@Josh
That’s an interesting question. I’ll see if I can work that in to the next round of tests. Thanks!

By: Josh L

Josh L — Tue, 15 Dec 2009 22:02:30 +0000

Thanks for this great study.

I would be very interested to know how different media types affect these results.

For example, suppose the stylesheet with sleep() has its media type set to “handheld”. The question then becomes “does this stylesheet block the image downloads even though it isn’t used?”