压缩&调整用户上传图像的大小

compress & resize user uploaded images

本文关键字：图像 用户 amp 调整 压缩      更新时间：2024-03-28

我正在建立一个有很多用户上传图像的网站（比如airbnb假设）

到目前为止，该网站会将你提交的任何图片上传到amazons3，然后相应地显示。有时这些图像太重，会增加页面加载时间。

我想将此图像调整为所需的分辨率，并在可能的情况下进行压缩（转换为jpeg），以增加加载时间并减少流量。

我发现这可以通过以下任一方式完成：

  • 创建一个HTML画布，在浏览器中进行相关转换，然后上传
  • 将图像上传到服务器，然后运行一些后端任务来缩小大小和压缩

每种方法的好处是什么？哪一种最常见？在每种情况下我应该考虑什么？

我的堆栈当前为node.js/angular。我现在不打算使用CDN，因为该项目正处于开发阶段

提前感谢！

您需要安装imagemin并将其添加到您的grunt任务中。这里有一个链接，可以让它运行https://github.com/gruntjs/grunt-contrib-imagemin祝你好运

对于记录，我发现最简单的解决方案是加载用户在html5画布中选择的任何图像，并将其转换为jpeg，然后上传jpeg，在后端我将使用node-imagick包调整其大小。

通过在前端转换为jpeg，您可以在不损失性能的情况下最大限度地缩短上传时间，还可以将输入格式规范化为后端服务。

相关文章：