代码之家  ›  专栏  ›  技术社区  ›  Omar Al-Ithawi

哪个更适合JavaScript加载时间:压缩一个大文件中的所有内容还是异步加载所有内容?

  •  9
  • Omar Al-Ithawi  · 技术社区  · 15 年前

    一个简单的问题,我不确定它是否有一个简短的答案!


    我有一个JavaScript文件要加载到一个网站中,这里有一些关于它们的注释:

    • 它们都来自同一个域(不需要跨域加载)
    • 它们在网站上是一样的。
    • 有几个文件,比如jQuery,还有5个其他插件,还有我自己的基于它们的应用程序脚本。
    • 它们的大小都是压缩的=224KB,(我将所有文件合并到一个文件中,然后使用YUI Compressor 2立即压缩它们

    问题
    我听说224KB不适合放在一个文件中!它应该被分成几个文件,每个文件的最大容量为44KB。。我不记得什么时候听过这个,我也不确定把它拆分成更多的文件是否有效,但224KB第一次加载确实需要很长时间,当然考虑到网站加载了图片和css。

    Source 决定是:

    是还是不是?

    4 回复  |  直到 15 年前
        1
  •  6
  •   Lou Franco    15 年前

    这取决于站点是什么以及首次加载时间对站点的重要性。

    http://encosia.com/2008/12/10/3-reasons-why-you-should-let-google-host-jquery-for-you/

    卡布奇诺团队是一个文件的大力支持者——他们制作了一个javascript框架。使用他们的工具制作的应用程序预计会有一些加载时间。

    http://cappuccino.org/discuss/2009/11/11/just-one-file-with-cappuccino-0-8/

        2
  •  4
  •   Matt Klinker    15 年前

    从公共CDN加载JQuery和相关内容的另一个好处是按目的地增加了请求。我相信客户端每个域只能有两个请求,因此通过从google加载jquery,从jquery加载插件,从自己的域加载自定义应用程序代码,浏览器可以同时执行这些请求,而不是等待前两个请求,然后再发出第三个请求。

    我想这也比一个大文件增加了另一个性能改进。即使您只是将1个文件拆分为2个,也可以使用来自浏览器的2个并发请求来检索它,这可能会缩短加载时间。

        3
  •  3
  •   Mic    15 年前

    以下是我们为使我们的web应用程序快速运行所做的工作。


    删除HTML的空白,并将图像转换为 data:image/png

    大小约为400kb,但已缓存和gzip。
    移动版的web应用程序是相同的,但大小约为250kb。

    然后第二个http调用获取数据(JSON),我们使用 PURE

    应用程序被划分为多个模块,只有公共模块才以这种方式预加载。
    其他人是应用户要求而来的。

        4
  •  2
  •   Rajat    15 年前

    通常,您只想在pageload上下载web应用程序普遍需要的JS文件。特定于模块或页面的JS文件不应在主JS下载中压缩,理想情况下应按需加载。