Does SPDY protocol eliminate the need for CSS sprites, combined JS and CSS files?

Question

I have been always combining CSS and JS files. The same has pretty much applied to images, too. I am wondering here that does Google's SPDY, with its multiplexing connections, remove the need for all of this? Compilation/minifying is not what I am asking here, just about the overhead of additional HTTP requests we have in the typical HTTP protocol.

Sinfonietta

Answer 1

SPDY allows your browser to fetch all the images in parallel, which helps. If the browser has sufficient bandwidth, this can be enough to make SPDY unsprited as fast a HTTP with sprites.

But, sprites are still better for absolute performance.

Usually, when you combine 5-6 images the resulting size of the image is significantly smaller than the sum of the sizes of the individual images. Your results will vary, depending on what types of images you're using and how many there are. The css tricks guys have an example: http://css-tricks.com/css-sprites/

Coshow

this makes sense, because each individual file has header payload as well (not just the protocol) – Genera

I agree that in many cases combining images in a sprite can lead to a smaller payload. However, as SPDY is compressing headers and not sending duplicates, it's conceivable that non-sprited images could decrease user perceived load time by loading them in parallel. This way, they'd appear as each one is complete instead of all at once. – Windproof

Answer 2

Even with the multiplexing of SPDY, cutting down on requests will likely result in performance boosts.

Unison

So, this is just guessing? Bearing in mind, requests in HTTP are pricy as they require more connections. In SPDY, we can do everything in a single connection. – Sinfonietta

connections are not the only cost. – Snowplow

rFactor: HTTP doesn't really require more connections (there's pipelining after all). – Vallombrosa

Answer 3

Don't use CSS sprites with external stylesheets - Resources in external stylesheets are obviously only discovered after the external stylesheet has been downloaded, and only once the rule matches an element. The advantage they provide of reducing HTTP requests is unnecessary with SPDY due to its multiplexing. Therefore, CSS sprites just make it slower.

https://www.chromium.org/spdy/spdy-best-practices

Callow