设置图像的真实HTML高度和宽度是否会减少加载时间？

Question

我有一个网站，我想提高它的性能。我已经解决了所有常见问题，但我有两个问题：

1）假设我有100x100px的图像，我想要显示它。这个<img src=" test.jpg" height=100" width="100" alt="">的加载速度是否比此<img src=" test.jpg" alt="">慢？

2）假设我的域名是www.test.com。同一域上的HTTP绝对路径加载比相对路径慢吗？
<img src=" http://www.test.com/test.jpg" alt="">慢于<img src=" test.jpg" alt="">吗？

谢谢！

Answer 1

1）如果设置宽度和高度，肯定会不加载更快，尽管它在浏览器上看起来会更好，因为当你不指定它们时，浏览器将使用标准尺寸和图像加载时它将改变为实际尺寸，因此您将看到一切都移动（回流）。

2）完全没有，浏览器无论如何都会确定绝对路径，因此对图像的请求完全相同。

Answer 2

指定尺寸允许浏览器在加载图像之前为图像创建正确大小的空间。这可以避免图像加载时文本的回流。

绝对URI比相对URI长，因此使包含它们的HTML文档需要更长时间才能下载......数量可以忽略不计。

Answer 3

给图像的宽度和高度可以在加载图像后保持布局不变，这样可以节省重绘。这应该会让它更快。

Answer 4

1）。无论图像属性设置为什么，图像下载都是相同的..浏览器仍然需要下载相同数量的内容..图像应该针对其使用进行优化

2）。使用相对路径..否则当浏览器位于相对目录中时，浏览器会通过网络返回到图像

我只是做了一些快速的谷歌搜索并找到了这个链接：

这里有一些信息 http://www.boogiejack.com/server_paths.html

google＆＃34;相对vs绝对图像路径SEO＆＃34;

Answer 5

几个字节可能不会在1080p视频流的日期和年龄上产生太大差异。缩小JavaScript，压缩图像等可能会产生更大的影响。

Answer 6

在这两种情况下，答案取决于浏览器的实现。这些是一些猜测：

  

假设我有一张100x100px的图像，我想要显示它。这个'img src =“test.jpg”height = 100“width =”100“alt =”“'加载慢于'img src =”test.jpg“alt =”“'？

加载时间不应发生显着变化。由于图像缩放逻辑将被触发，因此可能会有一些额外的处理时间，但重新计算布局的时间会更少，因为一旦图像加载，它将不会影响它占用的空间。

  

假设我的域名是www.test.com。同一域上的HTTP绝对路径加载比相对路径慢吗？   'img src =“http://www.test.com/test.jpg”alt =“”'慢于'img src =“test.jpg”alt =“”'？

如果必须重新获取域名，相对URL 可能会变慢，但在大多数情况下，请求将被流水线化，因此您不应该看到任何真正的差异。