Performance - some images are slow to download
I have a website that has some performance issues.
Some images need a lot of time to be downloaded by the browsers.The problem seems to involve only images (not js scripts or css)
I'm using the Network Pane in Developer Tools of Google Chrome.
This images are not big... some of them are under 1KB but could need more than 30 seconds!
The images that are slow downloaded are not always the same... they change from istance to istance.
The problem is reported from a lot of users in different geographic areas... so I don't think about a problem with my connection.
the Developer Tools says that sometime a lot of time goes in Receiving for some others a lot of time goes in Waiting
By the way, i'm not sure about what this labels stand 开发者_开发百科for (waiting, receing, blocking, ecc) I can't find an official guide from Google, does someone knows more?
What could be the problem?
The problem is you have many small images. Every single image needs to download with an HTTP call with all headers and delays. so it cause having many HTTP requests for small amount of data. The best practice is having an image sprite to lower your delay of loading images. With having image sprite you just call server for small images once and get all images.
Your solution is using image sprite. Just like what Google and Facebook does. Here is their sprites, And here is a guide for doing this: CSS Sprites: Image Slicing’s Kiss of Death:
精彩评论