減少重繪和回流
1剃幌、想要改變?cè)貥邮角∠欤ㄟ^(guò)改變?cè)氐腸lass名(盡可能在 DOM 樹(shù)的最末端改變class)
2、避免設(shè)置多項(xiàng)內(nèi)聯(lián)樣式芙扎,因?yàn)槊總€(gè)都會(huì)造成回流星岗,樣式應(yīng)該合并在一個(gè)外部類,這樣當(dāng)該元素的class屬性可被操控時(shí)僅會(huì)產(chǎn)生一個(gè)reflow戒洼。
3俏橘、在操作offset****、scroll***圈浇、client***寥掐、width/height等屬性時(shí),先用變量先進(jìn)行存儲(chǔ)汉额,在進(jìn)行操作曹仗。
重繪
重繪:對(duì)元素的背景顏色,字體樣式樣式進(jìn)行設(shè)置蠕搜,如:font-weight怎茫、
color、background-color.回流一定是重繪妓灌,重繪不一定是回流
回流
回流:因?yàn)樵氐某叽绻旄颍季郑[藏等改變而需要重新對(duì)其進(jìn)行構(gòu)建的操作(重構(gòu)頁(yè)面)虫埂。
包括:
1祥山、對(duì)font-size,margin,padding 等可以改變寬高和布局的style屬性(尺寸、內(nèi)容掉伏、距離)的改變缝呕。
2、添加斧散、刪除(可見(jiàn)元素)的dom操作供常。
3、用戶操作 改變?yōu)g覽器窗口大小或是字體等
4鸡捐、對(duì)offset**** 栈暇、scroll***、client***箍镜、width/height的改變(***=Top/Left/Width/Height)