避免来自相同 svg 图标的重复请求(磁盘缓存)

分享于2022年07月17日 angular caching http svg typescript 问答
【问题标题】:避免来自相同 svg 图标的重复请求(磁盘缓存)(Avoid repeated requests from same svg icons (disk cache))
【发布时间】:2022-01-23 16:28:17
【问题描述】:

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

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

此外,当浏览器使用磁盘缓存(第二次访问相同的 url)时会发生什么也会很有趣。我可以只缓存一次图标吗?最好的策略应该是什么?谢谢 Avoid repeated requests from same svg icons (disk cache)


【解决方案1】:

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

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