摘要:一什么是回流回流是會(huì)導(dǎo)致頁(yè)面重新渲染的一些元素,從而影響性能。
一、什么是回流?
回流是會(huì)導(dǎo)致頁(yè)面重新渲染的一些元素,從而影響性能。
二、哪些因素會(huì)導(dǎo)致回流?
1、調(diào)整窗口的大小;
2、改變字體,如果用rem 設(shè)置了根目錄的字體大小,這樣就減少了回流的次數(shù);
3、增加或者移除樣式表;
4、內(nèi)容的變化,用戶(hù)在input中輸入了文字(這是不可避免的);
5、激活CSS的偽類(lèi);
6、操作class屬性;
7、基本操作DOM(包括js中的domcument等);
8、計(jì)算offsetWidth與offsetHeight 屬性,獲取元素在窗口中的位置;
9、在html代碼中直接設(shè)置style 屬性的值,這個(gè)降低了代碼的利用率,還影響性能。
三、如何避免回流?
1、如果想設(shè)定元素的樣式,直接改變class名,而不是改變class中的某個(gè)特定的屬性,比如height,weight;
2、避免設(shè)置多項(xiàng)內(nèi)聯(lián)樣式,就是說(shuō)少使用style;
3、應(yīng)用元素動(dòng)畫(huà)的時(shí)候,使用屬性的position屬性的fixed值或absolute值;
4、避免使用table布局;
5、盡量在DOM樹(shù)的最末端改變class,改變子節(jié)點(diǎn)的樣式。
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://specialneedsforspecialkids.com/yun/101905.html
摘要:一什么是回流回流是會(huì)導(dǎo)致頁(yè)面重新渲染的一些元素,從而影響性能。 一、什么是回流? 回流是會(huì)導(dǎo)致頁(yè)面重新渲染的一些元素,從而影響性能。 二、哪些因素會(huì)導(dǎo)致回流? 1、調(diào)整窗口的大小; 2、改變字體,如果用rem 設(shè)置了根目錄的字體大小,這樣就減少了回流的次數(shù); 3、增加或者移除樣式表; 4、內(nèi)容的變化,用戶(hù)在input中輸入了文字(這是不可避免的); 5、激活CSS的偽類(lèi); 6、操作c...
摘要:一什么是回流回流是會(huì)導(dǎo)致頁(yè)面重新渲染的一些元素,從而影響性能。 一、什么是回流? 回流是會(huì)導(dǎo)致頁(yè)面重新渲染的一些元素,從而影響性能。 二、哪些因素會(huì)導(dǎo)致回流? 1、調(diào)整窗口的大小; 2、改變字體,如果用rem 設(shè)置了根目錄的字體大小,這樣就減少了回流的次數(shù); 3、增加或者移除樣式表; 4、內(nèi)容的變化,用戶(hù)在input中輸入了文字(這是不可避免的); 5、激活CSS的偽類(lèi); 6、操作c...
摘要:之后,如果渲染樹(shù)發(fā)生了變動(dòng),那么可能會(huì)觸發(fā)回流或重繪中的一個(gè)或二者。在書(shū)寫(xiě)時(shí)要避免不必要的層級(jí),書(shū)寫(xiě)時(shí)避免嵌套過(guò)深規(guī)則過(guò)于復(fù)雜,尤其是后代選擇器,匹配選擇器也會(huì)耗費(fèi)更多的。 剛?cè)胄星岸说臅r(shí)候是不是經(jīng)常看到有文章說(shuō)盡量不要用CSS通配符*,CSS選擇器層疊最好不要超過(guò)三層,HTML少使用table,結(jié)構(gòu)也要盡量簡(jiǎn)單一些...這一切說(shuō)的不無(wú)道理,過(guò)多的使用確實(shí)會(huì)造成瀏覽器渲染的性能降低,當(dāng)...
摘要:寫(xiě)在金三銀四之際。一個(gè)節(jié)點(diǎn)觸發(fā)了,瀏覽器會(huì)檢查中其他所有節(jié)點(diǎn)的顯示方式一個(gè)節(jié)點(diǎn)觸發(fā)了會(huì)導(dǎo)致它的祖先節(jié)點(diǎn),后代節(jié)點(diǎn)以及在它之后的節(jié)點(diǎn)全部。對(duì)性能的影響大于。解決方式控制我們無(wú)力去改變,對(duì)性能損害的程度,我們能做的只有減少它們發(fā)生的次數(shù)。 寫(xiě)在金三銀四之際。 因?yàn)榉N種原因想要謀求新的發(fā)展,不得已翻起了塵封已久的高程書(shū);寫(xiě)起了各種經(jīng)典CSS布局;回顧起記憶略顯模糊的幾個(gè)項(xiàng)目。感慨著太多太多...
閱讀 1802·2021-11-24 09:39
閱讀 2290·2021-09-30 09:47
閱讀 4144·2021-09-22 15:57
閱讀 1873·2019-08-29 18:36
閱讀 3577·2019-08-29 12:21
閱讀 590·2019-08-29 12:17
閱讀 1263·2019-08-29 11:25
閱讀 724·2019-08-28 18:26