Introduction
Flutter recently announced its 2.0 release in an event titled “Flutter Engage,” marking another milestone on the rapid development of the cross-platform UI toolkit and bringing along a slew of changes and announcements. This event was the culmination of the “30 Days of Flutter” initiative, introducing Flutter to new audiences with the team and community coming together to achieve it.
Let’s take a look at what was announced at the event.
What’s new in Flutter 2.0?
Null safety
Null safety has been a major sticking point for many developers trying to shift to Dart over languages like Kotlin. Null safety introduces types which cannot be null, allowing the compiler to know that some variables are not null and avoid unnecessary null checks.
At the same time, it also helps developers avoid problems ahead of time because the code simply won’t compile if something isn’t handled properly. Null safety has been in testing for some time now and the entire framework has been shifted to work with null safety in a backward-compatible way.
One concern that people had ahead of time was how existing packages would work with null safety. Currently, major packages have already shifted or are planning to shift to null safety.
However, many remain in the non-null-safe versions. When an app uses a package that does not use null safety, the app runs in the unsound null safety mode — and sound null safety when all dependencies have been migrated to null safety.
int i = 5; // i is now non nullable int? j; // Nullable variables need to be explicitly declared i = null; // Error
Null safety also allows the size of the code to be shrunk because extra checks can be removed. An interesting thing here is that the Dart language did not choose to go to 3.0 with sound null safety and instead stayed in the 2.x version because null safety did not bring along breaking changes to existing code, which is quite impressive given the amount of change in the code.
Web reaches stable
(Folio: A project by the gskinner team shown at Flutter Engage)
After being announced as Project Hummingbird” at the Flutter 1.0 launch event, Flutter Web was something that caused quite a lot of excitement because Flutter could now reach the three major platforms: Android, iOS and web. After a year and a half and multiple approaches to rendering, Flutter Web is finally stable after continuing to improve on performance.
Flutter coming to the web had several obstacles at first: First, the widgets needed to be created to make an immersive, responsive web experience. Additionally, functionality such as hover needed to be implemented, enabling websites to not just look like a large mobile app. Finally, because Dart itself was originally meant as a replacement for JavaScript, the dart2js compiler was already widely used. However, the web itself is a tricky platform to deal with.
A natural benefit of the Flutter Web announcement is the creation of Progressive Web Apps (PWAs). PWAs allow a website to have app-like behaviour on mobile while still retaining a lot of the freedoms that come with the web. Because the Flutter code is already optimized to deal with mobile-sized layouts, PWAs become incredibly easy to create with existing code.
With Web becoming stable, more and more packages continue to add support making web support feel more complete.
Desktop (sort of) reaches stable
Flutter is now available on Desktop (MacOS, Windows, Linux) on stable. However, this is an early release meant to preview apps meant to run on desktop. The final stable version is going to come along in due time. Similar to Flutter Web, desktop required a whole new category of widgets and input mechanics.
Learn more →The surprising thing about Flutter Desktop is that for a long time, the community was the driving force into developing desktop until Flutter officially took over development. Now, it is nearly available for stable release.
One relatively new surprise was that Canonical — the creator of Ubuntu — was contributing to Flutter. This was explained later with another post: Flutter is the default choice for future apps made for Ubuntu.
Not only this, but the Ubuntu installer itself was converted to Flutter:
You can check out the Ubuntu desktop installer repository here.
Toyota and Flutter join forces
Toyota announced it would be building its new infotainment platforms with Flutter, opening up several positions in its Flutter team as well. With companies like Toyota joining the Flutter ecosystem, it goes to show that Flutter is slowly turning into a mature, trusted framework.
Additional improvements to Flutter 2.0
Here are some additional improvements to Flutter with 2.0 now released:
Dart DevTools have been revamped to offer better features while debugging.
- The
dart fixcommand allows removing deprecated code with its correct implementation ScaffoldMessengerfinally comes to master, allowing elements like Snackbars to persist across screens
Looking ahead
Flutter now has more stars on GitHub than competing frameworks like React Native. While not even close to a perfect metric, it does display how quickly Flutter managed to grow in popularity within the mobile app development (and now more) sphere.
Personally, it’s amazing to see how much and how quickly things have grown. The first time I remember using Dart was with Chromium back in 2013-2014 to make a pirate badge — with things stalling a bit since then.
A few years later, I started out with the alpha of Flutter and the entire ecosystem including the framework itself, the Dart language, and toolkit. The Flutter community has been expanding and improving to an amazing extent.
Flutter 2.0 shows how Flutter is spreading across platforms to realize its run-everywhere potential, as well proves that it’s stable, with larger corporations now getting onboard.
If you wish to see the full, (VERY) detailed list of changes, this is the place to go.
LogRocket: Full visibility into your web and mobile apps
LogRocket is a frontend application monitoring solution that lets you replay problems as if they happened in your own browser. Instead of guessing why errors happen, or asking users for screenshots and log dumps, LogRocket lets you replay the session to quickly understand what went wrong. It works perfectly with any app, regardless of framework, and has plugins to log additional context from Redux, Vuex, and @ngrx/store.
In addition to logging Redux actions and state, LogRocket records console logs, JavaScript errors, stacktraces, network requests/responses with headers + bodies, browser metadata, and custom logs. It also instruments the DOM to record the HTML and CSS on the page, recreating pixel-perfect videos of even the most complex single-page and mobile apps.
More great articles from LogRocket:
- Don't miss a moment with The Replay, a curated newsletter from LogRocket
- Learn how LogRocket's Galileo cuts through the noise to proactively resolve issues in your app
- Use React's useEffect to optimize your application's performance
- Switch between multiple versions of Node
- Discover how to animate your React app with AnimXYZ
- Explore Tauri, a new framework for building binaries
- Compare NestJS vs. Express.js
