而正在領(lǐng)取寶。眼前領(lǐng)取寶前者架設(shè)組的工友們,曾經(jīng)正在這一塊獲得了一些沒有錯的停頓(依據(jù)測預演講,進度是無比沒有錯的,能夠會正在恰當?shù)臅r分開源進去)。但咱們最相熟的老掉牙同窗 IE6 (或者以IE為核的那些殼)還是中國(以至社會上)市面上占用率最高的閱讀器,因而咱們需求一度折衷的計劃。
XHR Eval – 用 XHR 鍵入,并 eval() 施行 responseText.。前者功能優(yōu)化范圍。Steve 說那是 2008 – 2009 那個時期用的。而這 35 條最佳理論中,對于 Javascript 的加載次第的請求是:Put Scripts at the Bottom。這張圖形容了什么時分運用什么辦法:
二、計劃
兼容性可看下圖:
document.write Script Tag – 應用 document.write 把 <script src=""> 增添到 HTML 中。
Script Defer – 給 script 標增添 defer 屬性
Script DOM Element – 靜態(tài)創(chuàng)立一度 script 元素,把 src 指向劇本URL.
Script in Iframe – 把劇本放正在 HTML 中,運用 ifame 來鍵入它。(義務編者:帝位庫)
五、小結(jié)
正在運用的時分,再應用 Loader.use() 來實古代碼的靜態(tài)加載?,F(xiàn)正在大全體閱讀器都支撐 Script 的平行鍵入,除非老掉牙的 IE6&7、Firefox 2&3.0、 Safari 3、Chrome 1。第一度資料只需要靜態(tài)鍵入 Javascript 的代碼,第二個資料則蘊含一切其余頁面所需劇本的資料。
咱們有6種辦法能夠完成平行(NON-Blocking)鍵入:
一、綜合
正在開講事先,有一度必需處理的成績是:干什么咱們要把 JS 資料放正在 </body> 事先的最底部。某個 HTML 屬性的作用正是咱們需求的 NON-Blocking 鍵入技能。
創(chuàng)立兩個 JavaScript 資料。那里容易說一下。
。NCZ 引薦第一度資料只蘊含呼應的完成第二個資料靜態(tài)加載的代碼:
三、實古代碼
創(chuàng)立第二個 <script> 來施行鍵入第二個 Javascript 資料的因變量和其余的初始化代碼。千萬,那里沒有只僅是靜態(tài)加載,再有定然的緩存機制正在外面。
<script type="text/javascript" src="core.js"></script>
</script>
}
combo_path: '/path/to/the/compressed/file'
combo_host: "http://domain.com",
araleConfig = {
// 配置 combo 效勞的 PATH
<script type="text/javascript" charset="utf-8">
YUI3 的 Loader 運用了 NCZ 的那樣的辦法。
像 <script> 正在頁部(</body> 事先)引入第一度資料。固然眼前支撐的閱讀器并沒有多(仿佛只要 Firefox 3.6+ ?),但給需求平行鍵入的 Javascript(依照計劃看來,正常是第一度 JS 資料) 加上某個屬性,也沒有會反應其余沒有支撐的閱讀器,因為,是引薦運用的。而實在并沒有是一切閱讀器都沒有支撐。再有很多貨色能夠做。況且,隨著 HTML5 技能的涌現(xiàn)和 Javascript 技能的一直翻新,置信再有更多貨色是不值等待。
XHR Injection – 用 XHR 鍵入,正在頁面中靜態(tài)創(chuàng)立一度 script 元素,并將 responseText 作為其 text ?,F(xiàn)正在,加載 Javascript 曾經(jīng)有了反動性的化變。基本緣由是,它沒有能平行鍵入。咱們也運用了相似的辦法。
</script>
});
//初始化你的代碼
loadScript("http://your.cdn.com/second.js", function(){
<script type="text/javascript">
<script type="text/javascript" src="http://your.cdn.com/first.js"></script>
而后,咱們能夠正在頁面中那樣做:
}
document.getElementsByTagName("head")[0].appendChild(script);
script.src = url;
}
};
callback();
script.onload = function(){
} else { //Others
};
}
callback();
script.onreadystatechange = null;
script.readyState == "complete"){
if (script.readyState == "loaded"
script.onreadystatechange = function(){
if (script.readyState){ //IE
script.type = "text/javascript";
var script = document.createElement("script")
function loadScript(url, callback){
依據(jù)下面的談到的技能。提議你檢查有關(guān)的 combo 效勞的技能。由于依據(jù)HTTP/1.1 specification 看來,正在同一工夫加載兩個資料是最現(xiàn)實的,而 Javascript 劇本會障礙平行鍵入。但某個只對于 IE 無效。
從總體上看來,Script DOM Element 是比擬好的計劃。
置信很多與頁面打過交道的同窗都對于 Yahoo 的 Best Practices for Speeding Up Your Web Site 沒有生疏。前者們,加油吧,將來有很多貨色該當是由你來主導的。NCZ 的博客上提過,眼前最好的技能是:
關(guān)于終究該當運用哪種計劃。這徹底起源于你需求本身的需求。
四、理論
<script type="text/javascript" async src="foo.js"></script>
正在 HTML5 上,咱們能夠運用 async 屬性。