Recapping all the major updates for Google's Flutter conference. Catch up on all of the talks here.

This year, I had the opportunity to host a viewing party for Flutter Interact in Charlotte, NC. For the uninitiated, Flutter Interact is a one day, single-track conference focused on creation and collaboration using the Flutter framework.

From the day of talks, I wanted to highlight some of the major updates announced as well as my own commentary.

Just a few of the folks who showed up for the Flutter Interact viewing party in Charlotte.

Framework updates

This year's keynote opened up like a Lamar Jackson highlight reel.

Flutter 1.12 is available

iOS 13 dark mode support has been completed. Android support was announced back at Google IO, so it is nice to see the iOS side reach feature parity.

Add-to-App is now officially supported. A big hesitation for Flutter adoption was the lack of official support for brownfield development. Most companies cannot afford to rewrite their existing products from scratch. Official support should go a long way in allaying those fears.

Some other updates include full AndroidX support and an upgraded Flutter Gallery app with the latest examples of new widgets.

Dart 2.7 is available

Now that Dart 2.7 has moved out of preview, developers can now use static extension methods in production without shame. 😊

Static extension methods may seem like a small feature, but they are huge for a couple of reasons. First, they demonstrate a commitment to developing language features with transparency on dart-lang/language. One of my wishlist items from last year was a well-documented RFC process and extension methods are the first addition since that process was announced at Google IO. Second, static extension methods enable users to experiment with extending libraries in a more elegant way. Let's look at the following example:

Text('some text')
  .textColor(Colors.white)
  .bold()
  .alignment(Alignment.center) // aligns text
  .constraints(width: 100, height: 100)
  .backgroundColor(Colors.blue)
  .borderRadius(all: 10)
  .elevation(10)
  .alignment(Alignment.center)

This is arguably a bit more readable and elegant than the existing way of constructing a text widget, and it is very reminiscent of SwiftUI.

Flutter for Web in Beta 🎉

Flutter for Web has been moved to Beta, which is Google's way of saying it's got some flaws but is generally ready for mass consumption. There will be continuing improvements to bundle size, accessibility, routing, and text features. Specifically, I thought that rail navigation was impressive. Basically this feature allows the navigation to adapt to different screen sizes, displaying as a bottom bar in a mobile view and side navigation in a desktop view.

Going beyond the announcement, some of the features in development include improving use cases for Flutter Web like embedding interactive content in existing applications and expanding plugin support for various popular libraries (shared_preferences, firebase, etc.)

At a high-level, being able to build the same high-fidelity apps with a single tech stack has been Flutter's vision at least since Dart Summit 2018. It's nice to see Google continue to iterate towards that goal. They are a long way away from replacing JavaScript as the defacto way to build web apps, but a lot closer than they were when they declared Dart as the future of web development almost 6 years ago. 🕺🕺🕺

Flutter for macOS in Alpha 🥳

I long for a world in which 60% of my computer resources are not split between Slack, Chrome, and VS Code. Electron, once an awesome tool for developing apps, has become somewhat of a burden paid down by the user for the convenience of a developer. There are several community-lead initiatives tackling this issue between React Native and Revery, and each produces more performant cross-platform applications. Still, it's nice to have a company-lead one with a unified vision for all platforms.

Flutter tooling updates

There were some major updates to all of the tooling for Flutter development.

Hot UI: Realtime layout preview & editing

This feature is straight out of the native development playbook. Flutter developers are now capable of previewing and editing design changes in realtime. Flutter's hot reload & hot restart have always eclipsed the performance of their native counterparts, but the framework was lacking the warm fuzzies of being able to preview UI without running the application. Gone are those days, and I'd be willing to bet that Flutter Web has something to do with this feature.

Layout Explorer: Realtime layout debugging

A similar feature to Hot UI but deserving of its own spotlight. The layout explorer allows you to make layout specific changes in realtime that are highlighted and reflected on the device. I cannot count the number of times I've resorted back to stack overflow to fix my overflow issues, so this is a welcome addition.

FlutterOctopus: Multi-session debugging

Being able to debug on multiple devices and platforms in parallel may be your fantasy or your nightmare. Either way, Flutter has you covered with this new feature that allows you to track breakpoints on several devices at once. You can't be a supervillain without at least 10 screens of data streaming simultaneously. 🦹‍♂️🦹‍♂️🦹‍♂️

DartPad adds Flutter support

DartPad now works with Flutter. This was officially announced some time ago, but still included as an announcement in the keynote. This should be great for newcomers or developers who want to experiment with Flutter without the shameful traces of the existence of a non-native, cross-platform toolkit on their computer or in their browser history. I would like to see support for 3rd-party packages, similar to CodeSandbox as it would be great for reproducing package issues in a controlled environment.

Design Tool updates

Supernova is a WYSIWYG design handoff tool that has been under development over the last year. The app now supports Adobe XD and Sketch files and can produce Flutter, iOS, Android and React Native code. Flutter support is free. This will go a long way in simplifying the hand-off process between design and development.

Not to be outdone, Adobe XD now has a plugin to export Flutter code. This is a missing feature that React & React Native has had for a while through tools like Figma and Framer. Now that there has been movement on this front by a major player, I expect competitors to fall in line with similar offerings.

The theme for these design tool updates is that they solidify Flutter's place as a valuable tool for application development.

Google Fonts support

Keeping in line with Google products being first-class citizens in Flutter development, Google Fonts is now fully supported as a 3rd party plugin. This adds another tool to the toolkit of Flutter developers, as adding fonts becomes easier and the library of fonts supported by default becomes expansive.

Conclusion

Is Flutter the next generation of application development? If I had been asked 2 years ago, I would have said no. Far too many concessions needed to be made by developers coming from other platforms. The term "next generation" denotes an evolution over what exists currently, and while Flutter has been that for cross-platform developers for quite a while, it was definitively not for native developers because of the tradeoffs they were forced to make.

Fortunately, building software is about incremental change. Fast-forward to today, and we can start to see the narrative changing as language features, developer tooling, and plugin integration evolve at an exponential rate. Is Flutter the next generation of application development? Maybe not. But if it's not, I am very excited to see what is.