mit einem Klick
performance-profiling
效能分析原則。測量、分析與最佳化技術。
Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.
Menü
效能分析原則。測量、分析與最佳化技術。
Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.
Basierend auf der SOC-Berufsklassifikation
使用 Claude API / Anthropic SDK 建構、除錯和最佳化應用程式。使用此技能建構的應用程式應包含提示快取 (prompt caching)。也處理在 Claude 模型版本之間遷移現有 Claude API 程式碼(4.5 → 4.6,4.6 → 4.7,替換已退役模型)。觸發時機:程式碼匯入 anthropic/@anthropic-ai/sdk;使用者要求使用 Claude API、Anthropic SDKs 或 Managed Agents (/v1/agents, /v1/sessions, /v1/environments);使用者在檔案中新增/修改/調整 Claude 功能(快取、思考、壓縮、工具使用、批次、檔案、引用、記憶)或模型(Opus/Sonnet/Haiku);關於 Anthropic SDK 專案中提示快取/快取命中率的問題。不觸發:檔案匯入 `openai`/其他提供者 SDK,檔案名稱類似 `*-openai.py`/`*-generic.py`,與提供者無關的程式碼,一般程式設計/機器學習。
當編寫呼叫 Gemini API 的程式碼時請使用此技能,用於文字生成、多輪對話、多模態理解、影像生成、串流回應、背景研究任務、函式呼叫、結構化輸出,或從舊的 generateContent API 遷移。此技能涵蓋 Interactions API,這是在 Python 與 TypeScript 中使用 Gemini 模型與代理的建議方式。
Tailwind CSS v4 原則。CSS 優先配置、容器查詢、現代模式、設計 token 架構。
處理使用 Gemini Live API 的即時、雙向串流應用程式時使用此技能。涵蓋基於 WebSocket 的音訊/視訊/文字串流、語音活動偵測 (VAD)、原生音訊功能、函式呼叫、會話管理、用戶端身分驗證的臨時權杖,以及所有 Live API 設定選項。涵蓋的 SDK - google-genai (Python)、@google/genai (JavaScript/TypeScript)。
Python 開發原則與決策。框架選擇、非同步模式、型別提示、專案結構。教你思考而非複製。
自動代理選擇與智慧任務路由。分析使用者請求並自動選擇最佳專家代理,無需使用者明確提及。
| name | performance-profiling |
| description | 效能分析原則。測量、分析與最佳化技術。 |
| allowed-tools | Read, Glob, Grep, Bash |
測量、分析、最佳化 — 按此順序。
執行這些進行自動化分析:
| 腳本 | 用途 | 使用方式 |
|---|---|---|
scripts/lighthouse_audit.py | Lighthouse 效能稽核 | python scripts/lighthouse_audit.py https://example.com |
| 指標 | 良好 | 差 | 測量項目 |
|---|---|---|---|
| LCP | < 2.5s | > 4.0s | 載入 |
| INP | < 200ms | > 500ms | 互動性 |
| CLS | < 0.1 | > 0.25 | 穩定性 |
| 階段 | 工具 |
|---|---|
| 開發 | 本地 Lighthouse |
| CI/CD | Lighthouse CI |
| 生產 | RUM(真實使用者監控) |
1. 基線 → 測量當前狀態
2. 識別 → 找到瓶頸
3. 修復 → 做有針對性的變更
4. 驗證 → 確認改善
| 問題 | 工具 |
|---|---|
| 頁面載入 | Lighthouse |
| 打包大小 | Bundle analyzer |
| 執行期 | DevTools Performance |
| 記憶體 | DevTools Memory |
| 網路 | DevTools Network |
| 問題 | 指標 |
|---|---|
| 大型依賴 | 打包頂部 |
| 重複程式碼 | 多個 chunk |
| 未使用程式碼 | 低覆蓋率 |
| 缺少分割 | 單一大 chunk |
| 發現 | 動作 |
|---|---|
| 大型函式庫 | 精確引入特定模組 |
| 重複依賴 | 去重、更新版本 |
| 路由在主包中 | 程式碼分割 |
| 未使用的匯出 | Tree shake |
| 模式 | 意義 |
|---|---|
| 長任務(>50ms) | UI 阻塞 |
| 許多小任務 | 可能的批次處理機會 |
| Layout/paint | 渲染瓶頸 |
| Script | JavaScript 執行 |
| 模式 | 意義 |
|---|---|
| 堆持續增長 | 可能的記憶體洩漏 |
| 大量保留 | 檢查參考 |
| 分離的 DOM | 未清理 |
| 症狀 | 可能原因 |
|---|---|
| 初始載入慢 | 大 JS、渲染阻塞 |
| 互動慢 | 沉重的事件處理器 |
| 捲動卡頓 | Layout thrashing |
| 記憶體持續增長 | 洩漏、保留的參考 |
| 優先 | 動作 | 影響 |
|---|---|---|
| 1 | 啟用壓縮 | 高 |
| 2 | 延遲載入圖片 | 高 |
| 3 | 路由程式碼分割 | 高 |
| 4 | 快取靜態資產 | 中 |
| 5 | 最佳化圖片 | 中 |
| ❌ 不要 | ✅ 要 |
|---|---|
| 猜測問題 | 先分析 |
| 微觀最佳化 | 修復最大的問題 |
| 過早最佳化 | 需要時再最佳化 |
| 忽略真實使用者 | 使用 RUM 資料 |
記住: 最快的程式碼是不執行的程式碼。先移除,再最佳化。