页面优化之加快JS下载速度

本文综合了网上的几篇文章,揉捏到一块了,估计网上也有这种揉捏版本,如有雷同,纯属巧合

  越来越多的Web开发采用了JS库,如Extjs,这样的好处是开发效率高,界面可用性高,而且好看(尤其对于 没有美工的团队来说,它尤其合适)。但问题是通常这样的类库连同他带的CSS文件都比较大,通常有500k-600k . 用户第一次访问的时候,会等待较长时间.如何让用户感觉访问起来很快呢?可以使用如下办法。

  1. JS文本压缩,很多工具头提供压缩JS文件,如去掉空格和回车符号,去掉注释。

  2. 向Extjs这样的库即使压缩了也很多,可以配置服务器端的压缩功能,压缩成gzip,如Tomcat:

           compression="on"
        compressionMinSize="2048"
        noCompressionUserAgents="gozilla, traviata"
        compressableMimeType="text/javascript,text/xml,text/css"    
       />

           这样能节省一半的带宽

     3. 采用动态下载,在用户访问首页 的时候,在页面尾部动态加载 JS.客户在浏览首页过程中或者在填写登陆用户名过程中,JS文件已经下载完了或者差不多了.

    如下定义了动态加载的代码:


其中version是提供一种版本号,每次修改js或者css,可以让浏览器下载最新的版本

最后,这套方案再次验证了,要使得系统性能好,要么是它真的好,要么使得它看起来很好

你可能感兴趣的:(页面优化之加快JS下载速度)