图像是在客户端还是服务器端渲染的？

Question

我刚开始学习网站开发，特别是Reactjs，它介绍了“客户端渲染”概念。我认为我理解了客户端和服务器端渲染的概念，但我不太清楚如何实际应用这些概念。

例如，当我有一个<img src="airplane.png" />时，这个图片是在客户端还是服务器端加载？也就是说，服务器是否将图像作为原始请求的一部分返回，还是图片在HTML被服务后通过向服务器再次发出请求从客户端加载？如果我要加载大量图片，我应该让它们在客户端还是服务器端加载？

谢谢！

- Bob Dole

---

请尝试使用错误的路径或文件名加载图像，这将导致404错误，表示已向服务器发送了请求但未找到该文件。 - Dev Man

请查看开发者工具中的网络选项卡。 - Dave Newton

是的，我刚用开发工具检查了一下，这对我来说更有意义。谢谢！ - Bob Dole

Answer 1

这是后一种情况。相应的标签将被插入页面的DOM中，浏览器将会向服务器（或者图片托管的任何地方 - 不一定是你的服务器）发出另一个请求以获取该图像的内容。

客户端渲染和服务器端渲染这个术语指的是文档结构计算的位置。在后者（经典的情况）中，服务器根据请求构建整个文档，而在前者中，它构建了一个骨架文档，由客户端应用程序逻辑来构建文档，因为应用程序正在运行。当然，在服务器端渲染中，你也需要在某个时候开始修改DOM以使交互应用程序生效，所以分界线并不是那么清晰。

您可以提供一个data URL作为图像的内容嵌入URL，并在初始文档请求的正文中下载它。有时也会在附加的CSS文件中使用。但这对于不经常使用的小型图像很有用（如SVG图标或类似物）。

- Horia Coman

---

这很有道理。所以我猜我的问题实际上并不是关于客户端/服务器端渲染，因为这些概念是指实际生成HTML的位置？img标签的代码可以在客户端或服务器端生成，但无论哪种方式，数据都将随着另一个请求加载（除非图像以数据URL的形式提供）。你为我解决了这个问题。谢谢！ - Bob Dole