## `HTML`優化 > * 插入`HTML`。 > * `JavaScript`中使用`document.write`生成頁面內容會效率較低，可以找一個容器元素，比如指定一個`div`，并使用`innerHTML`來將`HTML`代碼插入到頁面中。 > * 避免空的`src`和`href`。 > * 當`link`標簽的`href`屬性為空、`script`標簽的`src`屬性為空的時候，瀏覽器渲染的時候會把當前頁面的`URL`作為它們的屬性值，從而把頁面的內容加載進來作為它們的值。 > * 為文件頭指定`Expires`。 > * 使內容具有緩存性，避免了接下來的頁面訪問中不必要的HTTP請求。 > * 重構HTML，把重要內容的優先級提高。 > * Post-load（次要加載）不是必須的資源。 > * 利用預加載優化資源。 > * 合理架構，使DOM結構盡量簡單。 > * 利用`LocalStorage`合理緩存資源。 > * 盡量避免CSS表達式和濾鏡。 > * 嘗試使用defer方式加載Js腳本。 > * 新特性：will-change，把即將發生的改變預先告訴瀏覽器。 > * 新特性Beacon，不堵塞隊列的異步數據發送。 > * 不同之處：網絡緩慢，緩存更小，不令人滿意的瀏覽器處理機制。 > * 盡量多地緩存文件。 > * 使用HTML5 Web Workers來允許多線程工作。 > * 為不同的Viewports設置不同大小的Content。 > * 正確設置可Tap的目標的大小。 > * 使用響應式圖片。 > * 支持新接口協議（如HTTP2）。 > * 未來的緩存離線機制：Service Workers。 > * 未來的資源優化Resource Hints(preconnect, preload, 和prerender)。 > * 使用Server-sent Events。 > * 設置一個Meta Viewport。