Node.js AWS S3上React部署的性能问题

我已经在S3上构建并部署了React应用程序（我们称之为AppA），并为其启用了“静态网站托管”。此应用程序先前使用节点在EC2实例上运行。最近，团队中有人在S3上部署了另一个React应用程序（B），当时我了解到S3是一个很好的选择，可以轻松部署静态内容，所以我考虑将应用程序a移动到S3。然而，在部署应用程序后，我发现要获得登录页面需要花费太多的时间（10-15秒）。在我登录后，体验并没有那么糟糕，但速度仍然很慢。当它在EC2实例上运行时，情况并非如此

需要澄清的是，所有这些基于React的应用程序（包括应用程序A和B）仅用于公司网络，所有用户仅来自美国地区。应用程序A从其他基于React的应用程序（应用程序B和C，均仅托管在S3上）和其他应用程序（运行在EC2实例上）获取图像（和其他数据）

我阅读了有关性能问题的文章，遇到了

内容编码

和

缓存控制

参数，这些参数可以在将构建上传到S3时使用。我使用GZIP压缩了CSS和JS文件，还添加了

内容编码的元数据

，但是，我没有注意到页面负载有任何显著差异。我离开了

cache control

参数（我将其设置为

max age=31536000

，因为应用程序A对文件名进行了哈希处理），因为添加此参数后，我在登录应用程序后得到了空白页（不确定为什么）。我还使用GTMetrix（附快照）检查了站点性能。在本报告中，您会注意到它仍然显示压缩可以改进，但是，建议实际上是针对此应用程序A连接的应用程序B。我认为这对我来说是一个进步的领域。我还与开发人员进行了核实，他告诉我，他没有在应用程序（appa）内部使用压缩，尽管我在将其上传到S3时对其进行了压缩

我读过很多文章，其中有人将S3与CloudFront或其他CDN一起使用。我不确定什么是解决我的问题的正确方法，因为我是第一次做这样的部署。在建议将S3作为其他环境（QA、UAT、PROD）的部署方法之前，我还必须考虑成本

考虑到应用程序用户仅在公司网络内，我有以下疑问：
1） 是否可以避免CloudFront/CDN方法，或者这是解决此性能问题的唯一方法？
2） 如果S3上的静态托管可以，那么是否可以对整体设置进行一些修改，以便（从其他S3托管的React应用程序C）获取的图像不会通过Internet路由，从而节省成本

---

我刚刚检查了React应用程序C的S3存储桶大小，大多数图像都位于该应用程序C中。到目前为止，bucket的总大小约为200MB，我能看到的图像的最大文件大小约为100KB（大多数都在这个范围内）。如果需要更多数据来提供建议，请告诉我。

CloudFront可以启用gzip压缩，这是由服务器完成的，而不是客户端。当然，你希望你的图像和一切压缩和标准化。要添加gzip压缩，在大多数情况下可以大大提高性能，请转到“行为”选项卡，编辑当前行为并勾选“自动压缩对象”。加载页面时，尽量不要解析不需要的JavaScript，只保留所需的JavaScript，其他项目可以异步延迟，不会阻塞渲染线程，但最好将js保留在组件中。感谢Alex的回复。不幸的是，我不能再测试它了，因为这是为我之前为之工作的客户准备的(