Pages

Friday, 25 May 2012

把script放到页面的最后,以提高页面载入速度

script,这里指的就是javascript,之前提到过要把CSS放到页面的最前面,现在说要把script放到最后,这就是因为两者的主要功能不同。
CSS是用来负责展示,布局,它不下载完,对于渲染整个页面是有阻碍作用的。也就是说,它不下载完,不完成渲染页面,用户就看不到内容。
而javascript,负责的是用户和界面的交互,比如点击某个锚点时,显示个什么,或者作出何种反应等等,这些都需要等待页面展示出来,用户看到页面之后,再用鼠标来操作。所以可以晚一点下载。
另外,script下载是单线程的,而其它的比如图片等都是可以几个文件并行下载的,根据http1.1标准,是允许同一域名下,两个资源同时下 载,当然IE,Firefox的默认值都比标准高,IE是10个,Firefox是6个。但因为javascript的特殊性,它有运行的先后顺序关系, 所以为保证javascript的运行顺序同它们在html里的先后顺序一致,才采用了单文件的下载方式。

因此在具体实现的时候,就要采用把css它们放到head里,而把js放到最后,在body关闭之前,以提高页面载入速度。
但现在随着js的发展,也出现了把javascript放在head里,其中的脚本文件会异步下载,不会阻塞其它下载内容的技术,Google Analytics就有采用.