1. 壓縮 HTML: medium HTML代碼壓縮，將註釋、空格和新行從生產文件中刪除。
刪除所有不必要的空格、註釋和中斷行將減少HTML的大小，加快網站的頁面加載時間，並顯着減輕用戶的下載時間。
大多數框架都有插件來促進網頁的縮小。你可以使用一組可以自動完成工作的NPM模塊。
HTML minifier | Minify Code
Experimenting with HTML minifier — Perfection Kills
2. 刪除不必要的註釋： low 確保從您的網頁中刪除註釋。
---------------------------
註釋對用戶來說是沒有用的，應該從生產環境文件中刪除。可能需要保留註釋的一種情況是：保留遠端代碼庫（keep the origin for a library）。
大多數情況下，可以使用HTML minify插件刪除註釋。
emove-html-comments - npm
刪除不必要的屬性： low 像 type="text/javascript" or type="text/css" 這樣的屬性應該被移除。
<!-- Before HTML5 -->
<script type="text/javascript">
// Javascript code
</script>
<!-- Today -->
<script>
// Javascript code
</script>類型屬性不是必需的，因爲HTML5把text/css和text/javascript作爲默認值。沒用的代碼應在網站或應用程序中刪除，因爲它們會使網頁體積增大。
確保所有和<script>標記都沒有任何type屬性。
在JavaScript引用之前引用CSS標記： high 確保在使用JavaScript代碼之前加載CSS。
<!-- 不推薦 -->
<script src="jquery.js"></script>
<script src="index.js"></script>
<link rel="stylesheet" href="index.css"/>
<!-- 推薦 -->
<link rel="stylesheet" href="index.css"/>
<script src="jquery.js"></script>
<script src="index.js"></script>
在引用JavaScript之前引用CSS可以實現更好的並行下載，從而加快瀏覽器的渲染速度。
- 確保中的和<style>始終位於<script>之前。
css 同樣原理
合併不必要的css文件
<!-- 不推薦 -->
<script src="foo.css"></script>
<script src="ajax.css"></script>
<!-- 推薦 -->
<script src="combined.css"></script>CSS文件需要是非阻塞引入，以防止DOM花時間加載。
<link rel="preload" href="global.min.css" as="style" onload="this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="global.min.css"></noscript>- CSS類(class)的長度: low class的長度會對HTML和CSS文件產生（輕微）影響。
- *爲即使是性能影響也是有爭議的，對項目的命名策略做出決定會對樣式表的可維護性產生重大影響。如果使用BEM，在某些情況下可能會遇到比所需字符多的類。明智地選擇名字和命名空間總是很重要的。
- 刪除未使用的CSS選擇器可以減小文件的大小，加快資源的加載速度。
- ⚠️ 檢查要使用的CSS框架是否已包含重置/規範化代碼。有時可能不需要用到重置/規範化文件中的內容。
- 分析樣式表的複雜性： high 分析樣式表有助於標記問題、冗餘和重複的CSS選擇器。
有時在CSS中會出現冗餘或驗證錯誤，分析CSS文件並刪除這些複雜性的代碼可以加速CSS文件的讀取和加載（因爲您的瀏覽器會更快地讀取它們）
關於字體
Webfont格式： medium 使用WOFF2格式字體。
- 使用preconnect可以更快地加載字體： medium
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>2 . 當你瀏覽網站時，設備需要獲取網站所在的位置以及需要連接的服務器。瀏覽器必須連接DNS服務器並等待查找完成後再獲取資源（字體，CSS文件…），prefetche和preconnect允許瀏覽器在空閒時進行上面的操作，在真實請求時就不需要再花時間去做一系列動作。
3 . 在預取您的網絡字體之前，請使用網頁測試來檢測網站. 查找藍綠色DNS查找並記下正在請求的主機（Look for teal colored DNS lookups and note the host that are being requested.） 在中添加預取的webfonts，添加上一步查找到的主機名。
關於JavaScript
JS 壓縮: high 所有JavaScript文件都要被縮小，註釋、空格和空行將從生產文件中刪除（在HTTP/2仍然有效果）。
不內嵌JavaScript: medium (僅對網站有效) 避免在body中間嵌入多個JavaScript代碼，將JavaScript代碼重新集中到外部文件中，放在或頁面末尾（之前）
非阻塞JavaScript： high 使用defer屬性或使用async來異步加載JavaScript文件。
<!-- Defer Attribute -->
<script defer src="pulic.js">
<!-- Async Attribute -->
<script async src="pulic.js">JavaScript複雜性可能會降低運行時性能。識別這些可能的問題對提供流暢的用戶體驗來說至關重要。
怎麼做：
使用Chrome開發者工具中的時間軸工具來評估腳本事件，並找到可能需要花費太多時間的事件。
其他的懶的寫了。。。有需要聯繫博主