html - 如果我设置图像高度和宽度，加载时间会减少吗

Question

<img src="image.jpg" width="20px" height"20px">

上面的加载时间是否等于：

<img src="image.jpg">

我只是对此感到好奇，因为我们知道图像越小，加载时间越快

Answer 1

不，它不会加快页面加载速度。但是，它确实可以防止页面构建本身的“效果”以及在加载图像时破坏/修复布局。将图像尺寸放入告诉浏览器保留图像所在的位置。这样，在页面加载时，布局应该是固定的，并且图像会在加载时弹出到位。

话虽如此，理论上，为宽度/高度添加“额外”标记实际上应该会减慢页面速度，因为您的代码比以前略大。它必须是一个很小很小的数量，尽管在宏伟的计划中......

Answer 2

不，设置width和height属性只影响浏览器渲染图像的方式。源文件image.jpg的大小保持不变，仍需完整下载。

Answer 3

不，它实际上可能会使其加载速度变慢，因为它必须对需要从浏览器进行更多工作的图像进行调整，最好的办法是使图像达到您想要的最大速度的确切大小

Answer 4

不，它不会使网站加载速度更快。

可以帮助您加快速度的是调整图像大小。您可以手动执行此操作，使用paint 或类似方法，或使用 sript（例如 PHP）：

<?php
$image = 'image.jpg';
$scale = 0.5;
list($width, $height) = getimagesize($image);
$newWidth = $width * $scale;
$newHeight = $height * $scale;
$thumb = imagecreatetruecolor($newWidth, $newHeight);
$source = imagecreatefromjpeg($image);

// Resize
imagecopyresized($thumb, $source, 0, 0, 0, 0, $newWidth, $newHeight, $width, $height);
//$thumb does now contain the resized image.
?>