Repository navigation
[web] flutter-first-frame fires before the first SkWasm frame is presented #189499
Description
Steps to reproduce
- Create a Flutter web app that keeps an HTML splash visible until the
flutter-first-framebrowser event. - Build it with
flutter build web --release --wasm --no-web-resources-cdn. - Serve it with the COOP/COEP headers required by threaded SkWasm.
- In the Dart entrypoint, delay
runAppso the transition is easy to record:
import 'package:flutter/material.dart';
Future<void> main() async {
WidgetsFlutterBinding.ensureInitialized();
await Future<void>.delayed(const Duration(milliseconds: 1500));
runApp(
const MaterialApp(
home: ColoredBox(
color: Color(0xffc7ff00),
child: Center(child: Text('FIRST APP FRAME')),
),
),
);
}- Remove a contrasting HTML splash when the event fires:
<div id="splash">HTML SPLASH</div>
<script>
window.addEventListener('flutter-first-frame', () => {
document.getElementById('splash')?.remove();
}, { once: true });
</script>Expected result
The event is dispatched only after the renderer has completed the first scene,
so removing the HTML splash reveals the first Flutter frame without an
intermediate blank frame.
Actual result
With Wasm/SkWasm, the framework sends the flutter/service_worker platform
message from a post-frame callback, but the web engine immediately dispatches
flutter-first-frame while renderer.renderScene(...) is still running.
Removing the splash therefore exposes the page background before SkWasm has
finished rasterizing.
Chrome compositor screencasts of the minimal reproduction produced the same
sequence in three cold runs:
| Run | Blank frame after event | First visible Flutter frame |
|---|---|---|
| 1 | +11.3 ms | +143.0 ms |
| 2 | +7.8 ms | +90.3 ms |
| 3 | +7.1 ms | +117.3 ms |
The dart2js/CanvasKit build did not produce the intermediate blank compositor
frame in the same test. The current master implementation still dispatches
the DOM event synchronously in EnginePlatformDispatcher.
This is related to the original service-worker event work in #66066 and the
first-frame hook proposal in #133454, but neither tracks the renderer-completion
race in the Wasm/SkWasm path.
Environment
Flutter 3.41.2 (stable)
Framework revision 90673a4eef
Engine revision 6c0baaebf7
Dart 3.11.0
macOS arm64, Chrome
The same synchronous event dispatch is present at current master
(fc1ad955f16467c959e3cd8079b760d5af0984aa).
Activity
mbcorona commentedon Jul 16, 2026
Hi @Yusufihsangorgel , thanks for the detailed report, Routing to the webteam to evaluate the issue and Pr linked #189500
Yusufihsangorgel commentedon Jul 16, 2026
Hi, Thanks.
Wait for web rendering before first-frame event (flutter#189500)
github-actions commentedon Aug 25, 2026
This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of
flutter doctor -vand a minimal reproduction of the issue.