1

我想在关闭</body>-Tag 之前放置 jQuery,就像推荐的那样。但是因为我使用的是内容管理系统,所以需要 jQuery 的内联脚本将在结束 body 标记之前执行。

我现在的问题是:是否值得在数组中收集基于 jQuery 的脚本并在加载 jQuery 时在文档末尾运行它们(EXAMPLE)或者只是在头部加载 jQuery?

4

2 回答 2

4

您可以采用此处描述的方法

q这个想法是很快在标题中创建一个全局变量,并使用一个临时window.$函数来收集所有依赖于 jQuery 的代码/函数/插件。

window.q=[];
window.$=function(f){
  q.push(f);
};

在你加载 jQuery 之后,你会将所有函数传递给真正的$.ready函数。

$.each(q,function(index,f){
  $(f)
});

通过这种方式,您将能够在 jQuery lib 包含之前安全地包含您的 jquery 代码

如果这可能比在头部加载 jQuery 更好,那可能取决于您必须将多少代码推送到q临时函数中。

放置到<head>section 中的 jQuery 需要一个单独的阻塞script。但是如果你有很多代码要在文档中的任何地方注入,你可能会有很多巨大的阻塞脚本来停止渲染过程。

相反,在 dom 就绪事件之后加载大量脚本可以很容易地使您的页面加载速度更快,因此这种方法更好,并且好处可以更加明显。

所以没有一个对所有代码和所有页面都有效的明确答案:即使这种技术通常是好的和可取的(因为你有尽可能晚的脚本执行的好处),你应该做一些使用这两种方法进行测试并查看加载和渲染时间。开头的文章对性能有一些考虑,但也解释了为什么stackoverflow没有使用它。

于 2012-04-26T07:54:52.380 回答
0

只需在头部加载 jQuery,它会在第一次加载后被缓存,之后不会减慢任何速度。

其他一切听起来都像是过头了,我不确定性能的提升是否会如此显着以证明额外工作的合理性。

有时,如果您的页面在底部使用 javascript 加载缓慢,则可能需要更长的时间才能加载,这意味着没有 javascript 的视觉效果可能是可见的,并且无法为用户提供如此好的体验。

于 2012-04-26T07:54:07.467 回答