Flutter开发中如何获取应用帧率

在Flutter开发中，如何实时获取应用的当前帧率（FPS）？有没有官方推荐的API或者第三方插件可以实现这个功能？我尝试过使用PerformanceOverlay，但它只能显示在调试模式下，无法通过代码直接获取具体数值。另外，如果要在生产环境监控帧率，需要注意哪些性能影响？

2 回复

Flutter中获取应用帧率可使用SchedulerBinding.instance.addTimingsCallback监听帧耗时，通过计算帧率公式：1000 / 平均帧耗时 得出实时帧率。

更多关于Flutter开发中如何获取应用帧率的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在Flutter中获取应用帧率，可以通过以下几种方法：

1. 使用Flutter Performance API

通过WidgetsBinding添加帧回调来手动计算帧率：

import 'package:flutter/scheduler.dart';

class FPSMonitor {
  int _frameCount = 0;
  int _lastFrameTime = 0;
  double _fps = 0;
  
  void startMonitoring() {
    WidgetsBinding.instance.addPostFrameCallback((_) {
      _updateFPS();
    });
  }
  
  void _updateFPS() {
    final int currentTime = DateTime.now().millisecondsSinceEpoch;
    _frameCount++;
    
    if (_lastFrameTime != 0) {
      final int elapsed = currentTime - _lastFrameTime;
      if (elapsed >= 1000) { // 每1秒计算一次
        _fps = (_frameCount * 1000) / elapsed;
        _frameCount = 0;
        _lastFrameTime = currentTime;
        print('当前帧率: ${_fps.toStringAsFixed(1)} FPS');
      }
    } else {
      _lastFrameTime = currentTime;
    }
    
    // 继续监听下一帧
    WidgetsBinding.instance.addPostFrameCallback((_) {
      _updateFPS();
    });
  }
}

2. 使用性能面板（开发期间）

  • 运行应用时按F键（Android Studio/IntelliJ）或Fn+F（VS Code）
  • 或点击Flutter Inspector中的"Performance Overlay"
  • 界面将显示实时帧率曲线和性能指标

3. 通过DevTools

  1. 运行flutter run --profile
  2. 打开Dart DevTools
  3. 进入Performance页面
  4. 查看帧率图表和详细性能数据

使用建议：

  • 开发阶段使用性能面板快速检查
  • 深度性能分析时使用DevTools
  • 需要代码监控时使用第一种方法（注意性能开销）

这些方法可以帮助你有效监控和优化Flutter应用的渲染性能。

回到顶部