Modernizr 会加载脚本一次吗？答案

【问题标题】：Does Modernizr load the script once?Modernizr 会加载脚本一次吗？
【发布时间】：2012-12-20 19:53:24
【问题描述】：

我正在使用 Modernizr 的加载器（集成的 yepnope.js）有条件地加载 javascript 代码。这是我的代码：

Modernizr.load({
test: Modernizr.geolocation,
yep: ['js/get-native-geo-data.js','https://www.google.com/jsapi'],
nope: ['js/get-geo-data-by-ip.js','https://www.google.com/jsapi'],
complete : function () {
    google.load("maps", "3", 
                {other_params: "sensor=false", 'callback':init});
});

它可以工作，但 FireBug 和 Google Developers 工具中的“网络”选项卡显示它会加载两次 get-native-geo-data.js。我在 native-geo-data.js 中添加了一个 console.log()，并且只打印了一次消息。那么是什么让 FireBug 和 Dev Tools 报告两个网络调用都返回 200，大小为 3K？

这是 Firebug 报告每个 GET 响应标头的方式（它们是相同的）：

HTTP/1.1 200 OK
Date: Thu, 20 Dec 2012 19:39:52 GMT
Server: HttpComponents/4.1.3
Content-Length: 3054
Content-Type: application/x-javascript
Connection: keep-alive

通过 Charles 监控工具运行它后，我看到了相同的结果 - 该函数被调用了两次。那么错误在哪里 - 在 Modernizr、yepnope 或我的脑海中？

【问题讨论】：

标签： javascript firebug modernizr yepnope

【解决方案1】：

不确定您是否在 yepnope 文档中看到过它：

我在我的开发工具中看到两个请求，为什么它会加载所有内容两次？根据您的浏览器和服务器，这可能意味着几个不同的东西。由于 yepnope 工作方式的性质，有是对每个文件提出的两个请求。第一个请求是加载资源进入缓存，第二个请求是执行它（但是因为它在缓存中，它应该立即执行）。看到两个只要第二个请求被缓存，请求就很正常。如果您注意到第二个请求没有被缓存（并且您的脚本加载时间加倍），然后确保您发送正确的缓存标头以允许缓存您的脚本。这对是的。如果没有启用适当的缓存，它将无法工作。我们其实测试以确保在我们的测试套件中没有加载两次，所以如果您认为我们的浏览器中可能存在关于双重加载的错误，我们鼓励您运行测试套件，看看是否双重加载测试通过。

【讨论】：

感谢 yepnope 文档中的参考。在我的情况下，它绝对没有被缓存。 yepnope 文档没有说明如何正确指定缓存策略。我发现的唯一其他参考是使用预加载，但这正是我不想做的——我需要加载一个或另一个脚本。我尝试使用预加载前缀 yep: ['preload!js/get-native-geo-data.js','google.com/jsapi'] ，但没有任何区别。
尝试在 HTML 文件中使用 - 也没有帮助。
您也可以在此处阅读此问题github.com/SlexAxton/yepnope.js/issues/10 在这种情况下，您似乎不能 100% 依赖 Firebug 信息。
我已经阅读了所有在线讨论，但是三个不同的监控工具报告了重复下载，这些重复下载在时间线上分别显示并且需要实时，而不仅仅是 1 毫秒从缓存中读取。另一方面，所有这些报告工具都会在控制台上打印我从脚本中下载的调试消息一次。如果 yepnope 的人能解释为什么监控工具会这样显示，那就太好了？我试图在 yepnope 的 github 站点上将此作为新问题打开，但出现“不允许”错误。