什么在移动设备上表现更好? Head.js还是一个大js文件?

时间:2013-05-24 15:23:28

标签: javascript requirejs loading

我正在阅读head.js主页上的理论部分(http://headjs.com/)我同意并行加载脚本的效果更好。但必须有限制吗?

  • 我通常有很多js文件。我喜欢我的应用程序非常模块化,大多数脚本都在1到3KB之间。这似乎是很多http请求,并且会同时杀死loding脚本的好处。我想知道是否有人进行某种测量,看看使用head.js这样的加载器的阈值有什么意义,以及哪里有一个大的js文件更好? (所有文件同样缩小)

  • 我的另一个问题是4G连接设备。我们知道,在4G网络上,HTTP请求的开销更大。在这种情况下,head.js(或require.js,或lab.js,......)这样的解决方案是否仍然有意义?

2 个答案:

答案 0 :(得分:4)

免责声明:我目前正在开发HeadJS

第一件事1,网站上的理论部分已经很老了,你看到的瀑布截图就像FF3或者4 ..导航器从那时起已经走了很长的路:)

确实并行加载是最好的,但秘密就是,几乎所有导航员今天都在幕后自己做BrowserScope Stats

我的建议是:

  • 缩小你的js
  • 制作一个大包
  • 将其粘贴在页面底部

现在,只需要在< head>,也就是1个脚本中使用单个脚本,即可让您的产品正常运行。允许您使用.ready(function)将功能推送到页面末尾/ p>

努力实现通过CSS(如引导程序或其他)工作的UI布局,而不是JS(jQuery Mobile或其他)。

如果您确实需要将某些功能推送到页面的末尾,那么HeadJS可以帮助您,因为它已经内置了.ready()。您仍然应该努力在页面底部放置除HeadJS之外的所有脚本

进入页面底部后,通过脚本标记(首选方法)包含脚本,或者如果需要动态依赖关系管理,请使用.js()并行加载脚本。

嗯,还有其他事情要考虑,但上面的内容已经有很长的路要走了。

答案 1 :(得分:1)

免责声明:链接是由我撰写的资源。

使用RequireJS或任何其他AMD加载程序。这样您就可以选择性地或按需加载资源。您可以通过这种方式构建应用程序,以便最小化最初所需的资源,并在以后异步加载其余资源。检查: Understanding AMD & RequireJS