加载页面时如何提升性能

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

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

减少引入脚本数量

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

使用无阻塞脚本

load事件之后在下载脚本

延迟脚本

使用defer属性 <script src='test.js' defer></script>

在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  阅读(270)  评论(0编辑  收藏  举报