1k-performance

OneKey 性能优化

OneKey monorepo 中 React/React Native 应用的性能优化模式与最佳实践。

快速参考

类别	关键优化	适用场景
并发请求	限制为 3-5 个，使用 executeBatched	多个 API 调用、网络密集型操作
桥接优化	尽量减少跨桥接调用，批量处理数据	React Native 桥接开销、iOS/Android
列表渲染	FlashList、windowSize={5}、content-visibility	包含 100+ 个项目的列表
记忆化	memo、useMemo、useCallback	耗时计算、防止重复渲染
重量级操作	InteractionManager、setTimeout	会阻塞 UI 的操作

关键性能规则

❌ 禁止：并发请求过多

// ❌ BAD - Can freeze UI with 15+ requests
const requests = items.map(item => fetchData(item));
await Promise.all(requests);

✅ 正确：限制并发数的批量执行

async function executeBatched<T>(
  tasks: Array<() => Promise<T>>,
  concurrency = 3,
): Promise<Array<PromiseSettledResult<T>>> {
  const results: Array<PromiseSettledResult<T>> = [];
  for (let i = 0; i < tasks.length; i += concurrency) {
    const batch = tasks.slice(i, i + concurrency);
    const batchResults = await Promise.allSettled(
      batch.map((task) => task()),
    );
    results.push(...batchResults);
  }
  return results;
}

const tasks = items.map(item => () => fetchData(item));
await executeBatched(tasks, 3); // Max 3 concurrent

🚨 内置优化

已完成优化——无需采取任何操作：

组件	优化	详情
ListView	windowSize={5}	自动限制可见项目数量
Tabs	contentVisibility: 'hidden'	隐藏未激活的标签页
Dialog	contentVisibility: 'hidden'	关闭时隐藏

详细指南

如需了解全面的性能优化策略，请参阅 performance.md。

涵盖主题：

• 并发请求控制
• React Native 桥接优化
• 卸载重量级操作
• 列表渲染（windowSize、FlashList、content-visibility）
• 记忆化与回调
• 状态更新优化
• 图像优化
• 异步操作与竞态条件
• 真实 iOS AppHang 案例分析

相关技能

• /1k-coding-patterns - 通用编码模式与约定
• /1k-sentry - Sentry 错误分析（包含性能问题）