渲染器在建立完成並新增到渲染樹時，並不包含位置和大小資訊。計算這些值的過程稱為布局或重排。
html採用基於文件流的布局模型，按先後順序進行解析。處於流中靠後位置元素通常不會影響靠前位置元素的幾何特徵，因此布局可以按從左至右、從上至下的順序遍歷文件。除絕對定位、固定定位和浮動元素之外，任何元素將預設為流布局模式。
座標系是相對於根框架（頂層框架）而建立的，使用的是上座標和左座標。
布局是乙個遞迴的過程。它從根呈現器（）開始，然後遞迴遍歷部分或所有的框架層次結構，為每乙個需要計算的渲染器計算幾何資訊。
根渲染器的位置左邊是0，0，其尺寸為視口（瀏覽器視窗的可見區域）。
所有的渲染器都有乙個layout或reflow方法，每乙個渲染器都會呼叫其需要進行布局的子代的layout方法。
為避免對所有細小更改都進行整體布局，瀏覽器採用了一種「dirty位」系統。如果某個渲染器發生了更改，或者將自身及其子代標註為「dirty」，則需要進行布局。
標記分為：「dirty」和「children are dirty」。「children are dirty」表示儘管呈現器自身沒有變化，但它至少有乙個子代需要布局。
【參考資料】
1 瀏覽器的工作原理
瀏覽器渲染原理
最近在開發b s 框架的專案。開發都是web頁面，也就是執行在瀏覽器上的使用者操作頁面。瀏覽器是使用者得到服務最直接的地方，後台做的好，前台也要讓使用者用著方便。這裡就研究一下瀏覽器的一些原理是如何提高使用者體驗的。首先，這裡有乙個新詞，渲染。什麼是網頁渲染呢？網頁渲染就是html 根據css定義的...
瀏覽器渲染原理
瀏覽器中輸入url到頁面返回的全過程 根據網域名稱，進行dns網域名稱解析 拿到解析的ip位址，建立tcp連線 向ip位址傳送http請求 伺服器處理請求 返回響應結果 關閉tcp連線 瀏覽器解析html 瀏覽器布局渲染 通過url向伺服器傳送請求,web服務端返回html文字 字串 拿到 後，瀏覽...
瀏覽器渲染原理
1.http請求階段 2.http響應階段 3.瀏覽器渲染階段 瀏覽器渲染頁面的機制和原理 程序 process 乙個程式就是乙個程序 執行緒 thread 棧記憶體 stack 用來提供環境 客戶端 瀏覽器 瀏覽器核心 拿到 後，瀏覽器在記憶體條中開闢出一塊棧記憶體，用來給 的執行環境，同時分配乙...