Question

A。我有9个PSD文件，每个文件为400px x 400px，然后在具有JPEG高质量预设的Photoshop中，每个为“保存为网络”文件。这9个jpg文件的总大小为249kb，平均每个文件在26到30kb之间。

B。在Photoshop中，我制作了一个1200px x 1200px的空白新文件。将这9个PSD文件放入3x3网格中的新文件中，然后使用“ JPEG中等质量”预设“保存为网络”。这个大（1200px）jpg文件的大小为110kb。

在A中，我制作了一个HTML页面，如下所示：（test-A.html）

<div>
    <img src="01.jpg" width=150 height=150>
    <img src="02.jpg" width=150 height=150>
    <img src="03.jpg" width=150 height=150>
</div>
<div>
    <img src="04.jpg" width=150 height=150>
    <img src="05.jpg" width=150 height=150>
    <img src="06.jpg" width=150 height=150>
</div>
<div>
    <img src="07.jpg" width=150 height=150>
    <img src="08.jpg" width=150 height=150>
    <img src="09.jpg" width=150 height=150>
</div>

在B中，我将HTML页面制作如下：（test-B.html）

<img src="large.jpg" width=450 height=450>

所以现在我有两个HTML文件，即test-A.html和test-B.html。我上传了所有图像和两个HTML文件，然后在浏览器中调用每个链接。

在我看来，test-A.html的加载速度比test-B.html快。但是，由于我的互联网连接不可靠，因此我不确定哪一个实际上会加载得更快。

我尝试了三种（X，Y，Z）在线工具来检查页面的加载速度。但是报告不一样。

从X开始，test-A.html的速度加载报告比test-B.html快。
从Y开始，test-A.html的速度负载报告比test-B.html快。
但是从Z开始，test-A.html的速度负载报告要慢于test-B.html

我的问题是：
在一个html页面包含多个小图像（总共249kb的400x400）之间，是否有任何不同的速度负载---与--- html页面包含一个较大的图像（在110kb的1200x1200中）？

如果存在差异，我的test-A.html和test-B.html之间哪个加载速度实际上更快（也许是理论上的？）？

如果没有不同，请完全忽略我的问题：）。

（页面中的）哪一个实际加载速度更快？

0 个答案: