Best of both worlds

Flutter: A beautiful mix of React and Dart for mobile SDK

Jane Elizabeth
Flutter
© Shutterstock / ZoomTravels

This new open-source mobile app SDK from Google allows developers and designers to create modern mobile apps for iOS and Android. Written in Dart, this SDK takes the best from React to help developers build beautiful, cross-platform mobile apps.

Google’s new mobile UI framework has landed. Flutter is an open-source mobile app SDK that comes with its own framework, widgets, and tools. Google hopes that Flutter will make it easier and more efficient for developers to build and deploy “beautiful mobile apps” on all platforms, from Android to iOS and even Google’s Fuschia.

What’s in Flutter?

According to their page, a lot! While Flutter is still in the development phase, what they have is certainly impressive:

  • Heavily optimized, mobile-first 2D rendering engine with excellent support for text
  • Functional-reactive framework
  • Rich set of widgets for Android and iOS
  • APIs for unit and integration tests
  • Interop and plugin APIs to connect to the system and 3rd-party SDKs
  • Headless test runner for running tests on Windows, Linux, and Mac
  • Command-line tools for creating, building, testing, and compiling your apps

SEE MORE: Flutter: Google’s new cross-platform mobile framework

Modern elegance

Flutter has been flitting around for some time. The idea behind Flutter came to some curious Google engineers a couple of years ago. According to their site:

Back in 2014, some engineers in Google took a step back to ask, “What would a modern mobi-first rendering engine look like?” Without worrying about backward compatibility, or desktop concerns, or legacy constraints, they started coding a new engine named Sky. Encouraged by some of their initial performance measurements, they decided to make the experiment a real project and renamed it Flutter. In 2015, internal teams inside of Google started to take notice and began building apps on Flutter, and the flutter.io site was born.

Flutter’s guiding principles are simple. They focused on:

  • Control– Developers deserve access to, and control over, all layers of the system. Which leads to:
  • Performance– Users deserve perfectly fluid, responsive, jank-free apps. Which leads to:
  • Fidelity– Everyone deserves precise, beautiful, delightful mobile app experiences.

Sounds simple, right? But how do they do it?

React + Dart = Flutter

Flutter is a mixture of the best of React and Dart. Dart is a modern, static-type programming language that can be compiled to JavaScript or to run on mobile phones. It’s an elegant, full stack language. It’s not a surprise that Google’s releasing a mobile SDK in its own language.

So, what did Flutter take from React? While Flutter’s architecture was very clearly inspired by React, it still runs on the “write once, run anywhere” model. Besides, React (or Angular, for that matter) does not have its own built-in UI widget library. Flutter’s approach to widgets was a wholly new approach.

SEE MORE: The dead live longer: 5 arguments for the success of Dart

Flutter does something completely different. Flutter does not run JavaScript or HTML apps as a mobile native app, nor does it create separate native apps for Android and iOS. According to David Ford, a Kotlin software trainer:

Flutter reinvents its own UI component library from scratch. These components are drawn using the platforms low-level graphics primitives. Thus, Flutter’s UI components are not html elements, nor are they native Android/iOS widgets. They are Flutter widgets. They have a pluggable look-and-feel. So they can look like iOS native widgets or Android native widgets.

In addition, Flutter is different because it implements most of its system in Dart. UI’s are coded in the same language as the rest of the app, keeping it simple and lowering the chance for errors.

 

If you’re interested in Flutter, you should head on over to their site or GitHub page. Flutter is still in its development phase and any help is welcome!

Author
Jane Elizabeth
Jane Elizabeth is an assistant editor for JAXenter.com

Comments
comments powered by Disqus