移除網站中用不到的CSS 規則 | 排除禁止轉譯的資源css
一般開發者在網站弄的差不多之後都會開始做最佳化處理,包括加掛SSL、CloudFlare和Javascript/CSS優化等等。在現在的前端環境裡,CSSFramework多到連走路都會不小心在路邊踢到,所以人手一個CSSFramework作為開發基底也是很正常的事。常見的CSSFramework清單-Front-endCSSFrameworks—Acollectionofbestfrontendframeworksforfaster&easierwebdevelopment[1]但每個專案大大小小,情況和情境都有不同,CSSFramework當中的很多部份可能根本用不到每個專案當中,更不用說如果同時併用多個CSS套件時,實際的CSS平均用率常會降到一半以...
一般開發者在網站弄的差不多之後都會開始做最佳化處理,包括加掛 SSL、Cloud Flare 和 Javascript / CSS 優化等等。在現在的前端環境裡,CSS Framework 多到連走路都會不小心在路邊踢到,所以人手一個 CSS Framework 作為開發基底也是很正常的事。
常見的 CSS Framework 清單- Front-end CSS Frameworks — A collection of best front end frameworks for faster & easier web development[1]
但每個專案大大小小,情況和情境都有不同,CSS Framework 當中的很多部份可能根本用不到每個專案當中,更不用說如果同時併用多個 CSS 套件時,實際的 CSS 平均用率常會降到一半以下,所以精簡化 CSS 是還滿重要的一個步驟(以 Product 環境來說)。另外我也考慮 Google PageSpeed Insights[2] 一直在報的 CSS 資源禁止轉譯問題,如果把 CSS 精簡的夠小,是否可以直接塞進 HTML 當中而不用連到外部檔案。
Google PageSpeed Insights[3] 建議,清除禁止轉譯的 CSS 資源上 Google 用 remove、 unused、css 等關鍵字找了些工具,以下介紹幾個我有試過的。
unused-c...