v

一、JS阻塞

   所有的瀏覽器在下載JS文件的時(shí)候，會(huì)阻塞頁(yè)面上的其他活動(dòng)，包括其他資源的下載以及頁(yè)面內(nèi)容的呈現(xiàn)等等，只有當(dāng)JS下載、解析、執(zhí)行完，才會(huì)進(jìn)行后面的 操作。在現(xiàn)代的瀏覽器中CSS資源和圖片image資源是并行下載的，在IE6中默認(rèn)的并行的加載數(shù)目是2個(gè)，在IE6以后以及其他的瀏覽器中的默認(rèn)的并行加載數(shù)目是6個(gè)。

在瀏覽器從服務(wù)器接收到HTML文檔后，并把HTML在內(nèi)存中轉(zhuǎn)換為DOM樹(shù)，在轉(zhuǎn)換節(jié)點(diǎn)的過(guò)程中如果引入了CSS文件以及添加了images，則會(huì)在文檔加載的同時(shí)并行的加載CSS文件以及圖片。但是JS不一樣，因?yàn)闉g覽器需要1個(gè)穩(wěn)定的DOM樹(shù)結(jié)構(gòu)，而JS中很有可能有代碼直接改變了DOM樹(shù)結(jié)構(gòu)，比如使用document.write 或 appendChild,甚至是直接使用的location.href進(jìn)行跳轉(zhuǎn)，瀏覽器為了防止出現(xiàn)JS修改DOM樹(shù)，需要重新構(gòu)建DOM樹(shù)的情況，所以就會(huì)阻塞其他的下載和呈現(xiàn).在沒(méi)有使用異步加載（async）或者是延遲加載(defer)的情況下,只有在一個(gè)JS文件加載解析完后才能加載后面的JS文件。利用延遲腳本和異步腳本可以實(shí)現(xiàn)腳本的并行加載。以下討論都是在沒(méi)有這兩個(gè)屬性的情況下。

  （1）內(nèi)嵌腳本的阻塞

     直接寫在HTML文檔中的js代碼就是內(nèi)嵌JS，內(nèi)嵌腳本無(wú)需加載，可以直接執(zhí)行，所以當(dāng)頁(yè)面有內(nèi)嵌的腳本時(shí)，可以直接執(zhí)行，導(dǎo)致會(huì)阻塞所有資源的加載和頁(yè)面的呈現(xiàn)。

seo優(yōu)化培訓(xùn),網(wǎng)絡(luò)推廣培訓(xùn),網(wǎng)絡(luò)營(yíng)銷培訓(xùn),SEM培訓(xùn),網(wǎng)絡(luò)優(yōu)化,在線營(yíng)銷培訓(xùn)

<!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>內(nèi)嵌JS會(huì)阻塞頁(yè)面上的所有內(nèi)容的呈現(xiàn)</title></head><body><div><ul>
    <li>blogjavaspan style="color: #800000;"</li>
  &