时间戳

首页 > 解决方案 > 预加载一个cdn缓存文件

javascript - 预加载一个cdn缓存文件

问题描述

我有一个缓存在某个 CDN 中的文件。

在我的本地环境中，您可以将浏览器中的标记读取为

<script src="/js/cool.js"></script>

但是一旦它投入生产，它就像：

<script src="/js/cool.js.pagespeed.ce.l2D9mD1nmX.js"></script>

.pagespeed.ce.l2D9mD1nmX.js表示它正在被缓存

现在我想知道预加载已经缓存在cdn中的文件是否可取或做法？

因为我在做

<link rel="preload" type="application/javascript" href="/js/cool.js" as="script">

在我的<head>，这会给我警告：

资源（预加载文件）是使用链接预加载预加载的，但在窗口加载事件后的几秒钟内未使用。请确保它具有适当的as值并且是有意预加载的。

因为技术上/js/cool.js不再存在于dom中

标签： javascripthtmlcachingcdnpreload

解决方案

在您的模块捆绑器中使用预加载插件。

问：预加载已经缓存在 cdn 中的文件是可取的还是一种做法？

A. 是的，假设您的cool.js确实需要预加载。

现在，警告实际上是预期的。看，cool.js.pagespeed.ce.l2D9mD1nmX.js和cool.js是服务器上的两个不同的文件。由于某些原因，您的文件cool.js.pagespeed.ce.l2D9mD1nmX.js实际上是code.js由您的模块捆绑器生成的克隆。您正在做的是预加载，其代码永远不会在生产中执行，因此警告 - ...preloaded using link preload 但在窗口加载事件后的几秒钟内未使用。但是，您真正需要做的是 preload 。假设您使用webpack作为模块捆绑器，您需要一个名为preload-webpack-plugin 的插件来实现相同的功能。cool.jscool.js.pagespeed.ce.l2D9mD1nmX.js

推荐阅读