I ran some audits on a new web application we are about to launch. Chromium is suggesting in network utilization that a few images on our site do not have height/width dimensions explicitly declared.

Will this really help performance? Aside from the browser not having to decide how to display the image and basically being told to use X height and Y width for an image, how can this help "network utilization"?

Any other comments regarding this would be appreciated!

2 Answers 2


It will help individual browser performance only. It will not boost network utilization in any way. When the browser renders the html, it will begin to allocate and space objects, and if it has explicit instructions on how to allocate the space, the layout parses while the image continues to load in the background. With modern broadband download speeds, this is less and less of a problem, but it is still noticeable. If you've ever gone to a page with a lot of images (http://www.skysports.com/ is an example) that does not explicitly set image sizes you will notice the page jump and skip as images are loaded into the dom and the browser refreshes the interface to compensate for the new size. With explicit image sizing, this jumpy experience is eliminated. In a lot of CMS sites, though, the size of the image can't be explicitly known all the time so this behavior may be unavoidable.

If you do know the size of the image, it does not hurt to put it in there, though you may see no "real" gain from it either.

EDIT - as another test, you can try it with 2 different pages using "lorem ipsum" text wrapped around a large image (4mb or so?). Since there is no real way the image can load quickly (unless it is cached), you should notice a difference in display behavior between the explicit and non-explicit pages.

  • I believe any image size can be known ahead of time because you can check server-side (e.g. getimagesize() in PHP) before generating the HTML. Sep 24, 2010 at 15:56
  • @DisgruntledGoat - It depends on the CMS, the language used, tools available, etc. It also depends on how much overhead you want to add to a site just to get rid of a minor jumpiness. It also doesn't apply to CSS specified height/width attributes. Sep 24, 2010 at 17:12
  • @DisgruntledGoat: Checking with PHP just to put the size in an img tag will make your site slower in fact.
    – webjunkie
    Sep 26, 2010 at 20:04
  • @webjunkie: It's not a big performance hit unless you're doing it many times on each page. (And with caching that disappears.) @Joel: True, I was just pointing out that it can be done in most/all CMS, not implying that it is. Although I believe most CMS will add the width/height when you add an image to a page - as direct attributes in the code, not generated on every page load. Sep 27, 2010 at 1:19

I don't know about actual performance gains, but it helps browser paint time, which makes the application seem faster to the user. Don't underestimate a snappier UI in terms of how your application is perceived.

  • Right, that part I can get but I do not get why chromium places this suggestion in the network utilization category.
    – Chris
    Sep 24, 2010 at 14:45
  • I'm not sure why it's there either. It wouldn't seem to be the most accurate place. Sep 24, 2010 at 14:52
  • @Chris: The only reason that springs to mind is perhaps browsers decide which order they downloads images based on their size, for example downloading smaller images first so the site looks more "complete". Or maybe if the sizing of other images means one image is "below the fold", it won't download it until last. Sep 24, 2010 at 15:54
  • @Disgruntled: Interesting thoughts, I am going to look into this a bit more.
    – Chris
    Sep 24, 2010 at 15:56

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.