隨筆檔案

時(shí)代在進(jìn)步，瀏覽器也在進(jìn)步，做WPO（性能優(yōu)化）工作得跟得上形勢(shì)。

《高 性能網(wǎng)站建設(shè) High Performance Web Sites》英文版2007年推出，直到今天，都被奉為經(jīng)典。書(shū)寫(xiě)得很好，但這本書(shū)畢竟是2007年，當(dāng)時(shí)還在IE4一統(tǒng)天下的時(shí)代，一些書(shū)中的內(nèi)容已經(jīng) 不符合現(xiàn)在的瀏覽器進(jìn)化情況。舉個(gè)例子：今天的瀏覽器緩存已經(jīng)大大增加；瀏覽器并行下載數(shù)已經(jīng)從原來(lái)的2個(gè)提升到4個(gè)、8個(gè)甚至16個(gè)；IIS7.0已經(jīng) 考慮到Etags的消極作用，不需再設(shè)置。

比較大的一個(gè)變化，我認(rèn)為是JS腳本阻塞的情況發(fā)生了變化。Steve也留意到這一點(diǎn)，在他2010年初的博客中，也提到了新瀏覽器下對(duì)JS阻塞已經(jīng)做出了一些努力。下面的瀑布圖是2007年大多數(shù)瀏覽器的加載JS組件的情況：

上圖加載了6個(gè)文件：

• 1.  html文檔
• 2. js腳本，下載2秒，執(zhí)行2秒（下載和執(zhí)行都發(fā)生了阻塞情況）
• 3. js腳本，下載2秒，執(zhí)行2秒（下載和執(zhí)行都發(fā)生了阻塞情況）
• 4. 圖片文件（三個(gè)組件并行下載）
• 5. css腳本（三個(gè)組件并行下載）
• 4. iframe（三個(gè)組件并行下載）

上述老瀏覽器的情況，js腳本無(wú)論在下載還是執(zhí)行時(shí)，都發(fā)生了阻塞。

那么我們看看新瀏覽器（以ie8為例）情況下，情況有沒(méi)有改善呢？

可以看出，兩個(gè)js腳本和一個(gè)css樣式表文件并行下載了，但js腳本執(zhí)行時(shí)，還是發(fā)生了阻塞。js腳本執(zhí)行的阻塞，似乎是無(wú)法避免的，因?yàn)閖s腳本經(jīng)常會(huì)生成或修改HTML組件，必須等js執(zhí)行完后，頁(yè)面才能正常生成。

雖 然js腳本執(zhí)行阻塞還在發(fā)生，但js腳本下載阻塞似乎已經(jīng)解決了。事實(shí)的確如此，IE8下，可以和JS腳本并行下載的包括JS腳本、CSS樣式表，但不包 括圖片。在firefox 3.6版本以上，chrome 4.0以上的版本，可以和JS腳本并行下載的包括JS腳本、CSS樣式表、圖片。下面表描述了瀏覽器對(duì)JS腳本并行下載兼容情況：

瀏覽器在不斷進(jìn)步，很多以前奉為金科玉律的WPO原則，可能會(huì)輕松的整合在瀏覽器中。前段優(yōu)化的很多傳統(tǒng)工作，會(huì)變得越來(lái)越輕松。不過(guò)隨著互聯(lián)網(wǎng)媒體樣式的演進(jìn)以及移動(dòng)互聯(lián)網(wǎng)的重要性增加，WPO工作頁(yè)面面臨新挑戰(zhàn)。

剛解放那陣兒，有句順口溜“三天不學(xué)習(xí)，趕不上劉少奇”。 借用一下，: )  三天不學(xué)習(xí)，趕不上瀏覽器。