Facebook的網(wǎng)站速度做為最關(guān)鍵的公司任務(wù)之一。在2009年,我們成功地實(shí)現(xiàn)了Facebook網(wǎng)站速度提升兩倍 。而正是我們的工程師團(tuán)隊(duì)的幾個(gè)關(guān)鍵的創(chuàng)新使它成為可能。在本文中,我將向大家介紹我們的秘密武器之一,我們稱(chēng)之為BigPipe的偉大底層技術(shù)。
BigPipe是一個(gè)重新設(shè)計(jì)的基礎(chǔ)動(dòng)態(tài)網(wǎng)頁(yè)服務(wù)體系。大體思路是,分解網(wǎng)頁(yè)成叫做Pagelets的小塊,然后通過(guò)Web服務(wù)器和瀏覽器建立管道并管理他們?cè)诓煌A段的運(yùn)行。這是類(lèi)似于大多數(shù)現(xiàn)代微處理器的流水線執(zhí)行過(guò)程:多重指令管線通過(guò)不同的處理器執(zhí)行單元,以達(dá)到性能的最佳。雖然BigPipe是對(duì)現(xiàn)有的服務(wù)網(wǎng)絡(luò)基礎(chǔ)過(guò)程的重新設(shè)計(jì),但它卻不需要改變現(xiàn)有的網(wǎng)絡(luò)瀏覽器或服務(wù)器,它完全使用PHP和JavaScript來(lái)實(shí)現(xiàn)。
動(dòng)機(jī)
為了更好的了解BigPipe,我們需要了解一下現(xiàn)有的動(dòng)態(tài)Web服務(wù)系統(tǒng),它的歷史可以追溯到萬(wàn)維網(wǎng)的初期,但現(xiàn)在與初期相比卻并沒(méi)有多少改變,F(xiàn)代網(wǎng)站有著遠(yuǎn)遠(yuǎn)高于10年前的動(dòng)態(tài)效果和互動(dòng)性,但傳統(tǒng)的網(wǎng)頁(yè)服務(wù)系統(tǒng)早已無(wú)法跟上當(dāng)今互聯(lián)網(wǎng)速度的要求。在傳統(tǒng)的模式,用戶(hù)請(qǐng)求的生命周期如下:
- 瀏覽器發(fā)送一個(gè)HTTP請(qǐng)求到Web服務(wù)器。
- Web服務(wù)器解析請(qǐng)求,然后讀取數(shù)據(jù)存儲(chǔ)層,制定一個(gè)HTML文件,并用一個(gè)HTTP響應(yīng)把它發(fā)送到客戶(hù)端。
- HTTP響應(yīng)通過(guò)互聯(lián)網(wǎng)傳送到瀏覽器。
- 瀏覽器解析Web服務(wù)器的響應(yīng),使用HTML文件構(gòu)建了一個(gè)的DOM樹(shù),并且下載引用的CSS和JavaScript文件。
- CSS資源下載后,瀏覽器解析它們,并將它們應(yīng)用到DOM樹(shù)。
- JavaScript資源下載后,瀏覽器解析并執(zhí)行它們。
傳統(tǒng)模式在現(xiàn)代網(wǎng)站中效率是非常低下的,因?yàn)楹芏嘞到y(tǒng)的操作順序,不能互相重疊。一些如延時(shí)加載JavaScript、并行下載等優(yōu)化技術(shù)已被網(wǎng)絡(luò)社區(qū)廣泛采用,以此來(lái)克服的一些限制。然而,這些優(yōu)化卻很少涉及Web服務(wù)器和瀏覽器的執(zhí)行順序造成的瓶頸。當(dāng)Web服務(wù)器正忙生成一個(gè)頁(yè)面,瀏覽器處于閑置狀態(tài),浪費(fèi)其周期無(wú)所事事。當(dāng)Web服務(wù)器完成生成頁(yè)面,并將其發(fā)送到瀏覽器,瀏覽器則成為性能瓶頸并且Web服務(wù)器對(duì)其無(wú)從幫助。重疊Web服務(wù)器的生成時(shí)間與瀏覽器的渲染時(shí)間,我們不僅可以減少最終的時(shí)間延遲,也能使網(wǎng)頁(yè)更早顯示用戶(hù)可見(jiàn)區(qū)域給用戶(hù),從而大大減少用戶(hù)對(duì)延遲的感知。
Web服務(wù)器的產(chǎn)生時(shí)間和瀏覽器的渲染時(shí)間重疊,是特別有用的,如Facebook這樣內(nèi)容豐富的網(wǎng)站。一個(gè)典型的Facebook的網(wǎng)頁(yè)包含許多來(lái)源不同的數(shù)據(jù)資料:好友名單,好友動(dòng)態(tài),廣告等。在傳統(tǒng)的網(wǎng)頁(yè)呈現(xiàn)模式的用戶(hù)將不得不等到這些查詢(xún)數(shù)據(jù)都返回并生成最終文件,然后將其發(fā)送到用戶(hù)的電腦。任何一個(gè)查詢(xún)延遲都將拖慢整個(gè)最終文件的生成。
BigPipe如何工作
要利用該Web服務(wù)器和瀏覽器之間的并行性,BigPipe首先分解網(wǎng)頁(yè)成多個(gè)可調(diào)用的Pagelets。正如流水線微處理器劃分一個(gè)指令的生命周期為(如“取指令”,“指令解碼”,“執(zhí)行”,“寫(xiě)回寄存器”等)多個(gè)階段,BigPipe的頁(yè)面生成過(guò)程分為以下幾個(gè)階段:
- 請(qǐng)求解析:Web服務(wù)器解析和完整性檢查的HTTP請(qǐng)求。
- 數(shù)據(jù)獲。篧eb服務(wù)器從存儲(chǔ)層獲取數(shù)據(jù)。
- 標(biāo)記生成:Web服務(wù)器生成的響應(yīng)的HTML標(biāo)記。
- 網(wǎng)絡(luò)傳輸:響應(yīng)從Web服務(wù)器傳送到瀏覽器。
- CSS的下載:瀏覽器下載網(wǎng)頁(yè)的CSS的要求。
- DOM樹(shù)結(jié)構(gòu)和CSS樣式:瀏覽器構(gòu)造的DOM文檔樹(shù),然后應(yīng)用它的CSS規(guī)則。
- JavaScript中下載:瀏覽器下載網(wǎng)頁(yè)中JavaScript引用的資源。
- JavaScript執(zhí)行:瀏覽器的網(wǎng)頁(yè)執(zhí)行JavaScript代碼。
出處:isd
責(zé)任編輯:bluehearts
上一頁(yè) 下一頁(yè) BigPipe:高性能的"流水線技術(shù)"網(wǎng)頁(yè) [2]
◎進(jìn)入論壇網(wǎng)頁(yè)制作、WEB標(biāo)準(zhǔn)化版塊參加討論,我還想發(fā)表評(píng)論。
|