避免来自相同 svg 图标的重复请求（磁盘缓存）答案

【问题标题】：避免来自相同 svg 图标的重复请求（磁盘缓存）
【发布时间】：2022-01-23 16:28:17
【问题描述】：

我有一个包含不同信息卡的页面。该卡片包含插图（每张卡片一个）和具有多个选项（编辑、删除、更多...）的不同图标 (SVG)。每一张卡片都包含一个插图+图标。但是所有的图标都是相同的所有卡片。

我要避免的只是在进行提取时一次又一次地调用（每张卡一个）相同的图标（我正在使用app-svg 自定义组件从我的/assets 文件夹中获取 SVG .)

此外，当浏览器使用磁盘缓存（第二次访问相同的 url）时会发生什么也会很有趣。我可以只缓存一次图标吗？最好的策略应该是什么？谢谢

【问题讨论】：

【解决方案1】：

我认为角度服务工作是一个很好的选择，并带来其他性能提升。它为各种类型的请求提供了强大的缓存信息策略，其中之一是资产https://angular.io/guide/service-worker-intro

如果您不想使用服务工作者路线，我建议您研究 Angular HttpInterceptors (https://angular.io/api/common/http/HttpInterceptor)，以及如何在此时实现缓存以响应请求而不离开您的应用

【讨论】：