Summary
In lib/shared/widgets/app_dialog.dart, _BlurredDialogScaffold implements the dialog backdrop transition by wrapping a BackdropFilter inside an Opacity widget driven by AnimatedBuilder (curved.value):
child: AnimatedBuilder(
animation: curved,
child: ClipRect(
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 8, sigmaY: 8),
child: const ColoredBox(
color: Color(0x52000000), // black @ 0.32
),
),
),
builder: (ctx, child) {
return Opacity(
opacity: curved.value.clamp(0.0, 1.0),
child: child,
);
},
),In Flutter rendering (Skia and Impeller), placing an Opacity widget over an active BackdropFilter requires the compositor to create offscreen layers (saveLayer) with full-screen alpha compositing on every single animation frame. This creates noticeable frame drops (raster jank) whenever modals or connection dialogs open/close on desktop platforms (Linux X11/Wayland and macOS).
Scope
• Eliminate the Opacity widget enclosing the BackdropFilter.
• Animate the barrier tint color alpha directly (e.g. Color(0x52000000).withValues(alpha: curved.value * 0.32)) or animate blur sigma if needed, without triggering offscreen saveLayer passes.
• Ensure the blur appears smoothly without pop-in while keeping enter/exit transitions within the 8.3ms frame budget @ 120 Hz.
Out of scope
• Dialog card slide/fade animation (FadeTransition on the dialog card itself is lightweight and does not wrap backdrop filters).
Summary
In
lib/shared/widgets/app_dialog.dart,_BlurredDialogScaffoldimplements the dialog backdrop transition by wrapping aBackdropFilterinside anOpacitywidget driven byAnimatedBuilder(curved.value):In Flutter rendering (Skia and Impeller), placing an
Opacitywidget over an activeBackdropFilterrequires the compositor to create offscreen layers (saveLayer) with full-screen alpha compositing on every single animation frame. This creates noticeable frame drops (raster jank) whenever modals or connection dialogs open/close on desktop platforms (Linux X11/Wayland and macOS).Scope
• Eliminate the
Opacitywidget enclosing theBackdropFilter.• Animate the barrier tint color alpha directly (e.g.
Color(0x52000000).withValues(alpha: curved.value * 0.32)) or animate blur sigma if needed, without triggering offscreensaveLayerpasses.• Ensure the blur appears smoothly without pop-in while keeping enter/exit transitions within the 8.3ms frame budget @ 120 Hz.
Out of scope
• Dialog card slide/fade animation (
FadeTransitionon the dialog card itself is lightweight and does not wrap backdrop filters).