七、性能优化

1. 如何检测Flutter应用的性能问题？

核心工具：

关键指标检测：

void main() {
  // 帧率监控
  WidgetsBinding.instance.addTimingsCallback((timings) {
    if (timings.totalElapsed > 16.milliseconds) {
      debugPrint("⚠️ 帧耗时: ${timings.totalElapsed}ms (可能掉帧)");
    }
  });

  // 内存警告
  MemoryAllocations.instance.addListener((event) {
    if (event.bytes > 100 * 1024 * 1024) {
      debugPrint("🚨 内存过高: ${event.bytes ~/ 1024 ~/ 1024}MB");
    }
  });
}

2. 什么是重绘边界（Repaint Boundary）？

核心概念：

• 作用：隔离子树的重绘范围，避免整个界面刷新
• 原理：将Widget子树标记为独立图层，只重绘该图层内容
• 效果：减少GPU绘制工作量，提升滚动/动画流畅度

使用场景：

ListView(
  children: [
    RepaintBoundary(  // 列表项独立重绘
      child: ListTile(title: Text("Item 1")),
      RepaintBoundary(
        child: ListTile(title: Text("Item 2"))),
      ],
    )

何时使用：

• 频繁变化的动画元素
• 复杂静态内容（如带阴影的卡片）
• 列表项（ListView.builder 默认自动添加）

3. 如何避免不必要的重建？

优化策略：

代码示例：

// 优化前：整个卡片重建
Widget build(BuildContext context) {
  return Card(
    child: Column(
      children: [
        _buildHeader(), // 频繁变化
        _buildStaticContent(), // 静态内容
      ],
    ),
  );
}

// 优化后：隔离变化部分
Widget build(BuildContext context) {
  return Card(
    child: Column(
      children: [
        _buildDynamicHeader(), // 单独管理状态
        const _StaticContent(), // const 组件
      ],
    ),
  );
}

4. const 构造函数在优化中起什么作用？

核心优势：

1. 编译期常量：组件在编译时被创建，运行时直接复用
2. 零重建成本：不会被父组件重建影响
3. 热重载加速：跳过 const 组件的重新编译

使用规范：

// ✅ 推荐使用
const SizedBox(height: 10);
const Text("Hello");
const Icon(Icons.star);

// ❌ 无法使用 const 的情况
Text("Hello ${DateTime.now()}") // 动态内容
  Button(onPressed: () { ... })   // 回调函数

性能影响：

5. 如何优化长列表的性能？

黄金法则：使用 ListView.builder + itemExtent

ListView.builder(
  itemCount: 10000,
  itemExtent: 80, // 固定高度（提升滚动计算效率）
  itemBuilder: (context, index) {
    return ListTile(
      title: Text("Item $index"),
      // 使用 const 优化子组件
      leading: const Icon(Icons.circle),
    );
  },
)

进阶优化：

6. 如何减少应用启动时间？

优化策略：

代码示例：

// main.dart 最小化启动
void main() {
  runApp(SplashScreen()); // 极简启动屏

  // 后台初始化
  Future.delayed(Duration.zero, () async {
    await _initFirebase();
    await _loadUserData();
    runApp(MyRealApp()); // 替换为真实应用
  });
}

启动时间指标：