feat: ttid/ttfd

dart/lib/src/sentry_measurement.dart

@@ -39,6 +39,22 @@ class SentryMeasurement {
         value = duration.inMilliseconds,
         unit = DurationSentryMeasurementUnit.milliSecond;
 
+  /// Duration of the time to initial display in milliseconds
+  SentryMeasurement.timeToInitialDisplay(Duration duration)
+      : assert(!duration.isNegative),
+        name = 'time_to_initial_display',
+        value = duration.inMilliseconds,
+        unit = DurationSentryMeasurementUnit.milliSecond;
+
+  /// Duration of the time to full display in milliseconds
+  SentryMeasurement.timeToFullDisplay(Duration duration)
+      : assert(!duration.isNegative),
+        name = 'time_to_full_display',
+        value = duration.inMilliseconds,
+        unit = DurationSentryMeasurementUnit.milliSecond;
+
+  // TODO: might wanna move ttid/ttfd to flutter since we don't have it on pure dart
+
   final String name;
   final num value;
   final SentryMeasurementUnit? unit;

dart/lib/src/sentry_trace_origins.dart

@@ -27,4 +27,7 @@ class SentryTraceOrigins {
   static const autoDbDriftQueryExecutor = 'auto.db.drift.query.executor';
   static const autoDbDriftTransactionExecutor =
       'auto.db.drift.transaction.executor';
+  static const uiLoad = 'ui.load';
+  static const uiTimeToInitialDisplay = 'ui.load.initial_display';
+  static const uiTimeToFullDisplay = 'ui.load.full_display';
 }

dart/lib/src/sentry_tracer.dart

@@ -109,18 +109,23 @@ class SentryTracer extends ISentrySpan {
       }
 
       var _rootEndTimestamp = commonEndTimestamp;
+
+      // Trim the end timestamp of the transaction to the very last timestamp of child spans
       if (_trimEnd && children.isNotEmpty) {
-        final childEndTimestamps = children
-            .where((child) => child.endTimestamp != null)
-            .map((child) => child.endTimestamp!);
-
-        if (childEndTimestamps.isNotEmpty) {
-          final oldestChildEndTimestamp =
-              childEndTimestamps.reduce((a, b) => a.isAfter(b) ? a : b);
-          if (_rootEndTimestamp.isAfter(oldestChildEndTimestamp)) {
-            _rootEndTimestamp = oldestChildEndTimestamp;
+        DateTime? latestEndTime;
+
+        for (var child in children) {
+          final childEndTimestamp = child.endTimestamp;
+          if (childEndTimestamp != null) {
+            if (latestEndTime == null || childEndTimestamp.isAfter(latestEndTime)) {
+              latestEndTime = child.endTimestamp;
+            }
           }
         }
+
+        if (latestEndTime != null) {
+          _rootEndTimestamp = latestEndTime;
+        }
       }
 
       // the callback should run before because if the span is finished,

flutter/example/lib/auto_close_screen.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:sentry/sentry.dart';
+import 'package:sentry_flutter/sentry_flutter.dart';
 
 /// This screen is only used to demonstrate how route navigation works.
 /// Init will create a child span and pop the screen after 3 seconds.
@@ -25,9 +26,10 @@ class AutoCloseScreenState extends State<AutoCloseScreen> {
     final childSpan = activeSpan?.startChild('complex operation',
         description: 'running a $delayInSeconds seconds operation');
     await Future.delayed(const Duration(seconds: delayInSeconds));
-    childSpan?.finish();
+    await childSpan?.finish();
+    SentryFlutter.reportFullyDisplayed();
     // ignore: use_build_context_synchronously
-    Navigator.of(context).pop();
+    // Navigator.of(context).pop();
   }
 
   @override

flutter/example/lib/main.dart

@@ -13,6 +13,7 @@ import 'package:sentry_flutter/sentry_flutter.dart';
 import 'package:sentry_isar/sentry_isar.dart';
 import 'package:sentry_sqflite/sentry_sqflite.dart';
 import 'package:sqflite/sqflite.dart';
+
 // import 'package:sqflite_common_ffi/sqflite_ffi.dart';
 // import 'package:sqflite_common_ffi_web/sqflite_ffi_web.dart';
 import 'package:universal_platform/universal_platform.dart';
@@ -71,10 +72,13 @@ Future<void> setupSentry(AppRunner appRunner, String dsn,
     options.attachScreenshot = true;
     options.screenshotQuality = SentryScreenshotQuality.low;
     options.attachViewHierarchy = true;
+    options.enableTimeToFullDisplayTracing = false;
+    options.spotlight = Spotlight(enabled: true);
     // We can enable Sentry debug logging during development. This is likely
     // going to log too much for your app, but can be useful when figuring out
     // configuration issues, e.g. finding out why your events are not uploaded.
     options.debug = true;
+    // options.enableTimeToFullDisplayTracing = true;
 
     options.maxRequestBodySize = MaxRequestBodySize.always;
     options.maxResponseBodySize = MaxResponseBodySize.always;
@@ -98,6 +102,16 @@ class MyApp extends StatefulWidget {
 }
 
 class _MyAppState extends State<MyApp> {
+  @override
+  void initState() {
+    super.initState();
+    // Example of reporting TTFD
+    Future.delayed(
+      const Duration(seconds: 1),
+      () => SentryFlutter.reportFullyDisplayed(),
+    );
+  }
+
   @override
   Widget build(BuildContext context) {
     return feedback.BetterFeedback(
@@ -723,9 +737,10 @@ void navigateToAutoCloseScreen(BuildContext context) {
   Navigator.push(
     context,
     MaterialPageRoute(
-      settings: const RouteSettings(name: 'AutoCloseScreen'),
-      builder: (context) => const AutoCloseScreen(),
-    ),
+        settings: const RouteSettings(name: 'AutoCloseScreen'),
+        builder: (context) => const SentryDisplayWidget(
+              child: AutoCloseScreen(),
+            )),
   );
 }
 
@@ -842,7 +857,11 @@ int loop(int val) {
 }
 
 class SecondaryScaffold extends StatelessWidget {
-  const SecondaryScaffold({Key? key}) : super(key: key);
+  SecondaryScaffold({Key? key}) : super(key: key) {
+    Timer(const Duration(milliseconds: 500), () {
+      SentryFlutter.reportFullyDisplayed();
+    });
+  }
 
   static Future<void> openSecondaryScaffold(BuildContext context) {
     return Navigator.push(
@@ -851,7 +870,7 @@ class SecondaryScaffold extends StatelessWidget {
         settings:
             const RouteSettings(name: 'SecondaryScaffold', arguments: 'foobar'),
         builder: (context) {
-          return const SecondaryScaffold();
+          return SecondaryScaffold();
         },
       ),
     );

flutter/lib/sentry_flutter.dart

@@ -16,3 +16,4 @@ export 'src/screenshot/sentry_screenshot_quality.dart';
 export 'src/user_interaction/sentry_user_interaction_widget.dart';
 export 'src/binding_wrapper.dart';
 export 'src/sentry_widget.dart';
+export 'src/navigation/sentry_display_widget.dart';

flutter/lib/src/event_processor/native_app_start_event_processor.dart

@@ -2,6 +2,7 @@ import 'dart:async';
 
 import 'package:sentry/sentry.dart';
 
+import '../integrations/integrations.dart';
 import '../native/sentry_native.dart';
 
 /// EventProcessor that enriches [SentryTransaction] objects with app start
@@ -10,36 +11,24 @@ class NativeAppStartEventProcessor implements EventProcessor {
   /// We filter out App starts more than 60s
   static const _maxAppStartMillis = 60000;
 
-  NativeAppStartEventProcessor(
-    this._native,
-  );
+  final IAppStartTracker? _appStartTracker;
 
-  final SentryNative _native;
+  NativeAppStartEventProcessor({
+    IAppStartTracker? appStartTracker,
+  }) : _appStartTracker = appStartTracker ?? AppStartTracker();
+
+  bool didAddAppStartMeasurement = false;
 
   @override
   Future<SentryEvent?> apply(SentryEvent event, {Hint? hint}) async {
-    final appStartEnd = _native.appStartEnd;
-
-    if (appStartEnd != null &&
-        event is SentryTransaction &&
-        !_native.didFetchAppStart) {
-      final nativeAppStart = await _native.fetchNativeAppStart();
-      if (nativeAppStart == null) {
-        return event;
-      }
-      final measurement = nativeAppStart.toMeasurement(appStartEnd);
-      // We filter out app start more than 60s.
-      // This could be due to many different reasons.
-      // If you do the manual init and init the SDK too late and it does not
-      // compute the app start end in the very first Screen.
-      // If the process starts but the App isn't in the foreground.
-      // If the system forked the process earlier to accelerate the app start.
-      // And some unknown reasons that could not be reproduced.
-      // We've seen app starts with hours, days and even months.
-      if (measurement.value >= _maxAppStartMillis) {
-        return event;
-      }
+    final measurement = _appStartTracker?.appStartInfo?.measurement;
+    // TODO: only do this once per app start
+    if (!didAddAppStartMeasurement &&
+        measurement != null &&
+        measurement.value.toInt() <= _maxAppStartMillis &&
+        event is SentryTransaction) {
       event.measurements[measurement.name] = measurement;
+      didAddAppStartMeasurement = true;
     }
     return event;
   }

flutter/lib/src/integrations/native_app_start_integration.dart

@@ -1,17 +1,22 @@
 import 'package:flutter/scheduler.dart';
+import 'package:meta/meta.dart';
 import 'package:sentry/sentry.dart';
 
+import '../../sentry_flutter.dart';
 import '../sentry_flutter_options.dart';
 import '../native/sentry_native.dart';
 import '../event_processor/native_app_start_event_processor.dart';
 
 /// Integration which handles communication with native frameworks in order to
 /// enrich [SentryTransaction] objects with app start data for mobile vitals.
 class NativeAppStartIntegration extends Integration<SentryFlutterOptions> {
-  NativeAppStartIntegration(this._native, this._schedulerBindingProvider);
+  NativeAppStartIntegration(this._native, this._schedulerBindingProvider,
+      {IAppStartTracker? appStartTracker})
+      : _appStartTracker = appStartTracker ?? AppStartTracker();
 
   final SentryNative _native;
   final SchedulerBindingProvider _schedulerBindingProvider;
+  final IAppStartTracker? _appStartTracker;
 
   @override
   void call(Hub hub, SentryFlutterOptions options) {
@@ -21,18 +26,98 @@ class NativeAppStartIntegration extends Integration<SentryFlutterOptions> {
         options.logger(SentryLevel.debug,
             'Scheduler binding is null. Can\'t auto detect app start time.');
       } else {
-        schedulerBinding.addPostFrameCallback((timeStamp) {
+        schedulerBinding.addPostFrameCallback((timeStamp) async {
           // ignore: invalid_use_of_internal_member
-          _native.appStartEnd = options.clock();
+          final appStartEnd = options.clock();
+          _native.appStartEnd = appStartEnd;
+
+          if (!_native.didFetchAppStart) {
+            final nativeAppStart = await _native.fetchNativeAppStart();
+            final measurement = nativeAppStart?.toMeasurement(appStartEnd!);
+
+            // We filter out app start more than 60s.
+            // This could be due to many different reasons.
+            // If you do the manual init and init the SDK too late and it does not
+            // compute the app start end in the very first Screen.
+            // If the process starts but the App isn't in the foreground.
+            // If the system forked the process earlier to accelerate the app start.
+            // And some unknown reasons that could not be reproduced.
+            // We've seen app starts with hours, days and even months.
+            if (nativeAppStart == null ||
+                measurement == null ||
+                measurement.value >= 60000) {
+              _appStartTracker?.setAppStartInfo(null);
+              return;
+            }
+
+            final appStartInfo = AppStartInfo(
+              DateTime.fromMillisecondsSinceEpoch(
+                  nativeAppStart.appStartTime.toInt()),
+              appStartEnd,
+              measurement,
+            );
+
+            _appStartTracker?.setAppStartInfo(appStartInfo);
+          } else {
+            _appStartTracker?.setAppStartInfo(null);
+          }
         });
       }
     }
 
-    options.addEventProcessor(NativeAppStartEventProcessor(_native));
+    options.addEventProcessor(NativeAppStartEventProcessor(appStartTracker: _appStartTracker));
 
     options.sdk.addIntegration('nativeAppStartIntegration');
   }
 }
 
 /// Used to provide scheduler binding at call time.
 typedef SchedulerBindingProvider = SchedulerBinding? Function();
+
+@internal
+class AppStartInfo {
+  final DateTime start;
+  final DateTime end;
+  final SentryMeasurement measurement;
+
+  AppStartInfo(this.start, this.end, this.measurement);
+}
+
+abstract class IAppStartTracker {
+  AppStartInfo? get appStartInfo;
+
+  void setAppStartInfo(AppStartInfo? appStartInfo);
+
+  void onAppStartComplete(Function(AppStartInfo?) callback);
+}
+
+@internal
+class AppStartTracker extends IAppStartTracker {
+  static final AppStartTracker _instance = AppStartTracker._internal();
+
+  factory AppStartTracker() => _instance;
+
+  AppStartInfo? _appStartInfo;
+
+  @override
+  AppStartInfo? get appStartInfo => _appStartInfo;
+  Function(AppStartInfo?)? _callback;
+
+  AppStartTracker._internal();
+
+  @override
+  void setAppStartInfo(AppStartInfo? appStartInfo) {
+    _appStartInfo = appStartInfo;
+    _notifyObserver();
+  }
+
+  @override
+  void onAppStartComplete(Function(AppStartInfo?) callback) {
+    _callback = callback;
+    _callback?.call(_appStartInfo);
+  }
+
+  void _notifyObserver() {
+    _callback?.call(_appStartInfo);
+  }
+}