生成缩略图的最佳实践是什么？

Question

我正在创建一个社交网络，用户可以上传他们的个人资料图片。

该图片将在他们的个人资料页面上以150 / 150像素的尺寸使用。

在首页即用户活动动态中，我需要将同一张图片缩小至75 / 75像素。

那么，最佳实践是什么呢？

1. 动态调整图片大小（timthumb）。
2. 调整并保存图片至服务器。

- user737767

---

在服务器上调整大小并保存图像，减少开销。 - Ibu

所以我需要在服务器空间上投入更多的资金... - user737767

服务器空间很重要，如果想获得快速响应，请考虑使用CDN。 - Ibu

空间通常比CPU便宜。 - gaRex

Answer 1

在上传照片时，创建所需的缩略图集，并将其保存为 [image_name]thumb[size_name].jpg 或类似格式：

uploaded: file.jpg
medium: file_thumb_150x150.jpg
small: file_thumb_75x75.jpg

命名约定由您决定，但您可以快速获取所需数据。无需使用服务器即可动态生成或在浏览器中缩放。

- Tomasz Kowalczyk

---

同时，您可以只有一个拇指 - 例如仅为150像素，并通过简单的CSS将其减小到75像素。浏览器可以轻松完成此操作。 - gaRex

是的，但这会增加带宽开销。150x150的图像比75x75大4倍。如果您的说法是正确的，我们可以利用原始图像并生成没有缩略图[假设宽度/高度比是可接受的]。 - Tomasz Kowalczyk

@Tomasz，我们也不知道这是好还是坏的方法，因为在不同的情况下，我们可以拥有无限的带宽。另一个你提供的选项，只保留原始文件太极端了。例如，我将你的头像调整为150和75像素。它并不是4倍大，而只是2倍 :) 因为150/75将是2。同时，通过文件大小（我使用简单的MS Office调整大小器）： 8.40 KB（8,603字节）与3.67 KB（3,765字节）仅有2.28的比率。 - gaRex

所以，如果您考虑带宽，那么需要2张图片，但如果考虑磁盘空间而非带宽，则只需要1张图片。 - gaRex

@garex：这是4倍，因为它是2D而不是1D。150x150=22500，75x75=5625，比率=4。对于文件大小，我同意，这并不是那么直接的方式。 - Tomasz Kowalczyk

Answer 2

我已经研究了一段时间这个问题，并发现有三种主要的方法来解决它:

1. 在上传时作为后台进程生成缩略图。
2. 通过主应用程序按需生成图像。
3. 使用URL作为API按需生成图像。

每种方法都有其优点和缺点。

1. 这种方法是最受限制的，您必须事先知道所有缩略图的用途和大小，以便在上传后立即生成它们。主要优点是可以像任何其他静态资源一样有效地使用服务器（如nginx）服务于图像。
2. Django有一个名为sorl-thumbnail的库，提供了一个模板标签，用于根据需要生成各种类型的缩略图。它使用快速的键/值存储来跟踪已生成的缩略图，并且如果检测到源图像已更改，则自动使失效的生成图像无效。然后，模板标签返回生成图像的URL，可以直接从nginx中提供而无需通过脚本层。比第1种更灵活，但您不能（例如）使用JavaScript生成图像URL并期望它存在，它必须由网站的后端代码或模板完成。
3. 完全动态和灵活，您只需通过调整URL即可获取所需版本的图像，Amazon使用此方法，所有这些占位符图像生成网站也是如此。可以在JavaScript中生成URL并执行任何想要的花哨操作。除了为您生成URL的一些辅助方法外，网站本身不需要了解缩略图层的任何知识。但是，这显然是最资源密集型的方法，并且您需要确保您的架构可以处理负载。您需要使用书中的每个技巧及时使缓存失效，避免在调整大小脚本上不必要的命中等。

我非常喜欢第3种方式，我喜欢将图像生成完全与我的主要网站功能隔离开来，并且我喜欢它的相当灵活性，但是在配置服务器以处理它时，您需要知道自己在做什么。

- Andrew Ingram

---

我正在完成我的应用程序。我不能更改我的框架。 - user737767

Answer 3

我告诉你我是怎么做的。我总是存储完整尺寸的图像，但使用带有前导零的数据库ID进行重命名。在第一次使用时，我创建缩略图并将其存储在其他文件夹中，在下一次调用中使用它。

- morgar

Answer 4

如果服务器空间和带宽成问题，您应该考虑使用 CDN。

亚马逊有良好的服务。

- Ibu