這2個概念表面上和**無關，和瀏覽器如何工作有關。但是，了解這2個概念，並且注意一下在寫**的時候如何減少重排，可以優化瀏覽器的效能，提高速度
1.重繪是元素屬性發生改變，比如顏色，背景改變等，重新繪製元素（repaint）
重排是重排是更明顯的一種改變，可以理解為渲染樹需要重新計算。具體重排是什麼可以看下面重排的原因部分。
2.瀏覽器重排和重繪都會影響瀏覽器的效能，特別是重排
3.引起重排的原因：
① dom樹的變化 體現為增加或者刪除元素
②看到的檢視發生變化，包括元素的位置改變，大小改變（寬高，內外邊距，邊框），增加或者減少內容，視窗尺寸改變
③獲取某些屬性：
這些屬性包 括：offsettop、offsetleft、 offsetwidth、offsetheight、scrolltop、scrollleft、scrollwidth、scrollheight、 clienttop、clientleft、clientwidth、clientheight、getcomputedstyle() (currentstyle in ie)。所以，多次使用這些值時應進行快取。
4.具體如何在**中減少重排的幾個點：
①js裡面修改和增加樣式，由原來訪問style屬性乙個個修改，改為css寫乙個類，js新增上去
②在記憶體中多次操作節點，再新增到記憶體中。例如非同步獲取**裡面的資料，渲染到頁面的時候。可以先獲取資料，在記憶體中構件整個**的html片段，再一次性新增到文件中，而不是迴圈新增每一行
③將需要多次重排的元素，position改為absolute或者fixed，使他脫離文件流，不會影響到其他元素。例如有動畫效果的元素就最好設定為絕對定位
④由於display為none的元素不在渲染樹中，對隱藏的元素操作不會引發其他元素的重排。如果要對乙個元素進行複雜的操作，可以先隱藏他（還在文件流中），操作完成後再顯示。這樣在隱藏和顯示的時候觸發2次重排
⑤在需要經常獲取引起瀏覽器重排的屬性時，要快取到變數。
另外，幾個要知道的東西：
重繪不一定有重排，但是重排一定有重繪
瀏覽器的流布局，對渲染樹的計算通常只需要遍歷一次就可以完成。但table及其內部元素除外，它可能需要多次 計算才能確定好其在渲染樹中節點的屬性，通常要花3倍於同等元素的時間
頁面渲染過程：
1.解析html**並生成乙個 dom 樹。
2.解析css檔案，順序為：瀏覽器預設樣式->自定義樣式->頁面內的樣式。
3.生成乙個渲染樹（根據dom元素的幾何屬性構建）。這個渲染樹和dom樹的不同之處在於，它是受樣式影響的。它不包括那些不可見的節點。
4.當渲染樹生成之後，瀏覽器就會在螢幕上「畫」出所有渲染樹中的節點。
---------當渲染樹構建完成後，瀏覽器就可以將元素放置到正確的位置了，再 根據渲染樹節點的樣式屬性繪製出頁面
以上為暫時性的理解。**部分還有的沒有實現過。以後有了更深的理解再補充。
瀏覽器重排與重繪
前幾天內推某街，被問到了醬紫乙個問題，了解瀏覽器的重繪與重排嗎？瞬間蒙住了，的確好像沒有怎麼聽說過。於是今天抽了點時間研究了下重排和重繪，這裡分享給大家。瀏覽器在頁面渲染過程中非常重要的兩個概念，即重排和重繪。了解這兩個概念對於你在今後寫 過程中，尤其是對效能要求比較高的話，有非常大的幫助。來看看這...
瀏覽器重繪和重排
我的部落格地圖 前端開發崗位是乙個知識範圍比較綜合的乙個崗位，需要了解和 的知識很多，因此，可以從廣度和深度兩個方面著手，初級工程師以廣度學習為主，高階工程師以深度研究為主。重排發生的情景 頁面渲染初始化 瀏覽器視窗改變 dom元素幾何屬性 width，height 變化 可見dom元素的增刪 do...
瀏覽器重排和重繪機制淺解
面試 公司的時候，遇到了 簡要描述瀏覽器回流和重繪的區別及對效能的影響，如何盡量避免對頁面效能的影響 的筆試題。由於我面試之前根本沒做任何準備，所以只是單純的寫了一下我的簡單理解 頁面回流是由於元素寬高 層級位置發生變化而引起的重新布局。頁面重繪是由於頁面元素背景顏色等不影響布局的樣式發生變化所引起...