摘要：屏幕的變化就被稱為或者是。而瀏覽器的目標(biāo)之一就是減少以及的負(fù)面影響，其中的一個(gè)策略就是干脆不做，又或者說至少不是現(xiàn)在做。但有時(shí)腳本語句會(huì)破化瀏覽器優(yōu)化，并使其刷新隊(duì)列以及執(zhí)行所有批處理的改變。

**首先說翻譯這篇文章的目的其實(shí)是，之前回答的關(guān)于瀏覽器js渲染的問題被打臉了 ?_? ，
不得不正視自己半路出家學(xué)前端的事實(shí)，所以這篇文章就算是自己的一個(gè)筆記吧，學(xué)而時(shí)習(xí)之，不亦樂乎，翻譯錯(cuò)了，還請批評指正**

原文鏈接：Rendering: repaint, reflow/relayout, restyle

正文：

今天我們來談?wù)勥@個(gè)從page2.0（譯者注：page2.0不怎么常見，應(yīng)該是作者自創(chuàng)的，介紹鏈接在文章結(jié)尾）生命周期的詞：渲染，有時(shí)候它甚至發(fā)生在瀑布流當(dāng)中。
那么，瀏覽器是如何靠著一大塊html,css,javascript代碼在屏幕上顯示你的頁面的呢？

不同的瀏覽器有不同的實(shí)現(xiàn)方式，但是下邊的圖會(huì)展示一個(gè)當(dāng)代碼被下載到電腦里之后所有瀏覽器的共同實(shí)現(xiàn)（或多或少都有）

瀏覽器把我們的html源代碼解析并且初始化成一個(gè)dom樹，dom樹是一個(gè)數(shù)據(jù)結(jié)構(gòu)，它的特點(diǎn)包括，每個(gè)html標(biāo)簽都在這個(gè)樹上有一個(gè)對應(yīng)的節(jié)點(diǎn)，當(dāng)然標(biāo)簽當(dāng)中的文本塊也在dom樹上有一個(gè)相應(yīng)的文本節(jié)點(diǎn)，這個(gè)dom樹的根節(jié)點(diǎn)就是documentElement（也就是標(biāo)簽）

瀏覽器解析css代碼，針對一些像-webkit、-moz以及一些不認(rèn)識(shí)的寫法做忽略，css的優(yōu)先級(jí)是這樣的：最基本的瀏覽器默認(rèn)樣式，然后就是來自外部引入的用戶腳本，最高級(jí)的是在頁面里邊寫在