多少速度JS的不断积累与RequireJS / AMD？ [英] How much speed is gained with RequireJS/AMD in JS?

问题描述

快多少是requireJS实际上，在一个大的网站？

How much faster is requireJS actually, on a large website?

任何人做任何测试在使用异步加载VS并不大网站的速度？

Has anyone done any tests on the speed of large websites that use asynchronous loading vs not?

例如，利用骨干有很多的意见（> 100），是它更好地只是有一个被一次加载所有的景色，然后始终可用一个视图对象，还是应该全部被异步的加载需要的？

For instance, using Backbone with a lot of views (> 100), is it better to simply have a views object that gets loaded with all the views at once and is then always available, or should they all be loaded asynchronously as needed?

此外，是否有对这些考虑为移动VS台式机的区别是什么？我听说你要限制的数量的移动，而不是大小的请求。

Also, are there any differences for these considerations for mobile vs desktop? I've heard that you want to limit the number of requests on mobile instead of the size.

推荐答案

我不相信的 require.js 是加载所有脚本异步的生产<意图/ em>的。在发展的每个脚本的异步加载是方便，因为你可以改变你的项目，并没有一个编译的步骤重装。然而，在的生产的你应该结合所有的源文件的到一个或多个大使用模块的 r.js优化。如果大的web应用可以推迟的模块的子集加载到稍后的时间（例如一个特定的用户动作之后），这些模块可以分别优化和生产异步加载

I don't believe that the intent of require.js is to load all of your scripts asynchronously in production. In development async loading of each script is convenient because you can make changes to your project and reload without a "compile" step. However in production you should be combining all of your source files into one or more larger modules using the r.js optimizer. If your large webapp can defer loading of a subset of your modules until a later time (e.g. after a particular user action) these modules can optimized separately and loaded asynchronously in production.

关于加载一个较大的JS文件VS多个较小的文件，一般的速度：

Regarding the speed of loading a single large JS file vs multiple smaller files, generally:

减少HTTP请求已经成为一种普遍的格言加快前端的性能，这是一个问题，在今天的世界移动浏览器（经常在网络上，要比宽带连接慢的顺序运行），甚至更多的相​​关。 [参考]

"Reduce HTTP requests" has become a general maxim for speeding up frontend performance, and that is a concern that’s even more relevant in today’s world of mobile browsers (often running on networks that are an order of magnitude slower than broadband connections). [reference]

但也有其他因素，如：

• 移动缓存： iPhone手机限制的文件，他们缓存大小这么大的文件可能需要每次都下载，使得许多小文件更好。


• CDN用法：如果您使用的是常见的第三方库例如的jQuery 它可能是最好不要将其包含在一个大单的JS文件，而不是从CDN加载因为你的网站的用户可能已经在他们的高速缓存从其他网站（的引用）。的有关详细信息，请参见下面更新的


• 懒惰的评价：AMD模块可以懒洋洋地分析和评估，允许在用户加载应用下载，同时推迟解析+ EVAL的成本，直到需要的模块。请参见这文章和系列它引用其他旧文章。


• 目标浏览器：浏览器限制每个主机并发下载的数量。例如，IE 7将只能从给定主机下载两个文件兼任。其他限制为4，和其他6 [参考]

• Mobile Caches: iPhones limit the size of files they cache so big files may need to be downloaded each time, making many small files better.
• CDN Usage: If you use a common 3rd party library like jQuery it's probably best not to include it in a big single JS file and instead load it from a CDN since a user of your site may already have it in their cache from another website (reference). For more info, see update below
• Lazy Evaluation: AMD modules can be lazily parsed and evaluated allowing download on app load while deferring the cost of parse+eval until the module is needed. See this article and the series of other older articles that it references.
• Target Browser: Browsers limit the number of concurrent downloads per hostname. For example, IE 7 will only download two files from a given host concurrently. Others limit to 4, and others to 6. [reference]

最后，这里有一个很好的文章由史蒂夫Souders的的那总结了一堆脚本加载技术。

Finally, here's a good article by Steve Souders that summarizes a bunch of script loading techniques.

更新：重新CDN用法：史蒂夫Souders的发布使用CDN的标识许多注意事项，利弊第三方库（如jQuery的）的详细分析。

Update: Re CDN usage: Steve Souders posted a detailed analysis of using a CDN for 3rd party libraries (e.g. jQuery) that identifies the many considerations, pros and cons.

这篇关于多少速度JS的不断积累与RequireJS / AMD？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！