跳到正文
cccskills
免费在 GitHub 公开

performance-profiling

Performance profiling principles. Measurement, analysis, and optimization techniques.

中文简介正在准备中。当前显示原文说明。

查看安装方法

包含的文件(2)

  • SKILL.md3.0 KB
  • scripts/lighthouse_audit.py2.6 KB

SKILL.md(原文)

安装前可以查看交给 AI 代理的指令内容。

Performance Profiling

Measure, analyze, optimize - in that order.

🔧 Runtime Scripts

Execute these for automated profiling:

ScriptPurposeUsage
scripts/lighthouse_audit.pyLighthouse performance auditpython scripts/lighthouse_audit.py https://example.com

1. Core Web Vitals

Targets

MetricGoodPoorMeasures
LCP< 2.5s> 4.0sLoading
INP< 200ms> 500msInteractivity
CLS< 0.1> 0.25Stability

When to Measure

StageTool
DevelopmentLocal Lighthouse
CI/CDLighthouse CI
ProductionRUM (Real User Monitoring)

2. Profiling Workflow

The 4-Step Process

1. BASELINE → Measure current state
2. IDENTIFY → Find the bottleneck
3. FIX → Make targeted change
4. VALIDATE → Confirm improvement

Profiling Tool Selection

ProblemTool
Page loadLighthouse
Bundle sizeBundle analyzer
RuntimeDevTools Performance
MemoryDevTools Memory
NetworkDevTools Network

3. Bundle Analysis

What to Look For

IssueIndicator
Large dependenciesTop of bundle
Duplicate codeMultiple chunks
Unused codeLow coverage
Missing splitsSingle large chunk

Optimization Actions

FindingAction
Big libraryImport specific modules
Duplicate depsDedupe, update versions
Route in mainCode split
Unused exportsTree shake

4. Runtime Profiling

Performance Tab Analysis

PatternMeaning
Long tasks (>50ms)UI blocking
Many small tasksPossible batching opportunity
Layout/paintRendering bottleneck
ScriptJavaScript execution

Memory Tab Analysis

PatternMeaning
Growing heapPossible leak
Large retainedCheck references
Detached DOMNot cleaned up

5. Common Bottlenecks

By Symptom

SymptomLikely Cause
Slow initial loadLarge JS, render blocking
Slow interactionsHeavy event handlers
Jank during scrollLayout thrashing
Growing memoryLeaks, retained refs

6. Quick Win Priorities

PriorityActionImpact
1Enable compressionHigh
2Lazy load imagesHigh
3Code split routesHigh
4Cache static assetsMedium
5Optimize imagesMedium

7. Anti-Patterns

❌ Don't✅ Do
Guess at problemsProfile first
Micro-optimizeFix biggest issue
Optimize earlyOptimize when needed
Ignore real usersUse RUM data

Remember: The fastest code is code that doesn't run. Remove before optimizing.

评价

还没有评价。欢迎分享你的使用感受。

评论

无需登录即可发表。欢迎分享使用感受、提问,或说明在哪些环境下无法运行。

还没有评论。来写第一条吧。

提交后会立即公开。请勿填写邮箱、电话等个人信息。URL 最多 2 个。

0 / 1000 字

此表单受 reCAPTCHA 保护,适用 Google 的隐私权政策和服务条款。

同一仓库的技能

2d-games

免费

2D game development principles. Sprites, tilemaps, physics, camera.

中文简介正在准备中。当前显示原文说明。

VoDaiLocz/kilo-kit-mcp282026年9月13日 更新

3d-games

免费

3D game development principles. Rendering, shaders, physics, cameras.

中文简介正在准备中。当前显示原文说明。

VoDaiLocz/kilo-kit-mcp282026年9月13日 更新

aesthetic

免费

Create aesthetically beautiful interfaces following proven design principles. Use when building UI/UX, analyzing designs from inspiration sites, generating design images with ai-multimodal, implementing visual hierarchy and color theory, adding micro-interactions, or creating design documentation. Includes workflows for capturing and analyzing inspiration screenshots with chrome-devtools and ai-multimodal, iterative design image generation until aesthetic standards are met, and comprehensive design system guidance covering BEAUTIFUL (aesthetic principles), RIGHT (functionality/accessibility), SATISFYING (micro-interactions), and PEAK (storytelling) stages. Integrates with chrome-devtools, ai-multimodal, media-processing, ui-styling, and web-frameworks skills.

中文简介正在准备中。当前显示原文说明。

VoDaiLocz/kilo-kit-mcp282026年9月13日 更新

Use when implementing or managing persistent, hierarchical memory systems for AI agents. Covers cross-session state, fact supersession, and self-managed memory tools to enable long-term recall and adaptive agent behavior.

中文简介正在准备中。当前显示原文说明。

VoDaiLocz/kilo-kit-mcp282026年9月13日 更新

Use when monitoring, tracing, or debugging agentic workflows in production. Keywords: observability, tracing, OpenTelemetry, Langfuse, latency, token cost, loop detection, telemetry.

中文简介正在准备中。当前显示原文说明。

VoDaiLocz/kilo-kit-mcp282026年9月13日 更新

Use when building self-correcting retrieval systems for AI agents. Keywords: RAG, retrieval, Corrective RAG, Self-RAG, query decomposition, reranking, hallucination, grounding.

中文简介正在准备中。当前显示原文说明。

VoDaiLocz/kilo-kit-mcp282026年9月13日 更新

查看 VoDaiLocz 的全部技能

报告此技能的问题