使用Html5boilerplate的代码加载JQuery在本地运行时非常慢
我一直在使用以下代码在我的所有项目中加载 JQuery。我从 http://html5boilerplate.com/ 获取它。人们对这种技术进行了广泛的讨论 此处。
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="jquery-1.7.1.min.js"><\/script>');</script>
这段代码工作得很好,而且一旦我把它放在互联网上,看起来就非常快,但是当我在本地打开我的 .html
文件时,每次刷新大约需要 10 秒。一般来说,我会厌倦并按如下方式更改代码:
<!-- uncomment when going live
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="jquery-1.7.1.min.js"><\/script>');</script>-->
<!-- remove following line when going live -->
<script src="jquery-1.7.1.min.js"></script>
我在这里遗漏了一些明显的东西吗?我觉得我不应该获得超慢的加载时间,但当注释掉这些行时它确实会自行解决。
I have been using the following code for loading JQuery in all of my projects. I grabbed it from http://html5boilerplate.com/. There is extensive disussion of this technique here.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="jquery-1.7.1.min.js"><\/script>');</script>
This code works great and seems pretty darn quick once I've put it up on the interwebs, but when I open my .html
file locally it takes ~10 seconds per refresh. Generally I get fed up and alter the code as follows:
<!-- uncomment when going live
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="jquery-1.7.1.min.js"><\/script>');</script>-->
<!-- remove following line when going live -->
<script src="jquery-1.7.1.min.js"></script>
Am I missing something obvious here? I feel like I should not be getting the super-slow loading times, but it does resolve itself when comment out those lines.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
我猜您没有通过网络服务器提供 HTML。
url 上的
//
前缀表示它应该使用与当前资源相同的协议(通常是 http 或 https),因为您不是通过 http 而是通过文件提供服务,所以它会尝试在本地文件系统上查找它,最终超时。
Chrome 检查器上的网络选项卡显示它尝试为我加载以下内容:
它会尝试加载这些时间,文件系统(或者可能是浏览器)最终将超时。
正确的方法是通过 Web 服务器提供服务,如果您使用的是 Windows,则为 IIS;如果您使用的是 Linux/Mac,则为 Apache(Apache 也适用于 Windows,但 IIS 有更好的 UI 工具)
I'm guessing that you're not serving the HTML through a web server.
The
//
prefix on the url indicates that it should use the same protocol as the current resource (usually either http or https)Since you're not serving through http and instead through a file, it's trying to look for it on your local file system, eventually timing out.
The network tab on Chrome inspector shows it trying to load the following for me:
It'll try to load those times and the file system (or maybe the browser) will eventually timeout.
The proper way is to serve it through a web server, either IIS if you're on Windows or Apache if you're on Linux/Mac (Apache also works in Windows, but IIS has better UI tools)
此行:
尝试查找jQuery 在你的文件系统中,这意味着需要一段时间才能失败。在 Google Chrome 中查看开发人员面板的“网络”选项卡时,它会尝试在
file://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js 中查找文件
。然后,一旦找不到文件,它就会使用下一行加载 jQuery(并成功找到文件):要解决此问题,请添加
https:
到脚本标记的src
中,如下所示:This line:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
Attempts to find jQuery in your file system, which means it will take a while to fail. While looking at the Network tab of the developer panel in Google Chrome, it attempts to look for the file in
file://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js
.Then, once it has failed to find the file, it loads jQuery (and successfully finds the file) using the next line:<script>window.jQuery || document.write('<script src="jquery-1.7.1.min.js"><\/script>');
To remedy the problem, add
https:
to thesrc
of your script tag, like so:<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>