- 知識面要廣
- 理解要深刻
- 學(xué)會贊美（說自己沒有了解的這么深）
- 渲染機制
- js運行機制
- 頁面性能
- 錯誤監(jiān)控
渲染機制
- 什么是DOCTYPE及作用
- 瀏覽器渲染過程
- 重排Reflow
- 重繪Repaint
- 布局Layout
什么是DOCTYPE及作用
- DTD
用來定義xml，xhtml的文檔類型。
用來告訴瀏覽器我是什么文檔類型。讓瀏覽器根據(jù)文檔類型來選擇合適的引擎來解析渲染。 - DOCTYPE
告訴瀏覽器是什么DTD，也就是什么文檔類型。 -
常見的DOCTYPE有哪些，寫一下html5的該怎么寫？
要知道html4有嚴格模式和傳統(tǒng)模式。以及區(qū)別。
1.瀏覽器渲染過程
html解析器解析html生成dom tree，css解析器解析css生成cssom tree，然后這兩顆樹結(jié)合生成render tree，layout之前render tree不知道每個結(jié)點具體該畫在頁面的什么位置，layout可以精確的計算每個節(jié)點要顯示位置的寬和高以及顏色。最后瀏覽器就開始畫圖啦，呈現(xiàn)出頁面。
2.重排Reflow
-
定義
- 觸發(fā)
---增加，刪除，修改dom節(jié)點時，會導(dǎo)致reflow或repaint
---移動dom的位置，或者是動畫的時候
---修改css樣式的時候
---resize窗口的時候，或是滾動
---修改網(wǎng)頁的默認字體時
3.重繪Repaint
頁面要成仙的內(nèi)容畫在屏幕上。
-
定義
- 觸發(fā)
dom改動
css改動 - 如何避免最小程度的重繪？
通過documentframe，將要加的節(jié)點全部加在這個片段節(jié)點上，最后一次性添加到dom中，而不是一個一個節(jié)點依次添加到dom中。
