HTML5 Boilerplate和jQuery

我想知道为什么来自http://html5boilerplate.com/的样板在web内容之后声明了jQuery? 这有充分的理由吗?

这是代码的片段……

 

Hello world! This is HTML5 Boilerplate.

window.jQuery || document.write('')

PS什么是window.jQuery || 部分吗?

它检查CDN副本是否正确加载。 如果没有,它会加载本地副本。


当jQuery在页面上运行时,它会创建一个全局jQuery变量。 这也可以作为全局对象的属性来访问: window.jQuery 。 如果jQuery没有运行, window.jQuery将是undefined

|| 是以下的简写版本:

 if ( window.jQuery == undefined ) { document.write(' 

这样,如果Google的CDN关闭(或者浏览器无法访问ajax.googleapis.com ),您的网站就不会中断。 相反,将从您的域提供相同的jQuery副本。


它处于底层的原因是因为雅虎的性能指南建议:

脚本引起的问题是它们阻止了并行下载。 HTTP / 1.1规范建议浏览器每个主机名并行下载不超过两个组件。 如果您从多个主机名提供图像,则可以并行执行两次以上的下载。 但是,在下载脚本时,即使在不同的主机名上,浏览器也不会启动任何其他下载。

[...]

如果可以延迟脚本,也可以将其移动到页面底部。 这将使您的网页加载速度更快

有关这方面的更多信息,请参阅Steve Souders 关于此主题的精彩文章 。

将Javascript放在HTML文件中的哪个位置? 涵盖了为什么将javascript放在页面底部是好的。 基本上,因为它使您的页面加载更快。

window.jQuery || 正在检查以确保您从CDN下载了jQuery。 如果不是(假设CDN已关闭),它将使用您的本地文件。

最好在内容之后使用JavaScript,这样JavaScript就不会阻止页面加载。

有关更多信息,请参阅Steve Sounder的博客文章。

window.jQuery || 如果CDN副本不可用,则部分从本地托管的副本加载jQuery。

基本上,脚本标签正在加载来自Google服务器的jQuery,这些服务器速度非常快,遍布全球。 此外,由于许多网站从谷歌服务器加载jQuery,很多人都将其缓存在浏览器中。 无论哪种方式,人们都会很快得到它。

问题是,如果谷歌的服务器停机,它将无法加载jQuery。 为了保护我们免受从谷歌加载jQuery后不可能出现的影响,我们有一个JavaScript表达式。 它是条件表达式A OR B 在这种情况下,表达式的左侧是jQuery变量,如果它是从Google成功加载的,那将是jQuery全局对象,这是JavaScript中的“truthy”值,它将评估为true。 因为在OR表达式中如果一方是真的,则不需要评估B端JavaScript将永远不会执行该行代码的其余部分。 这称为短路评估 。

如果jQuery无法从Google CDN加载,则全局jQuery变量将是未定义的。 这是一个“假”值,因此JavaScript将执行OR表达式的右侧。 在这种情况下,右侧会在页面上写入新的脚本标记。 新的脚本标记从相对域加载jQuery,这意味着托管此站点的服务器相同。 它可能没有从Google加载它那么快,但至少我们知道它会起作用。