You have 5 seconds to impress me.
|
If you have any constructive comments, suggestions for improvements or corrections, please
|
Sliced Images are faster - fact or fiction?
In general, a single large image will always download faster than the same image sliced into many images. Let's look at the comfy chair image shown on this page. The whole chair image is 7911 bytes. Sliced into three horizontal strips, the total size of all three files is 9390 bytes - almost 20% more when saved at the same compression.
Making the problem even worse is that instead of a single request to your server to get the image, the sliced version will need three server requests. And each 'packet' sent from your server will have extra stuff added to it for transmission across the Internet - three times as much for the sliced version. It's pretty obvious from that simple example that a sliced image will take longer to download than the unsliced single version.
So the rule is - sliced images are slower than single images.
And of course, there's a crucial exception to this 'rule'. With a sliced image, each of the individual components can be saved in the most compact format (gif/jpeg) and with the fewest colours/most compression.
Here's a simple example of that. The image immediately below is a single jpg image - total size 15,800 bytes.
And below are two images that make up the comfy chair - the left one is a jpg format, same compression as the image above, and the right one is a 16-colour gif .... total file size for the two images is 10,275 bytes - two thirds the size of the single image.
So, are sliced images faster than larger single images? Depends entirely on the image and how you create the slices. And, of course, there's extra work involved with sliced images. Not only do you need to slice and compress each individual segment, but you may need a fairly complex nested table structure to get them to all align perfectly again to look like a single image for all browsers at all screen sizes.
But the big advantage to sliced images is that they may - in the right page layout circumstances - give the impression of loading faster than a single large image, simply because they arrive faster individually.
© 2002 - halfadot smallwebs