Flutter web, hide splash screen after flutter web loaded


As Flutter web boots up, it may take a few seconds to boot and start to render home page. hence I add an spinner in index.html to indicate to the user everything is normal.

in index.html (I have simplified)

<div class="spinner"></div>

then I need to listen to an event when main.dart.js is completely loaded, to remove the spinner element.
does anyone knows what event I should listen? (I’m talking about javascript events that I can benefit in index.html)
I can’t listen to windows.onload because it fires before flutter boot up.


The event name is flutter-first-frame. add below script in index.html which removes and element with id: spinner (the loading indicator) when flutter framework completely loaded.

 window.addEventListener('flutter-first-frame', function () {
   var el = document.getElementsByClassName('spinner')[0];

read more:

Answered By – Hashem Aboonajmi

Answer Checked By – Katrina (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *