在頁面中 js的執行和css的執行其實是兩條執行緒
我們只知道 最終的rendertree是由（domtree + cssomtree + js ）的作用下 來生成的
但是js 的執行最終要依賴 domtree + cssomtree的生成結果， 這樣就導致了 css的執行 阻塞了js的執行，因此， 我們把css 的執行優化做好是提公升頁面速度的比較重要的環節
在頁面發生變化的時候 可能會發生三個變化
一，回流 ，觸發回流的case：
1， 頁面布局發生變化
2， 頁面的幾何屬性發生變化
二，重繪 ，觸發重繪的case：
1， 頁面元素的屬性發生了變化的時候繪觸發重繪
三，圖層重合 ： 瀏覽器的頁面 其實是由乙個個的圖層重疊繪製 而成的， 我們在優化的時候 ，如果有必要的情況下，那麼就把某個重繪頻繁的元素單獨生成乙個圖層， 比如video， canvas 這些元素 就單獨乙個圖層，重繪頻繁不會影響到其他的元素， 建立圖層的方法可以加上啟用 gpu的屬性就可以開啟乙個圖層 ，比如 transform，willchange：transform
回流 一定會重繪 ， 重繪 卻不一定會引起回流
基於此，優化的理念就是變回流為重繪，節省操作
優化點就是：
1， 使用teanslate 代替top 改變
2， 使用opacity 代替visibility 改變
3，不要一條一條的修改dom的樣式，預先設定好class ，修改dom的classname
4， 把dom離線以後作修改： dom 設為displaynone 比如100次修改完再顯示
5， 不要把dom的屬性值放到迴圈變數裡去
6，不要使用table布局，table布局會引起回流，盡量使用div
7，動畫實現速度的選擇
8， 對於動畫新建乙個圖層
9， 啟用gpu 硬體加速
以上的話 還是基於實際的case 去做具體的選擇，畢竟滿足滿足需求時第一位的
效能優化 頁面渲染 重繪 回流
參考 高效能web開發 深入理解頁面呈現 重繪 回流 因為一些原因要重新構建渲染數的時候，就叫做回流,第一次構建的時候也叫做回流。引起回流的操作 回流一定會導致重繪 影響元素幾何屬性發生變化 重繪 瀏覽器會使渲染樹中受到影響的部分失效，並重新構造這部分渲染樹，完成回流後，瀏覽器會重新繪製受影響的部分...
css 頁面重繪和回流 重排 以及優化
1.瀏覽器把獲取到的html 解析成1個dom樹，html中的每個tag都是dom樹中的1個節點，根節點就是我們常用的document物件。dom樹里包含了所有html標籤，包括display none隱藏，還有用js動態新增的元素等。2.瀏覽器把所有樣式 使用者定義的css和使用者 解析成樣式結構...
css 頁面重繪和回流 重排 以及優化
一 html頁面的呈現流程 1.瀏覽器把獲取到的html 解析成1個dom樹，html中的每個tag都是dom樹中的1個節點，根節點就是我們常用的document物件。dom樹里包含了所有html標籤，包括display none隱藏，還有用js動態新增的元素等。2.瀏覽器把所有樣式 使用者定義的c...