用途：帮助开发者系统性地测量、分析并改进网站与 Web 应用的性能，以提升用户体验、SEO 排名与转化率，关注加载速度、运行时性能和 Core Web Vitals。触发场景包括页面加载缓慢、需要优化 Core Web Vitals、缩减 JavaScript 打包体积、改善 Time to Interactive、优化图片与资源、实施缓存策略。
主要能力与流程：
- 测量基线：运行 Lighthouse 审计，测量 LCP、FID、CLS，检查打包体积，分析网络瀑布，定位瓶颈。
- 识别问题：大体积 JS 包、未优化图片、阻塞渲染的资源、服务器响应慢、缺少缓存头、布局偏移、阻塞主线程的长任务。
- 排定优先级：关键渲染路径优化、代码分割与懒加载、图片优化、缓存策略、第三方脚本优化。
- 实施优化：优化资源（图片、字体、CSS、JS），代码分割，设置缓存头，懒加载非关键资源，优化关键渲染路径。
- 验证效果：重跑 Lighthouse，对比前后指标，监控真实用户指标（RUM），在不同设备与网络下测试。
使用方式：资料建议以 @web-performance-optimization 触发该技能，先确认任务范围与技能是否匹配，再读取 metadata.json 与 ORIGIN.md 确认来源，仅加载会实质改变结果的参考文件、示例或脚本，执行上游工作流并保留来源边界，最后对照预期验证结果。示例命令包括 npx webpack-bundle-analyzer dist/stats.json 与 npx webpack-bundle-analyzer 用于分析打包。
最佳实践：先测量再优化；定期运行 Lighthouse；使用现代图片格式（WebP、AVIF）与响应式图片；拆分大包；懒加载非关键资源；为静态资源设置缓存头；控制主线程任务在 50ms 以下；用 link rel=preload 预加载关键资源；用 CDN 交付静态资源；监控真实用户 Core Web Vitals。
限制与未提供信息：资料未说明具体支持的框架版本、平台限制、收费方式、价格或性能提升保证，缺失事实暂未提供。技能以来源包与上游工作流为单位，执行时应显式保留来源信息并在任务漂移时移交相关技能。