javascript - 在HTML中集成Javascript资源 : what's the best way?

标签 javascript performance

我正在从事一个使用许多脚本(Google map 、jQuery、jQuery 插件、jQuery UI...)的项目。有些页面有将近 350 kB 的 Javascript。

我们很关心性能,我问自己什么是集成那些繁重脚本的最佳方式。

我们有两种解决方案:

  • 在头部包含所有脚本,即使它们未在页面上使用。
  • 在头部包含一些常用脚本,并在需要时包含特定于页面的脚本。

我想听听您的建议。

谢谢。

最佳答案

为了获得最佳性能,我会创建一个静态缩小的 javascript 文件(使用像 YUI 压缩器这样的工具)并从 head 部分引用它。有关网站性能的好提示,请查看 googles website optimizations页面。

请注意,检索所有 javascript 文件的性能损失只发生在第一页上,因为浏览器将在后续页面上使用该文件的缓存版本。

为了获得更好的响应能力,您可以将 javascript 分成两个文件。在页面加载时使用您需要的所有 javascript 加载第一个文件,然后在页面加载后在后台加载第二个文件。

如果你感兴趣,我有一个开源的AJAX javascript framework这简化了将所有 html、css 和 javascript(包括第 3 方库)压缩并连接到单个 javascript 文件中。

关于javascript - 在HTML中集成Javascript资源 : what's the best way?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2279856/

相关文章:

javascript - Service Worker "Content Download"可以比实际获取的时间长吗?

javascript - 如何使用 jquery 将段落的原始文本格式放入 html 段落元素中?

javascript - 如果月份是从 29、30、31 开始的 1 月,如何添加下一个订阅日期以避免在 javascript 中出现 2 月的同一日期?

c++ - 周期性 FPS 下降的可能原因?

mysql - 两个关系表的MySQL数据库架构

MySQL JOIN 和 ORDER BY - 性能问题

javascript - 将 slider 箭头转换为点 slider

javascript - onreadystatechange 函数未被调用

Python/Numpy 查找长度变量跨度

javascript - 如何通过附加图标提高 jQuery 性能?