js加载速度慢怎么解决?
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js加载速度慢怎么解决?相关的知识,希望对你有一定的参考价值。
如题~~
解决办法:换一个js包含的方式,让javascript加载速度倍增。把通常加载方式:
<script src="xxxx.js"></script>
改变成:
<script type="text/javascript">
document.write("<scr"+"ipt src=\"xxx.js\"></sc"+"ript>")
</script>
-------------------------------------
举个例子:
比如下面是申请的站长统计代码,以前尽管是把它放在页面的最底部,但还是拖累页面加载进度。
<script src="http://s69.cnzz.com/stat.php?id=265381&web_id=265381&show=pic" language="JavaScript" charset="gb2312"></script>
我们可以把它换成这样的方式来加载(任然放在页面最底部):
<<script type="text/javascript">>
document.write("<<scr"+"ipt src=\"http://69.cnzz.com/stat.php?id=2651&web_id=2681&show=pic\" language=\"JavaScript\" charset=\"gb2312\"></sc"+"ript>>")
<</script>>
速度快多了。
其它的js如法炮制,广告的,页面特效的。。。
最后再废话几句:
用
<<script type="text/javascript">>
document.write("<<scr"+"ipt src=\"xxx.js\"></sc"+"ript>>")
<</script>>
的方式,还可实现按需按条件的来加载你要的JS文件:
<<script type="text/javascript">>
if ( 心情好 ) document.write("<<scr"+"ipt src=\"xxx.js\"></sc"+"ript>>")
<</script>>
这样要是“心情不好”,就自然不会载入你不想要的JS文件了。 参考技术A 一、JS文件位置调整
既然JS文件放在前面后延迟后面代码的加载,那么我们可以考虑将JS放在/body前或更厚,这样就可以让script前的html完美的呈现,不会让用户看到空白页面,提高了体验度。
二、合并JS文件
尽管在将JS文件位置后移后可以让其他代码优先加载,但在执行JS文件的时候任然比较耗费时间,如果JS文件比较多,就需要进行多次“Get”请求,延长加载速度。那么我们自然就是要减少Get请求。通常有两种方案:
第一:合并js文件,比如将1.js、2.js和3.js合并掉。
第二:利用第三方工具,比如php中的Minify。
关于合并JS,是用得比较多的,绝大部分网站都是外部调用JS,而现在把调用的JS合并到一起也是很常见的。
三、最后执行JS文件
不管是把JS文件放在脚尾,还是合并JS文件,都是治标不治本,也就是无限的去缩短JS执行时间,并且避免JS执行与代码加载互相冲突,但是这样只是让html代码文件尽管加载,还是不能很好的避免JS执行与代码加载互阻,当web页面越来越复杂,JS文件越来越多,这个阻碍就会越来越大。
所以最好的办法就是让JS文件最后加载,也就是页面全部呈现完再追加JS脚本,当window.onload事件触发完后,我们才开始加载 JS,这样完全不会让用户去等待网站的主题内容加载,目前有很多大型网站就是利用的这个。这一点需要与技术人员协作完成或自己动手在网上找代码,不过个人建议还是教给会的人完成,自己可以先学,以免出现失误,得不偿失。
解决JS加载速度慢
在网页中的js文件引用会很多,js引用通常为
<script src="xxxx.js"></script>
通过如下方法可以增加js加载速度
<<script type="text/javascript">>
document.write("<<scr"+"ipt src=\"xxxx.js\" language=\"JavaScript\" charset=\"gb2312\"></sc"+"ript>>")
<</script>>
注意:上述写法,还需要写在页面底部
以上是关于js加载速度慢怎么解决?的主要内容,如果未能解决你的问题,请参考以下文章