1.加载和执行 高性能JavaScript

既然是总结,就不要重复书中内容了,适当总结、扩展、思考。

书中提到以下几种脚本引用方式。

1 直接引用

 1.1 放在head中  相比body会阻塞dom元素生成,使页面空白

 1.2 放在body的最后  ---较好的实践方法用此颜色

2 脚本合并打包

3.无阻塞方式加载

 3.1 用defer不会阻塞进程  但是不能跨浏览器

 3.2 动态添加script

 3.3 xmlhttpRequest注入  不能跨域、不能cdn

为什么我会标注三种最佳实践方式,实际上这三种是不重复的。

1.放在body最后,会使dom元素在script的下载阻塞页面之前生成。

2.脚本合并压缩可以减少http请求数以及减小文件大小。

3.动态添加script的原因是按需要加载script内容,只把初始的内容放在页面中。这样既可以操作页面,同时无阻塞的下载加载script。

书中提到了lazyLoad、LABJs、YUI3的动态添加script的类库封装。

现在比较火的SeaJs也是在这方面相当成熟的一个类库。

http://www.cnblogs.com/leoo2sk/archive/2011/06/27/write-javascript-with-seajs.html

这里有介绍。

顺便提一下玉伯是我葱白的前端大牛之一。

原文地址:https://www.cnblogs.com/bugluo/p/2849899.html