瀏覽器接收到 html 檔案並轉換為 dom 樹
當我們開啟乙個網頁時，瀏覽器都會去請求對應的html檔案。雖然平時我們寫**時都會分為js、css、html檔案，也就是字串，但是計算機硬體是不理解這些字串的，所以在網路中傳輸的內容其實都是0和1這些位元組資料。當瀏覽器接收到這些位元組資料以後，它會將這些位元組資料轉換為字串，也就是我們寫的**。當資料轉換為字串以後，瀏覽器會先將這些字串通過詞法分析轉換為標記（token），這一過程在詞法分析中叫做標記化（tokenization）那麼什麼是標記呢？這其實屬於編譯原理這一塊的內容了。簡單來說，標記還是字串，是構成**的最小單位。這一過程會將**分拆成一塊塊，並給這些內容打上標記，便於理解這些最小單位的**是什麼意思當結束標記化後，這些標記會緊接著轉換為 node，最後這些node會根據不同node之前的聯絡構建為一顆dom樹以上就是瀏覽器從網路中接收到html檔案然後一系列的轉換過程將 css 檔案轉換為 cssom 樹
其實轉換css到cssom樹的過程和上一小節的過程是極其類似的對於第一種設定樣式的方式來說，瀏覽器只需要找到頁面中所有的span標籤然後設定顏色，但是對於第二種設定樣式的方式來說，瀏覽器首先需要找到所有的span標籤，然後找到span標籤上的a標籤，最後再去找到div標籤，然後給符合這種條件的span標籤設定顏色，這樣的遞迴過程就很複雜。所以我們應該盡可能的避免寫過於具體的css選擇器，然後對於html來說也盡量少的新增無意義標籤，保證層級扁平生成渲染樹
當我們生成dom樹和cssom樹以後，就需要將這兩棵樹組合為渲染樹瀏覽器渲染過程
瀏覽器的渲染過程 第一步 html經過html parser p s 解析為dom tree 第二步 css根據css規則經過css解析器解析為style rules cssom tree 第三步 兩棵樹經過attachment結合為 render tree 形成一棵大樹,此時它還是一棵迷茫的樹，不...
瀏覽器渲染過程
1.頁面準備 2.重定向 在header定義了重定向才會有這個過程，如果沒有就不會產生這個過程 關於重定向的分析 4.dns解析 把網域名稱解析成ip，如果直接用ip位址訪問，不會產生這個過程 5.tcp連線 6.request header 請求頭資訊 7.request body 請求體資訊，比...
瀏覽器渲染過程
這個過程可以大致分為兩個部分 網路通訊和頁面渲染。輸入url按下回車之後，瀏覽器會去瀏覽器快取中尋找該url的ip 沒有的話去系統快取中找，還是沒有的話去路由器快取中尋找 再沒有就去系統host檔案中找，還是沒有最後只能去請求dns伺服器，然後dns給乙個ip給瀏覽器 瀏覽器根據這個ip位址，向伺服...