在網(wǎng)頁呈現(xiàn)過程中,DOM樹將根據(jù)HTML元素生成,然后綁定到特定的CSS樣式。這意味著頁面上的DOM元素越多,渲染時間將消耗越多。因此,應該盡可能減少DOM元素的數(shù)量。
然而,很難確定頁面有多少DOM元素。下面的代碼允許您查看頁面中所有元素的數(shù)量
看看下面的谷歌主頁,頁面看起來很簡單,但里面有300多個元素
瀏覽器在加載內(nèi)容時遵循以下原則:將根據(jù)域名劃分下載內(nèi)容。相同域名下的內(nèi)容可以并行下載,但并行下載連接的數(shù)量將受到限制。
應該注意的是,在同一個網(wǎng)頁下請求的域名不應該太多,因為這將導致DNS查詢問題。
1常見的方法是在頁面上加載廣告。如果使用框架,則可以在不阻塞主頁的情況下與頁面并行加載
2瀏覽器將沙盒iframe以確保內(nèi)容安全
以下方法可用于解決阻止主頁上的onload事件的問題
如前一點所述,頁面對相同域名下的資源連接數(shù)量有限制,而iframe和主頁共享相同的下載連接池。這樣,iframe將競爭主頁的連接請求,導致主頁的加載速度較慢。
雖然使用iframe也是有益的,但是我們應該盡***努力減少iframe的使用。我們可以用div代替
在網(wǎng)絡(luò)中,每個HTTP請求的性能消耗都很昂貴。如果發(fā)送HTTP請求,返回為404,則會浪費大量資源。
避免404主要是針對網(wǎng)站開發(fā)者。網(wǎng)站開發(fā)人員在上線前應該進行測試,以避免所有可能出現(xiàn)的404情況。
今天我們總結(jié)了優(yōu)化web性能的幾種措施。你明白嗎?
下面是對前一篇文章的總結(jié),感興趣的可以看一下
經(jīng)典訪談問題web前端性能優(yōu)化方法(1)
web前端性能優(yōu)化方法的延遲加載