8 篇文件帶有標籤「性能優化」

Docusaurus + Cloudflare Pages 網頁字體使用與優化策略（繁體中文網站適用）

繁體中文字體完整字集 15-25MB 的體積挑戰，透過 Google Fonts 動態子集化、WOFF2 格式、display=swap、preconnect 與本地部署策略降低 FCP/LCP 與流量消耗。

避免手機端載入超大圖片拖慢 FCP/LCP 的兩種正確方案：JavaScript 動態載入（完全跳過）vs `<picture>` 元素搭配 media query（載入縮小版），附 React 範例與錯誤做法辨識。

SVG 效能原理、SVGOMG/SVGO 工具全部選項解析（低風險/中度/功能性影響/路徑優化四類）、不同用途 SVG 的最佳設定、SVG vs WebP 的選擇決策與混合內容拆分策略。

逐步實作指南：Python 爬蟲收集網站實際字符集、fontTools.subset 產生 WOFF2 子集、CSS @font-face + preload + display=swap 策略，將 15-20MB 中文字體縮減至數百 KB。

解析影片 streaming/lazy-load 機制 vs 圖片完整下載對首屏渲染的本質差異，說明 PageSpeed Insights 的 FCP/LCP 評分邏輯為何對 PNG 大圖嚴苛，並提供圖片效能優化建議。

針對 Lighthouse 性能測試分數不足，執行本地 WOFF2 字體、WebP 圖片轉換、移除外部 JS、搜尋框 UX 調整等實作，總分從 65 提升至 90。

製作 NotoSansCJKtc WOFF2 子集字體、內聯關鍵 hero CSS 消除渲染阻塞、COVIA 標題改用 SVG 並支援深淺色主題，大幅改善 LCP 指標。

首頁新增「先進 LLM 與 AI 應用」卡片、發布中文字體 WOFF2 製作指南、擴充首頁導言、修復中文字體斷裂回退問題。