上传到服务器或从服务器向客户端提供服务时调整图像大小?
Resize image when uploading to server or when serving from server to client?
我的网站使用了很多图片。在疲软的一天,用户将上传数百张新图像。
我正在尝试找出处理图像大小的最佳实践。
这个项目使用 Node.js 和 gm 模块来处理图像,但我不认为这个问题是特定于节点或 gm 的。
我想出了几个策略,但我不能决定哪个是最好的,而且我不确定我是否遗漏了一个明显的最佳实践策略。
请各位大神赐教。
选项 1: 在每次客户端请求时使用 gm 调整文件大小。
选项 1 优点:
如果我每次提供文件时都运行 gm 函数,我可以在需要时控制大小、质量、压缩、过滤器等。
在服务器上我只保存 1 个,完整质量 - 全尺寸版本的文件和保存存储 space。
选项 1 缺点:
gm 是非常耗费资源的,这意味着我会为每个客户端的每个图像服务器滥用我的 RAM。
这意味着我将始终处理一个大文件,这让事情变得更糟。
我总是需要从我的存储(在我的例子中是 S3)中获取文件到服务器,然后操作它,然后提供它。它似乎会产生冗余带宽问题。
选项 2: 在第一次上传时调整文件大小并在服务器上保留多个文件大小。
选项 2 优点:
我只需要在上传时使用 gm。
提供文件几乎不需要任何资源。
选项 2 缺点:
我将使用更多存储空间,因为我将保存同一文件的多个版本(即完整、大、中、小、x-小),而不是只保存一个版本。
我将仅限于使用用户上传图片时创建的尺寸。
不灵活 - 如果将来我决定需要一个额外尺寸的版本(例如 x-x-small),我将不得不 运行 一个脚本来处理我存储中的每个图像创建新版本的图像。
选项 3:
使用选项 2 仅在上传时处理文件,但在提供我的存储中没有存储版本的文件大小时保留调整大小模块。
选项 3 优点:
- 在以选定的集合大小提供文件时,我将能够显着减少资源使用。
选项 3 缺点:
与选项 1 相比,我仍然会占用更多存储空间。
如果我没有我想要的文件大小,我仍然需要处理文件
选项 4: 我不在上传文件时创建多个版本。我在提供图像时会调整图像大小,但是 每当请求图像大小时,此版本的文件将保存在我的存储中,对于将来的请求我将不必处理再次显示图像。
选项 4 优点:
我只会为我使用的版本使用存储空间。
我可以在需要时添加新的文件大小,如果它不存在,它将根据需要自动创建。
每个文件只使用一次大量资源
选项 4 缺点:
- 仅访问一次的文件将是资源密集型 AND 存储密集型。因为我会访问文件,看到我需要的size版本不存在,创建新的文件版本,使用需要的资源,保存到我的storage wasting storage space for a file that will only be使用一次(note,我不知道文件会被使用多少次)
- 我必须检查每个请求的文件是否已经存在。
所以,
你会选择哪个?为什么?
还有比我建议的更好的方法吗?
解决方案在很大程度上取决于您对资源的使用情况。如果您的利用率很高,那么选项 2 就更好了。如果没有,选项 1 也可以很好地工作。
从定性的角度来看,我认为选项4当然是最好的。但是对于简单性和自动化的问题,我认为选项 2 更好。
因为简单很重要,我建议混合使用选项 2 和 4:您将有一个大小列表(例如大、中、小),但不会在上传时处理它们,而是在选项 4 中请求时处理。
所以最后,在最坏的情况下你会得到选项 2 的解决方案。
我最后要说的是,您还应该在您的网站中使用 <img>
and/or <canvas>
对象来执行最终大小调整,这样就不会产生小的计算开销在服务器端。
我的网站使用了很多图片。在疲软的一天,用户将上传数百张新图像。 我正在尝试找出处理图像大小的最佳实践。
这个项目使用 Node.js 和 gm 模块来处理图像,但我不认为这个问题是特定于节点或 gm 的。
我想出了几个策略,但我不能决定哪个是最好的,而且我不确定我是否遗漏了一个明显的最佳实践策略。
请各位大神赐教。
选项 1: 在每次客户端请求时使用 gm 调整文件大小。
选项 1 优点:
如果我每次提供文件时都运行 gm 函数,我可以在需要时控制大小、质量、压缩、过滤器等。
在服务器上我只保存 1 个,完整质量 - 全尺寸版本的文件和保存存储 space。
选项 1 缺点:
gm 是非常耗费资源的,这意味着我会为每个客户端的每个图像服务器滥用我的 RAM。
这意味着我将始终处理一个大文件,这让事情变得更糟。
我总是需要从我的存储(在我的例子中是 S3)中获取文件到服务器,然后操作它,然后提供它。它似乎会产生冗余带宽问题。
选项 2: 在第一次上传时调整文件大小并在服务器上保留多个文件大小。
选项 2 优点:
我只需要在上传时使用 gm。
提供文件几乎不需要任何资源。
选项 2 缺点:
我将使用更多存储空间,因为我将保存同一文件的多个版本(即完整、大、中、小、x-小),而不是只保存一个版本。
我将仅限于使用用户上传图片时创建的尺寸。
不灵活 - 如果将来我决定需要一个额外尺寸的版本(例如 x-x-small),我将不得不 运行 一个脚本来处理我存储中的每个图像创建新版本的图像。
选项 3: 使用选项 2 仅在上传时处理文件,但在提供我的存储中没有存储版本的文件大小时保留调整大小模块。
选项 3 优点:
- 在以选定的集合大小提供文件时,我将能够显着减少资源使用。
选项 3 缺点:
与选项 1 相比,我仍然会占用更多存储空间。
如果我没有我想要的文件大小,我仍然需要处理文件
选项 4: 我不在上传文件时创建多个版本。我在提供图像时会调整图像大小,但是 每当请求图像大小时,此版本的文件将保存在我的存储中,对于将来的请求我将不必处理再次显示图像。
选项 4 优点:
我只会为我使用的版本使用存储空间。
我可以在需要时添加新的文件大小,如果它不存在,它将根据需要自动创建。
每个文件只使用一次大量资源
选项 4 缺点:
- 仅访问一次的文件将是资源密集型 AND 存储密集型。因为我会访问文件,看到我需要的size版本不存在,创建新的文件版本,使用需要的资源,保存到我的storage wasting storage space for a file that will only be使用一次(note,我不知道文件会被使用多少次)
- 我必须检查每个请求的文件是否已经存在。
所以,
你会选择哪个?为什么?
还有比我建议的更好的方法吗?
解决方案在很大程度上取决于您对资源的使用情况。如果您的利用率很高,那么选项 2 就更好了。如果没有,选项 1 也可以很好地工作。
从定性的角度来看,我认为选项4当然是最好的。但是对于简单性和自动化的问题,我认为选项 2 更好。
因为简单很重要,我建议混合使用选项 2 和 4:您将有一个大小列表(例如大、中、小),但不会在上传时处理它们,而是在选项 4 中请求时处理。
所以最后,在最坏的情况下你会得到选项 2 的解决方案。
我最后要说的是,您还应该在您的网站中使用 <img>
and/or <canvas>
对象来执行最终大小调整,这样就不会产生小的计算开销在服务器端。