看了《高性能JavaScript》的读书笔记
几个原则:
1、将脚本放在底部
<link>还是在head中,用以保证在js加载前,能加载出正常显示的页面。
<script>放在</body>前。
2、成组脚本
由于每个<script>标签下载时阻塞页面解析过程,所以限制页面的<script>总数也可以改善性能。适用于内联脚本和外部脚本。
3、非阻塞脚本
等页面完成加载后,再加载js代码。也就是,在window.load事件发出后开始下载代码。
(1)defer属性:支持IE4和fierfox3.5更高版本浏览器
<script defer>...</script>
内联和外部文件
带defer属性的<script>可出现在文档的任何位置,对应的js文件将在<script>被解析时启动下载,但代码不会执行,直到DOM加载完毕(在onload事件句柄被调用之前)。所以实现了和也卖弄其他资源一起并行下载。
(2)动态脚本元素
文档对象模型(DOM)允许你使用js动态创建HTML的几乎全部文档内容。
复制代码 代码如下:
var script=document.createElement("script");
script.type="text/javascript";
script.src="/UploadFiles/2021-04-02/file.js">
document.getElementByTagName_r("head")[0].appendChild(script);
此技术的重点在于:无论在何处启动下载,文件额下载和运行都不会阻塞其他页面处理过程。即使在head里(除了用于下载文件的http链接)。
(3)The YUI3 approach
理念:用一个很小的初始代码,下载其余的功能代码,先引入文件:
复制代码 代码如下:
<script type="text/javascript src=//img.jbzj.com/file_images/article/201306/yuanma/combo.js></script>
此种子文件大约10KB,
使用:
复制代码 代码如下:
YUI().use("dom",function(Y){
Y.Dom.addclass(...)
})
当所有代码可用时,回调函数被调用,YUI实例作为参数传入,就可以立即使用新下载的功能。
The LazyLoad library
使用:先引入:lazyload-min.js
(4)
复制代码 代码如下:
LazyLoad.js("a.js",function(){
Appliction.init();
})
多个文件:
复制代码 代码如下:
LazyLoad.js(["a.js","b.js"],function(){
Application.init();
})
(5)The LABjs library
先引入:lab.js
复制代码 代码如下:
$LAB.script("a.js").wait(function(){
Application.init();
})
多个文件,就链式写法
他的独特之处在于能够管理依赖关系。
可以通过wait()函数指定哪些文件应该等待其他文件。
例如:b.js的代码保证不在a.js之前运行
复制代码 代码如下:
$LAB.script("a.js").wait().script("b.js").wait(function(){
Application.init();
})
这样,虽然两个文件是并行下载的,却能保证a.js能在b.js之前执行
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
更新日志
- 纪钧瀚《钢琴阅读时光 雨中书店聆听轻音乐》[FLAC/分轨][399.62MB]
- 证声音乐图书馆《走向自然 疗心爵士乐》[320K/MP3][87.4MB]
- 证声音乐图书馆《走向自然 疗心爵士乐》[FLAC/分轨][184.94MB]
- 陈慧娴.2018-Priscilla-Ism演唱会3CD(2024环球红馆40复刻系列)【环球】【WAV+CUE】
- 郑秀文.1999-我应该得到(国)【华纳】【WAV+CUE】
- 陈家慧.2011-钢琴酒吧2CD【龙吟唱片】【WAV+CUE】
- 证声音乐图书馆《雨季 蓝调吉他 Rainy Blues》[320K/MP3][45.01MB]
- 证声音乐图书馆《雨季 蓝调吉他 Rainy Blues》[FLAC/分轨][109.13MB]
- 赞多《序章》[320K/MP3][45.54MB]
- 许巍.2004-每一刻都是崭新的【步升大风】【WAV+CUE】
- 群星.2024-四方馆影视原声带【韶愔音乐】【FLAC分轨】
- 陈雷.1997-安锁咧【金圆唱片】【WAV+CUE】
- 关淑怡.2013-MY.FAVORITE.SK.3CD【环球】【WAV+CUE】
- Sweety.2006-花言乔语【丰华】【WAV+CUE】
- 李恕权.2003-回·20年全精选2CD【SONY】【WAV+CUE】