解析白屏
- 瀏覽器從服務(wù)器獲取到Html數(shù)據(jù)后溃斋,會(huì)創(chuàng)建新的渲染進(jìn)程。
- 此時(shí)渲染進(jìn)程會(huì)產(chǎn)生一個(gè)空白頁(yè)面详炬,稱為解析白屏盐类。
- 在此階段,會(huì)加載外部JS呛谜、加載外部CSS在跳、解析生成DOM樹、生成樣式規(guī)則隐岛、執(zhí)行JS猫妙、生成布局樹、繪制頁(yè)面等等聚凹。
- 而其中影響性能的主要因素在于加載外部CSS和JS割坠、執(zhí)行JS。
優(yōu)化方案
- 對(duì)于小的外部文件可改為內(nèi)嵌式妒牙,取消文件下載彼哼。
- 對(duì)外部文件進(jìn)行壓縮、清除注釋等湘今,減小文件大小敢朱。
- 在解析階段可不執(zhí)行的JS文件,采用異步加載,減輕阻塞拴签。
- 對(duì)于大的CSS文件孝常,采用媒體查詢,拆分為不同用途的樣式蚓哩。在特定場(chǎng)景下构灸,加載特定CSS文件。