caching - 浏览器对图像的缓存是否足以使服务器端存储的需求无效？

Question

我有一个架构问题，我不得不多次重写问题标题，因为 SO 要求我这样做。因此，请随时纠正它，如果你觉得是这样。我不是缓存相关问题的专家，所以我非常感谢对我的架构相关问题的一些见解。

所以情况是这样的。我们有一个基于 Web 的设计应用程序（前端 Javascript，后端 PHP），它向使用它来创建在线艺术作品的客户提供大量剪贴画图像。早些时候，我们的应用程序被加载到 AWS 机器中，我们曾经将剪贴画图像也本地存储在同一台服务器中，以便无需任何网络传输来加载剪贴画，从而使设计应用程序的加载时间更快。客户创建的设计也被保存到后端 MySQL 服务器中，该服务器直接连接到基于 Web 的设计应用程序（在 JSON 和关系模型中）。

在一个新团队加入制作这个应用程序的移动版本之前一段时间，他们坚持应该从我们的网络应用程序和他们正在创建的移动应用程序的“中心位置”加载剪贴画。他们还表示，设计还应该存储在“中央数据库”中，可供网络和移动应用程序访问（并且还对 JSON 结构进行了一些重大的重新架构）

最后，架构发生了变化，剪贴画现在位于一个集中位置（S3 服务器）。还有一个“资产交付和存储 (ADS) 系统”，我们的设计应用程序向该系统提出剪贴画图像请求并获得服务。（请注意，剪贴画存储库非常大，并且仅根据各种参数提供剪贴画图像的子集 - 例如设计风格，客户的帐户类型等）。所以这个任务现在由 ADS 系统完成（用 python 编写）。

而且由于我们的网页设计应用程序不再有任何剪贴画的本地存储或剪贴画过滤的逻辑（委托给 ADS，因此不再有服务器端 PHP），它也成为了一个纯粹的基于 Web（前端 Javasdcript）的应用程序，没有任何服务器要求，随后转移到 S3。

现在真正的问题是，我们的网络应用程序在初始加载时似乎比我们将剪贴画存储在服务器中时要慢得多。我读到，如果应用程序请求图像，这些图像会缓存在浏览器中，例如，如果客户在缓存过期之前加载相同的订单，则不需要向服务器发送重复请求（在本例 ADS）。

如果这是真的，我是否真的可以说明将剪贴画图像从设计应用程序服务器移动到 ADS 系统，并且每次加载设计时都必须发送请求并加载它们，这在一定程度上促成了最近设计应用程序的缓慢？

而且大多数时候我听到的答案是“移动应用程序也可以做到这一点并且速度更快”。我不是移动开发人员。是否有一些移动缓存技巧可以帮助移动应用程序比纯粹基于 Web 的设计应用程序更“高效缓存”，即使两者的架构相同（发送请求 ADS 以获取剪贴画），移动应用程序它以更好，更有效的方式进行吗？

尾注：我意识到我不是在问一个特定的编程问题。但从我在这里读到的一些笔记来看，SO 是一个面向程序员的社区，我不知道还有哪个社区能很好地回答编程相关的问题。我遇到的架构问题是我在工作中遇到的与编程相关的真正问题，遗憾的是我不够熟练，无法理解所有最近的架构更改是否有任何缺陷导致我们的 Web 应用程序性能显着下降。

感谢您的阅读，我非常感谢任何指向阅读的指针甚至链接，以便更好地理解这一点。

标签： cachingarchitecturebrowser-cache

Answer 1

在 chrome 中，打开开发人员工具，然后单击网络选项卡。90% 的时间你可以从那里识别出慢速资源。