加载页面时如何提升性能

将要加载的脚本放到body底部:

最简单且最常用的方法,当页面加载完DOM元素之后再加载脚本文件

减少引入脚本数量

若有多个脚本文件,可以使用YUI Compressor压缩为一个文件

使用无阻塞脚本

load事件之后在下载脚本

延迟脚本

使用defer属性

在js中动态创建脚本元素

var script = document.createElement('script');
script.src = path;
script.type = 'text/javascript';
head.appendChild(script);

使用XMLHttpRequest脚本注入

var xhr= new XMLHttpRequest();
xhr.open('get', 'test.js', true);
xhr.onreadystatechange = function(){
if (xhr.readyState == 4){
if (xhr.status >= 200 && xhr.status < 300 || xhr.status == 304){
var script = document.createElement (“script”);
script.type = “text/javascript”;
script.text = xhr.responseText;
document.body.appendChild(script);
}
}
};
xhr.send(null);

posted @ 2016-06-15 09:55  Mr.Alex  阅读(284)  评论(0)    收藏  举报