一，CSS和JS在網頁中的放置順序是怎樣的？
js理論上可以在html的任何地方鏈入或放置，為了更好的呈現頁面效果，提升體驗，css應被放入到HTML的<head></head>標簽里，js應放在<body>的底部，</body>之前。
二，解釋白屏和FOUC
-
白屏:
1.1 如果把樣式放在底部,對于一些瀏覽器,在某些場景下(新窗口打開,刷新等)頁面會出現白屏,而不是內容逐步展現，這是因為我們訪問網頁所呈現的是結合解析HTML標簽自上而下構造的DOM樹與解析CSS后的CSSOM樹結合在一起組成渲染樹所布局和繪制的，如果一個網頁的HTML文本內容很多，這樣把樣式放在body底部，會造成頁面生產渲染樹的延遲，所以形成了白屏，這種情況下的白屏不是一個bug，而是瀏覽器的渲染機制。
1.2 如果使用 @import 標簽,即使 CSS 放入 link, 并且放在頭部,也可能出現白屏，這是因為@import 標簽不會被立即執行，所以也出現了白屏的現象。
-
FOUC
2.1 Firefox 有所不同，如果把樣式放在底部，Firefox會出現FOUC（無樣式內容閃爍），這是也是因為瀏覽器的渲染機制，它的渲染機制是先自上而下解析HTML標簽構造DOM樹并呈現出來，然后解析CSS，最后才會呈現樣式，期間會逐步加載無樣式內容；
三，sync和defer的作用是什么？有什么區別？
-
默認引用script:
<script type="text/javascript" src="javascript.js"></script>
當瀏覽器遇到 script 標簽時，文檔的解析將停止，并立即下載并執行腳本，腳本執行完畢后將繼續解析文檔。
-
async模式 :
<script type="text/javascript" src="javascript.js" async="async"></script>
當瀏覽器遇到 script 標簽時，文檔的解析不會停止，其他線程將下載腳本，腳本下載完成后開始執行腳本，腳本執行的過程中文檔將停止解析，直到腳本執行完畢。
-
defer模式:
<script type="text/javascript" src="javascript.js" async="async"></script>
當瀏覽器遇到 script 標簽時，文檔的解析不會停止，其他線程將下載腳本，待到文檔解析完成，腳本才會執行。
四，簡述網頁的渲染機制
- 解析 HTML 標簽, 構建 DOM 樹
- 解析 CSS 標簽, 構建 CSSOM 樹
- 把 DOM 和 CSSOM 組合成 渲染樹 (render tree)
- 在渲染樹的基礎上進行布局, 計算每個節點的幾何結構
- 把每個節點繪制到屏幕上 (painting)
