I've got a website with a performance issues.
Some images need considerable time to become downloaded through the browsers.
The issue appears to involve only images (not js scripts or css)
I am while using Network Pane in Developer Tools of Google Chrome.
This images aren't large... a number of them they are under 1KB but tend to require more than thirty seconds!
The pictures which are slow downloaded aren't always exactly the same... they alter from istance to istance.
The issue is reported from lots of customers in various geographic areas... and so i don't consider an issue with my connection.
the Developer Tools states that sometime considerable time gets into Receiving for many others considerable time gets into Waiting
Incidentally, i am unsure by what this labels are a symbol of (waiting, receing, obstructing, ecc) I can not locate an official guide from Google, does someone knows more?
What is the issue?
The issue is there are many small images. Each and every image must download by having an HTTP call with all of headers and delays. therefore it cause getting many HTTP demands for little bit of data. The very best practice is getting a picture sprite to tear down delay of loading images. With getting image sprite you simply call server for small images once and obtain all images.
Your option would be using image sprite. Much like what Google and Facebook does. Here's their sprites, Here is helpful information for carrying this out: CSS Sprites: Image Slicing’s Kiss of Death: