教育行業(yè)A股IPO第一股(股票代碼 003032)

全國咨詢/投訴熱線:400-618-4000

什么是重繪和重排【前端與移動開發(fā)】

更新時間:2022年08月26日18時33分 來源:傳智教育 瀏覽次數(shù):

好口碑IT培訓(xùn)

重繪(repaint或redraw):

重繪是指一個元素外觀的改變所觸發(fā)的瀏覽器行為,瀏覽器會根據(jù)元素的新屬性重新繪制,使元素呈現(xiàn)新的外觀。重繪發(fā)生在元素的可見的外觀被改變,但并沒有影響到布局的時候。比如,僅修改DOM元素的字體顏色(只有Repaint,因為不需要調(diào)整布局)。


重排(重構(gòu)/回流/reflow):

當(dāng)渲染樹中的一部分(或全部)因為元素的規(guī)模尺寸,布局,隱藏等改變而需要重新構(gòu)建, 這就稱為回流(reflow)。每個頁面至少需要一次回流,就是在頁面第一次加載的時候。

觸發(fā)重排的條件:任何頁面布局和幾何屬性的改變都會觸發(fā)重排:

頁面渲染初始化(無法避免)

添加或刪除可見的DOM元素

元素位置的改變,或者使用動畫

元素尺寸的改變——大小,外邊距,邊框

瀏覽器窗口尺寸的變化


填充內(nèi)容的改變,比如文本的改變或圖片大小改變而引起的計算值寬度和高度的改變

總結(jié):重排必定會引發(fā)重繪,但重繪不一定會引發(fā)重排。

0 分享到:
和我們在線交談!