ReactJS 中的本地图像与外部图像服务

Question

我正在为我的前端和 Rails 后端 API 构建一个带有 ReactJS 的 Web 应用程序。我必须在整个应用程序中总共显示 4 张图像；这 4 幅图像是从一组大约 50 张图像中挑选出来的，并且该组不会增长太多（每年最多增加 10 张图像）。这 4 个图像应该每 3 到 7 天更改一次。

所以我在想，在生产力、性能和价格方面，处理我的图像的最佳方式是什么：

• 在我的 React 前端创建一个本地静态 img 文件夹，其中包含所有 图像，并将它们导入我的组件中。
• 使用图像上传/存储服务，例如Cloudinary、Imgx、AWS S3 ......用我的 rails 后端来提供我的图像。

或者也许有比这两个更好的解决方案？

Answer 1

由于您所描述的软件的性质，我建议您在您的 react 前端应用程序中创建本地和静态图像。

主要原因是：

1. 您已经提到每年不会超过 10 张图片，因此您可以在需要更新时轻松手动处理。
2. 您不会在存储方面依赖第三方（与使用 AWS S3 或任何其他提供商不同，您将不必要地依赖它）
3. 图像将独立于后端 API 服务器工作，因此即使后端出现某种故障，平台也会更加健壮，无需依赖后端服务器来显示这些图像。
4. 这也将减少服务器和客户端之间使用的带宽，每个图像请求都会“命中”客户端应用程序，这些应用程序应该已经自动缓存了 JS、CSS 和图像文件，所以它会被自动优化以获得更好的效果缩放。