SuperAPI AI 工具集

performance-profiling

前端与建站

查看项目

更新于 10-16 09:28

技能介绍

用途:提供性能测量的基本原则与工具选择思路,核心顺序为先测量、再分析、后优化。适用于页面加载、交互、内存与网络等性能问题的排查与优化。

主要能力:

  1. Core Web Vitals 指标参考:LCP 良好低于 2.5s、较差高于 4.0s,衡量加载;INP 良好低于 200ms、较差高于 500ms,衡量交互;CLS 良好低于 0.1、较差高于 0.25,衡量稳定性。测量阶段可选:开发阶段用本地 Lighthouse,CI/CD 用 Lighthouse CI,生产环境用 RUM 真实用户监控。
  2. 四步工作流:BASELINE 测量现状,IDENTIFY 定位瓶颈,FIX 做针对性修改,VALIDATE 确认改进。工具选择:页面加载用 Lighthouse,打包体积用 bundle analyzer,运行时用 DevTools Performance,内存用 DevTools Memory,网络用 DevTools Network。
  3. 打包分析:关注大依赖、重复代码、未使用代码、缺少代码分割。对应动作包括按需导入具体模块、去重并更新版本、拆分路由、tree shake。
  4. 运行时分析:Performance 面板中长任务(大于50ms)表示 UI 阻塞,大量小任务可能存在批处理机会,布局与绘制代表渲染瓶颈,Script 代表 JavaScript 执行。Memory 面板中堆增长可能泄漏,大量保留对象需检查引用,Detached DOM 表示未清理。
  5. 常见瓶颈与快速优先级:优先启用压缩、图片懒加载、路由代码分割,其次缓存静态资源与优化图片。

使用方式:资料提供运行时脚本 scripts/lighthouse_audit.py 用于 Lighthouse 性能审计,用法为 python scripts/lighthouse_audit.py https://example.com。

限制与提醒:仅当任务明确符合上述范围时使用;输出不能替代针对具体环境的验证、测试或专家评审;若缺少必要输入、权限、安全边界或成功标准,应停止并请求澄清。资料未提供收费、价格与平台支持信息。原则:不猜测问题,先分析;不做微优化,先解决最大问题;避免过早优化;不要忽略真实用户数据;最快的代码是不运行的代码,先移除再优化。