Html 在img标签的src中引用图像文件和在图像标签中直接引用嵌入图像有什么区别？

从服务器的角度来看，使用

和

有什么区别吗

---

在

src=pathto.png

的情况下，服务器会对图像进行编码并将其发送到浏览器吗？

第一个示例通过指定其URI引用外部资源。因此，这将导致向该资源发出额外的请求以接收数据

第二个示例也引用了一个资源，但该资源的数据直接嵌入到URI中（请参阅）。因此不需要额外的请求

两种方法各有优缺点：

                        external    embedded
separate request (-)       ✓           ✗
cachable (+)               ✓           ✗
referencable (+)           ✓           ✗
compression (+)            ✓           ✗

• 外部资源数据
  使用外部资源的优点是，这些资源可以缓存并在不同的文档中使用，而无需对这些资源的每个外观发出请求。
  缺点是它需要第一个额外的请求

• 嵌入式资源数据
  将资源数据直接嵌入文档的一个优点是可以保存额外的请求。
  但缺点是这些资源不能在一个文档或不同文档中多次出现时被缓存或引用。此外，不能使用deflate或gzip对其进行压缩。事实上，Base64编码将使大小膨胀4/3倍

---

另请参见加速网站的第一条最佳实践规则。

链接到单独的图像需要第二次请求才能获取图像，但允许在多个页面上缓存和重用图像，而无需再次发送数据

---

内嵌需要在包含图像的每个页面请求中发送数据（如果图像在页面中使用不止一次，则发送多次）

在

的情况下，服务器不会对图像进行编码。浏览器会在一个单独的请求中请求它，服务器只会转储一个短头，然后将文件的数据传输到网络上。在一个编写良好的HTTP服务器中，这是一个非常快的操作，因为所涉及的处理量非常小。浏览器还可以缓存图像，这样以后就不必检索图像（正如其他人所说）

---

将其嵌入内联将增加页面的重量，并使其无法单独缓存图像。

这是有意义的…如果src是图像文件的路径，web服务器通常会对图像文件进行编码（uuencode？）并发送到浏览器吗？服务器可能会使用一些编码，如gzip或deflate。但除此之外，数据不会被编码。例如，参见ISO 8859-1对该图像的二进制数据的解释结果中的奇怪字符。但是数据没有改变，因为您可以在第一行数据中看到PNG签名。