Even Faster Web Sites: 读书笔记(二)
这次因为一个项目的原因,又重读了《Even Faster Web Sites》书里的第四章:Loading scripts without blocking,并且在Cuzillion里做了大量测试,又发现了很多有意思的细节。发现自己读书太糙,自责一下。结合实际工作,加上自己的理解,再把这一章的实用内容总结一下。
要解决的问题
页面的script标签引入外部js文件时,会阻塞后续外部资源的下载和加载,包括图片、CSS文件、iframe等等。
1. Script DOM Element比较常用
“Script DOM Element”方法是常见的方法,也就是createElement(“script”)的方法下载js文件,以此并行加载后续资源。这其实是很棒的一个方法,因为不需要担心跨域,而且我们在中文应用中,不用担心编码的问题(可以为<script>指定编码)。但这里需要注意的是,非IE浏览器下,这种方法会阻止window.onload事件,因此如果你的js文件很大,可能会带来用户体验不好。IE浏览器对这种贴script标签的行为是“无动于衷”的,不会在状态栏、光标和进度圈上做任何指示。看来IE也不是一无是处嘛,哈哈!测试地址。
2. 个人不提倡使用XHR Eval
XHR Eval方法我不提倡使用,首先是中文编码上会遇到麻烦,其次跨域问题。另外就是下面这句: