What a month this has been for Flutter!
With the release of Flutter 3.10 and Dart 3.0 during Google I/O, there’s a lot to cover.
And in addition to all the official announcements, there are some exciting community updates too.
So read on to get my full recap!
Flutter 3.10 is a big release, bringing many graphics, security, and performance improvements to all supported platforms.
And performance-wise, Impeller is now production-ready on iOS, and great strides have been made to improve the app startup time on Flutter web.
For all the details, check out the official announcement:
Dart 3 is the largest Dart release to date, bringing major new language features such as records, patterns, and class modifiers.
Dart 3 also marks the completion of the journey to 100% sound null safety.
Some additional language features are coming, too, along with work on many other fronts, including Dart to WASM compilation (more on this below).
For a good overview, read the official announcement:
And if you want to learn more about the new language features, the official docs will help you get started:
- Dart 3 migration guide
- Records, Patterns, and Class modifiers
- Dive into Dart's patterns and records (codelab)
For a great overview of what’s new in Dart and Flutter, don’t miss this video:
This covers all the most important stuff, along with these additional topics:
- Fragment shaders on web
- Wide gamut images on iOS
- Dart & JS interoperability
- Dev tools improvements
- Preliminary WASM support
And if you’re focusing your efforts on iOS or Windows, there are more goodies for you. 👇
The iOS platform received a lot of attention in the latest release.
As a result, you can now debug your iOS apps over Wi-Fi, and the official docs include many new and updated guides for iOS:
- Learning Dart as a Swift developer
- Flutter for SwiftUI Developers
- Integrate a Flutter module into your iOS project
- Creating flavors for Flutter
- Adding iOS app extensions
For all the details, check this blog post:
If you’re using Flutter to build desktop apps, you can’t ignore the fact that Microsoft Windows is the leading OS (with a 63% market share).
And if you look on pub.dev, you can find Dart | Windows, a growing suite of packages that helps you do more with the Windows APIs.
For a good introduction to this topic, check out this article and the additional resources by the Flutter team:
The Flutter team published an entire playlist as part of Google I/O, covering the most important advancements:
And on the Google I/O website, you can find all the new technical sessions and codelabs:
Here are my top picks. 👇
Since Flutter web was first announced, the number of web apps powered by Flutter has continued to rise.
But to this day, creating Flutter web apps that load fast and run smoothly is still a big challenge, and much work needs to be done before Flutter can bridge the gap with regular web apps.
The good news is that with the latest 3.10 release, the Flutter team reduced the size of CanvasKit and the fonts that are loaded during app startup, resulting in a 40% faster load time.
Support for element embedding has also been improved, making it easier to integrate a Flutter app into any HTML element.
Beyond that, preliminary support for WebAssembly has been announced, and it’s now possible to run Flutter shaders on the web.
This video covers all the details:
If you’re using Flutter on the web, there are things you can do to improve the user’s experience on app startup. For example, you may want to display a (CSS-based) progress indicator until the main Flutter app is loaded. And this updated guide shows you how: Customizing web app initialization
If you have ever wondered how Flutter transforms widgets into pixels that can be rendered on the GPU, you need to learn how its rendering engine works.
And this video offers a great overview of how Impeller works and how it delivers great performance by eliminating shader compilation jank and reducing the app startup time:
Writing custom shaders is your best bet if you want to create custom graphics effects that can’t be achieved with regular widgets and custom painters alone.
And in this new video, Craig Labenz takes you through all the required steps:
And if you want, you can follow all the steps in the video with this new codelab:
We’ve covered a lot already, but we’re not done yet, and I have a few more resources to share. 👇
If you want your app to provide a great user experience, there are many things to consider, including performance, app size, responsiveness, memory, CPU & network data usage, and much more.
And to measure all these metrics, you can use a powerful suite of tools known as the DevTools.
The official docs already cover the basics. But if you want to become a pro with the DevTools, don’t miss this 8-part series by Ashita Prasad:
The folks at Invertase have been working on Dart Edge, a new project aimed at running Dart code on Edge functions using Supabase.
If you want to take Supabase for a spin as a Dart backend, check this out:
Adding an animated splash screen to your Flutter app is a great way to wow your users and leave a good first impression.
And in this video, Randal Schwartz shows a cool little trick that uses animations and future completers. Very neat!
And if you want add a native splash screen to your Flutter app, check out this package:
The new language features in Dart 3 have received a lot of praise, and the community has already contributed with some good articles.
If you wanna dive deeper, check them out:
- Records and Pattern Matching in dart - Complete Guide
- An introduction to Records and Pattern Matching in Dart & Flutter
If your Flutter app talks to a backend or some server-side APIs, you’ll want to have a good separation of concerns between the UI code and your data-access layer.
To do this, you can use the repository pattern and some other abstractions.
But while some abstractions can make your code more testable, scalable, and maintainable, others are overkill and can do more harm than good.
And in this article, I cover all the details:
Having played with the new Dart 3 features over the last week, I couldn’t resist writing about them.
So I’ve decided to write a new series of articles showing how to use each feature in detail, along with examples and practical use cases you may encounter in the real world.
And here’s the first one:
As soon as Flutter 3.10 was released, I got to work and updated my Flutter Foundations course to the latest APIs and packages.
To celebrate this, I’m offering a 25% discount, which will be valid for a limited time until the 26th of May.
If you want to take advantage of this, check it out here:
Back in my early days as an iOS developer, I always viewed new releases with a mix of excitement and apprehension, wondering how much of my code was going to break. 😱
But since I switched to Flutter, my worries are gone and I’m thankful that upgrading old projects is mostly a case of running
dart fix --apply. 😀
Moreover, some official packages are also making automatic migrations easier, and I hope this trend will continue. So I’m very grateful that the Flutter team goes to great lengths to make our life easier. 🙂
And I hope you feel that way too. 😉