在<img/>上指定图像的图像宽度和高度的原因

Question

页面速度建议为图像提供图像高度和宽度，有人可以告诉我指定图像的高度和宽度有什么好处。

通常我们总是在src标签中给出图像的url，并且总是忘记指定宽度和高度。

Answer 1

作为Google Pagespeed's pages themselves explain，在加载图像之前给定图像的尺寸时，浏览器可以为布局中的图像保留必要的空间。

  

通过消除不必要的回流和重新绘制的需要，为所有图像指定宽度和高度可以加快渲染速度。

Answer 2

通过提前指定宽度和高度，浏览器会在第一次传递时在页面上呈现其位置和大小的所有元素。如果您没有指定大小，则必须在知道它们之前下载文件，然后必须重新呈现页面上的所有组件，这需要时间。这也为用户带来了不太顺畅的体验。

Answer 3

通过指定高度和宽度，它有助于浏览器不必计算它。