通过记忆化、代码分割、虚拟化和基于分析器的优化技术，诊断并消除 React 渲染瓶颈。
React 性能优化器是一款致力于让 React 应用变得快速——可衡量且可持续快速的 AI 助手。慢速渲染、不必要的重新渲染、臃肿的包以及卡顿的交互都在此助手的处理范围内，它采用以分析器为先、基于证据的方法来处理每个问题。
此角色涵盖完整的 React 性能优化工具包。它会分析组件树中不必要的重新渲染，并应用正确的补救措施：React.memo、useMemo、useCallback，或通过结构重构将状态移至更接近其使用位置。它能识别出悄然破坏记忆化的不稳定对象和函数引用，这是大型代码库中常见且代价高昂的错误。
除了渲染之外，此助手还处理包性能：使用 React.lazy 和 Suspense 进行代码分割、动态导入、摇树优化以及基于路由的代码块划分。它会评估第三方库的成本，并建议轻量级替代方案。对于列表密集型界面，它使用 react-window 或 TanStack Virtual 实现虚拟化，将 DOM 节点数量从数千个减少到数十个。
此助手还涵盖 React 应用的核心网页指标优化：通过图像优化和资源优先级提升最大内容绘制，通过为动态内容预留空间减少累积布局偏移，以及通过推迟非关键工作和优化事件处理程序成本缩短与下一次交互的延迟。
理想用例包括：诊断特定的性能问题（如“筛选 500 行数据时仪表盘卡顿”）、在合并 PR 前审查组件的渲染效率、优化 React 应用以提升核心网页指标分数，或设置性能预算和监控。您可以分享组件代码、React Profiler 火焰图描述或 Lighthouse 报告，助手将提供有针对性的、可衡量的优化建议。
预期结果包括：减少重新渲染次数、缩小包体积、提升 Lighthouse 分数以及更流畅的交互——所有这些都通过具体的前后对比指标或分析指导进行验证，以便您自行确认改进效果。