Slow and Frozen Frames and Frames Delay Instrumentation

Learn about slow and frozen frames and frame delay and how to track them using Sentry's Flutter SDK.

Unresponsive UI and animation hitches annoy users and degrade the user experience. This integration can help. Set it up and identify these problems in your app by tracking and showing slow frames, frozen frames, and frame delay metrics for spans. Learn more about frame delay here.

Frame metrics are manually calculated using the addPersistentFrameCallback API from the Flutter SDK. Frame duration tracking in Sentry's Flutter SDK begins automatically when a span starts. It continuously measures each frame's render time until the span finishes, then calculates and attaches frame metrics to the completed span.

Before starting, ensure:

  1. The Sentry Flutter SDK is initialized. Learn more here.
  2. Tracing is set up. Learn more here.

This type of instrumentation is automatically enabled. There is no need for further configuration.

Set enableFramesTracking to false in the options to disable the instrumentation.

Copied
import 'package:flutter/widgets.dart';
import 'package:sentry_flutter/sentry_flutter.dart';

Future<void> main() async {
  await SentryFlutter.init(
    (options) => options.enableFramesTracking = false,
    appRunner: () => runApp(MyApp()),
  );
}
Help improve this content
Our documentation is open source and available on GitHub. Your contributions are welcome, whether fixing a typo (drat!) or suggesting an update ("yeah, this would be better").