performance-optimization:先量測,再決定要優化哪裡
用 baseline、profiling 與前後比較處理前端、後端、查詢與資料庫效能。
學完會知道
- 理解 performance-optimization 在開發流程裡負責的工作
- 判斷什麼情況適合使用 performance-optimization
- 完成通用 Skills CLI、Codex 或 Claude Code 安裝
開始前先準備
- 可使用支援 Agent Skills 的 coding agent
- 準備一個能實際驗證的小型開發任務
這個 Skill 在做什麼
用 baseline、profiling 與前後比較處理前端、後端、查詢與資料庫效能。
為什麼有用
沒有量測的優化通常只增加複雜度。這個 Skill 先建立 baseline,找出真正限制使用者或系統的瓶頸,修正後再用相同方法比較。
適合什麼場景
- Core Web Vitals 低於目標。
- API 延遲或資料庫查詢突然變慢。
- 新功能需要處理大量資料或高流量。
和站內相近內容的差別
舊的 Performance Skill 與 Core Web Vitals Skill 是 Web Quality 索引。performance-optimization 不只處理瀏覽器,也涵蓋後端、N+1 查詢、資料庫與容量問題。
如何安裝
想先查看可選清單,可以執行:
npx skills add addyosmani/agent-skills --list
只安裝這一個 Skill:
npx skills add addyosmani/agent-skills --skill performance-optimization
安裝完整 24 個 Skills:
npx skills add addyosmani/agent-skills
這個 Skill 會引用 references/performance-checklist.md。單獨安裝仍能執行主要流程,但 Skills CLI 不會帶入上游根目錄的共用 references。需要完整檢查表時,請安裝整套,或手動把這些檔案放到 Skill 能依原相對路徑讀取的位置。
手動安裝時,先 clone 上游 repo,再把整個 Skill 資料夾放進代理使用的 skills 目錄:
git clone https://github.com/addyosmani/agent-skills.git
來源資料夾是 skills/performance-optimization/。如果上面列出共用 references,還要保留上游的相對路徑。
Codex
Codex CLI 0.122 以上可安裝整套原生外掛:
codex plugin marketplace add addyosmani/agent-skills
codex plugin add agent-skills@agent-skills
安裝後重新開啟 session。手動指定時輸入 @performance-optimization;也可以直接描述任務,讓 Codex 依 Skill 的 description 自動選用。
Claude Code
Claude Code 可從 marketplace 安裝:
/plugin marketplace add addyosmani/agent-skills
/plugin install agent-skills@addy-agent-skills
此外掛也提供 /spec、/plan、/build、/test、/review、/code-simplify 與 /ship 等流程指令。這些指令會編排對應 Skills,不代表每個指令都只使用本頁這一個 Skill。
自動啟用還是手動指定
自動優先。規格有預算或監控回報退化時就應啟用。若沒有任何數據,先手動指定量測範圍,不要直接要求代理優化。
在 Codex 手動呼叫的寫法:
@performance-optimization
請依這個 Skill 的原始流程處理目前任務,完成後列出驗證證據。