如何在angular 8中指示chrome功能模块的下载优先级(低、高或最高)



我已经在角度和加载延迟中编程了模块的定制预加载策略,以模拟优先级顺序(示例)。虽然所有内容都在预装的版本中正确加载,但在Chrome Devtool中,模块的下载优先级较低,我如何从angular 8设置Chrome下载优先级?

严格来说,没有一种特定的角度方式来为延迟加载/预加载的组件分配优先级。无论如何,我会给你一些想法,因为我也对这个问题感兴趣。

我想你已经读过谷歌关于网页上下载资源优先级的说法:

  • https://developers.google.com/web/fundamentals/performance/resource-prioritization
    (TLDR从高到低:CSS->预加载为=style->头脚本>异步>>加载为=script->defer)
  • https://developers.google.com/web/updates/2019/02/priority-hints
    (TLDR资源标签上的附加importance属性,将highlowauto作为其"值")

可悲的是,尽管这些解决方案/解决方案似乎在Chrome中运行良好,但它们不是任何标准的一部分,因此不能保证其他浏览器会考虑它们来调整资源优先级。

作为Angular解决方案,我想到的是使用APP_INITIALIZER加载任何需要"高">优先级的所需依赖项,或者至少在应用程序初始化时(启动前)加载。

另一个可能有用的想法是使用ServiceWorkers,在那里您可以指定缓存策略,包括面向性能的缓存策略。正如我在检查我正在工作的网站时所能想到的那样,服务人员处理的资源是以高优先级下载的,但我想你的里程可能会有所不同。

希望它能有所帮助,并向智利致以最良好的问候
JoséIgnacio

最新更新