Question

我负责建立乐队的网站和tumblr。我正处于论文选秀阶段。目前正在考虑如何处理脚本以优化性能。

基本上，我需要：

jQuery：一旦准备好DOM，就会操纵DOM。
带有jPlayer播放列表插件的jPlayer，用于带有Flash后备的HTML5音乐播放器。
从Songkick API加载数据的自定义脚本（巡视日期）。它会在页面上添加巡回演出。应该在DOM准备好之后发生（Ajax请求）。
使用API从SoundCloud加载歌曲的自定义脚本。当用户点击音乐播放器中的播放按钮时（这些是长音轨，在页面加载期间加载它们是不好的做法），应该会发生这种情况。

所以，我正在考虑如何构建所有这些脚本，以便在良好的时间顺利发生事情。我已经离开开发场景已经有好几年了，但是在发布之前就读了一下。看到现在JS的设计模式倾向于使用模块化方法。我在RequireJS网站上看了一下，可能会试一试。

好吧，我的主要问题是，我应该如何构建我的脚本，以便在正确的时间以最佳性能加载？ RequireJS是解决此类设计模式问题的选择吗？

抱歉，这不是语法问题，而是更多思考预编码问题。我只想在弄脏手之前想好。

此致 O操作。

Answer 1

我认为你有premature optimization的风险。我只是正常加载脚本，如果你看到性能问题，那么你可以引入像Require.js这样的工具。只有4个脚本，我怀疑你会遇到任何问题。

那就是说，加载脚本的几个指针：

将脚本加载到<body>底部（</body>结束标记之前），而不是<head> - 这样就可以加载您的网页内容不要被你的脚本阻止。
将自定义脚本包裹在document.ready：
中
```
$(document).ready(function() {
  // your code
});
```
这意味着在加载所有内容之前，您的脚本不会运行，从而避免了加载顺序的任何问题。
使用Google的CDN加载jQuery。它很快，而且（更重要的是）很多网站都使用它，所以它很可能已被用户缓存：
```
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js">
```
https://developers.google.com/speed/libraries/devguide

如果你仍然担心加载脚本的不同方法，这是我所知道的最好的资源，每种方法都有详尽的Pro / Cons：