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.
Asked
Active
Viewed 1,194 times
3 Answers
15
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/
Mike Belshe
- 166
- 2
-
this makes sense, because each individual file has header payload as well (not just the protocol) – Brady Moritz Jan 03 '14 at 20:33
-
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. – jon_wu Dec 16 '14 at 21:34
2
Even with the multiplexing of SPDY, cutting down on requests will likely result in performance boosts.
abraham
- 41,605
- 9
- 84
- 134
-
5So, 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. – Tower Feb 18 '11 at 19:09
-
1
-
rFactor: HTTP doesn't really require more connections (there's pipelining after all). – Julian Reschke Apr 30 '11 at 08:22
0
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.
TSURU
- 1
- 1