Did you know?
Apps created with Flutter 3.22 use a new, faster web bootstrap process.
The easiest way to upgrade your existing apps is to delete the web folder and recreate it again with the Flutter CLI:
rm -rf web/
flutter create . --platforms web
The updated index.html file contains a new script that loads flutter_bootstrap.js:
<!DOCTYPE html>
<html>
<head>
<base href="$FLUTTER_BASE_HREF">
...
</head>
<body>
<script src="flutter_bootstrap.js" async></script>
</body>
</html>
Note: if you recreate the Flutter web project from scratch, remember to update your
index.html, icons, and manifest files with whatever customizations you had before.
Adding a CSS loader
The new bootstrap process is quite customizable, and you can even display a CSS progress indicator before the Flutter app is ready to take over:
This gist shows how to accomplish this:
Read the official docs for all the details about the new app initialization process:
Happy coding!
