❤️ 🍰 🌹 🎬 🚴♀️ 🏋️♀️ 💻 🚀 💜
這裡記錄了我的學習和開發筆記，歡迎交流 (*´∀`)~♥
© 2025. All rights reserved.
PostCSS 是一個使用 JavaScript 轉換 CSS 的工具，它可以做的事情很多，像是加入各家瀏覽器的前綴詞（prefix）、將先進的功能轉為目前主流瀏覽器所能支援的語法、語法檢查和報錯、支援 Grid System、使用類似 SASS 的功能等。
PostCSS css webpack
比較 Preload 與 Prefetch 的異同。
Resource Hints 效能調校 加載效能 圖片最佳化 HTTP Caching
實作「圖片最佳化（Image Optimization）」的第一個問題是「真的需要這個圖檔嗎？」，去除不需要的圖檔即可減少 HTTP Request。第二個問題才是「若圖檔不能去除或被取代，可以做哪些優化？」。
圖片最佳化 效能調校 加載效能 SVG Resource Hints
HTTP Caching。
HTTP Caching ETag 快取 效能調校 加載效能
將圖片轉為編碼字串，讓開發者能將圖檔嵌入 HTML、CSS 或 JavaScript 程式碼，以減少 HTTP Request。適合較少更新的小圖，例如 icon 等。
Base64 Images 效能調校 加載效能 Loading Performance 圖片最佳化
瀏覽器渲染效能（Browser Rendering Performance）總整理 (ゝ∀･)
關鍵轉譯路徑 效能調校 轉譯效能 Critical Rendering Path Rendering Performance
使用 Newsticker 作為改進渲染效能的範例，以下列出需要改進之處與解法，並附上測試結果。
關鍵轉譯路徑 效能調校 轉譯效能 Rendering Performance Critical Rendering Path