DOM操作
使用js操作DOM的代價(jià)是昂貴的，有一個(gè)貼切的比喻粗梭，DOM與ECMScript就像兩座小島写妥，而他們之間由一個(gè)收費(fèi)的橋梁連接鸳粉，ECMScript每次訪問(wèn)DOM都要“收費(fèi)”。
所以DOM操作的性能優(yōu)化有兩點(diǎn)技巧：
- 將運(yùn)算盡量放在ECMScript一端集畅，減少DOM操作
- 對(duì)DOM對(duì)象進(jìn)行緩存
重繪與重排
當(dāng)DOM中的元素幾何屬性發(fā)生變化時(shí)近弟，就會(huì)發(fā)生重排，重排一定會(huì)觸發(fā)重繪挺智；當(dāng)元素只是發(fā)生樣式變化時(shí)祷愉，只會(huì)觸發(fā)重繪。
重排的代價(jià)是非常昂貴的赦颇。
所以應(yīng)該盡量避免重排的發(fā)生：
- 對(duì)同一DOM元素的操作盡量寫(xiě)在一起二鳄，最小化重排的次數(shù)
- 不要在會(huì)引起重排的語(yǔ)句中穿插需要返回最新布局信息的語(yǔ)句，比如offsetTop媒怯、scrollTop订讼、clientTop、getComputedStyle等
- 使用fragment元素扇苞，批量操作DOM元素時(shí)使之脫離文檔流欺殿，操作完之后再一次性加入文檔
- 將需要多次觸發(fā)重排的元素的position設(shè)置為absolute或fixed，以避免觸發(fā)其他元素的重排
