Google Announces Flutter – Mobile UI Framework

This year’s Barcelona Mobile World Conference comes with a big announcement from Google: Flutter, the open-source mobile UI framework released in May 2017, is out of alpha.

The framework allows developers to build native interfaces for both Android and iOS. Flutter brings together the best of two worlds, performance and platform integrations of native mobile with the rapid development and multi-platform reach of portable UI toolkits. Plus, it’s built with Dart!

According to Google, developers building mobile apps will enjoy Flutter for a number of reasons:

Speedy development based on features such as stateful Hot Reload, a new reactive framework, a flexible widget set and out-of-the-box tooling.

Flexible designs with rich animation libraries on a multi-layer and extensible architecture.

From Alpha to Beta

Google invested a lot of time on polishing the library. Flutter features a screen reader and accessibility support, RTL text, localization and internationalization, inline video, support for additional image formats, background code execution and more. The team also implemented support for Android Studio, Visual Studio Code and iOS 11, a widget inspector and more. Google also improved one killer feature: stateful hot reloads.

Is Flutter Really That Good?

But how can Flutter deliver across the two different platforms? Flutter apps don’t directly compile to native Android and iOS apps. Instead, they run on the Flutter rendering engine and Flutter Framework. Both the rendering engine and the framework are bundled with every app. Depending on the platform, the library will deliver the platform-specific package.

But nobody likes bloated code! Yes, you’ll get an additional 6.7MB on Android for example, but Google claims that the speed benefit that comes with Flutter is worth it. Have a look at Google’s AdWords app. It’s fast. Or check out Hamilton, another popular app built with Flutter.

Ok, but what about the two different design languages for Android and iOS? Flutter’s built-in UI widgets, “Material Design” and “Cupertino,” will deliver apps that look natively on both platforms. Flutter will change buttons, animations, sliders, switches, dialog boxes, loading spinners and more to fit the platform where your app runs.

But React Native is cool! Of course, however, unlike React, Flutter uses its own GPU-accelerated graphics and rendering engine, so, instead of relying on webview, designer and developers can work on the actual prototype in a consistent workflow.

What about stateful hot reloads? The most anticipated feature, stateful hot reloads will help developers speed up the development process. Push your code changes to the app, and you’ll immediately see the changes in the live emulator. The built-in just-for-development compiler does the trick. This means that, while complete packages get compiled Ahead of Time, for development there’s a fast Just in Time compiler.

But it’s beta software! Yep, it’s beta. However, Google is developing its latest OS, Fuchsia, with Flutter. Furthermore, Flutter plays well with most popular IDEs such as Android Studio, Visual Studio Code, IntelliJ or XCode, as well as more than 1,000 packages like Firebase or Facebook Connect.

Get Started with Flutter

It’s not clear when Flutter will get out of beta, but Google did note that new betas will be continuously delivered. Even in beta, Flutter is suitable for many production scenarios. It’s safe to assume that the first stable version will be launched in May, ahead of this year’s Google I/O Conference. But you shouldn’t wait until then!

Of course, developers should keep an eye on the GitHub page and issue tracker. Newcomers should definitely have a look at the Getting Started guide for more information. There are also community-built themes for Flutter that you can download and try out.

But React Native is cool! Of course, however, unlike React, Flutter uses its own GPU-accelerated graphics and rendering engine, so, instead of relying on webview, designer and developers can work on the actual prototype in a consistent workflow.

The statement that React Native is relying on webview is wrong. React Native communicates with the native ui libraries using the JavaScript engine JavaScriptCore.