Google’s Flutter = React + Java Swing

Google has recently announced its new mobile UI framework called Flutter. It allows you to create native-ish mobile apps that run on Android, iOS and Google’s new Fuchsia operating system.

Even if you have no desire to jump into something so bleeding edge, there are still a few things in Flutter that I find very interesting and worth sharing.

1. Its architecture is almost exactly the same as React. It’s not like Angular or Polymer (Google’s own web frameworks). It’s like React. Flutter is a complete rip-off of React. And since I love React, I consider that a good thing.
2. Flutter is based on Dart, a modern beautiful programming language (by Google) that is very easy to learn if you already know Java or JavaScript. Dart has optional static type checking. Also Dart can compile to JavaScript. In fact, Dart was originally designed as a compile-to-JavaScript language. And there is a Dart VM. So you can use Dart for server-side apps and command-line utilities (just like Node). And, of course, Dart can be compiled to run on mobile phones (that is what Flutter is for). This puts Dart in competition with other 2nd generation “full stack” languages like Kotlin.
3. What does Flutter, Polymer, GWT and Adobe Flex have that React does not. Answer: a built-in UI widget library.
   This, for me, is a big deal. React and Angular take the approach that the UI widget library should come from the 3rd party ecosystem. This, in my opinion, is the number one thing that sucks about React. Here is a typical day working in React: You need a particular widget, say, an infinite scroll widget. You search the web to find that there are eight to choose from. All kind of crappy. Created as someone’s side project. Each has 7 github stars, crappy docs and zero StackOverflow support.
   If you have ever worked with something like Flex, that comes with a high-quality, stock set of components you know how wonderful it is.
4. Flutter’s approach to cross-platform UI is unique. Flutter is not like Cordova or PhoneGap which are essentially JavaScript/HTML/CSS apps disguised as mobile native apps. Cordova and PhoneGap apps run in a mobile browser wrapped in a native component (a web view). These are launched like native apps but at heart are web apps. They do not use mobile-native widgets. Instead they use the familiar web elements (<input>, <select>, etc.) to build the UI.
   Flutter is not like React Native (or NativeScript) either. React Native uses native widgets. This means you have to create separate apps for Android and iOS. It also means the app looks and behaves more native-like than, say, a Cordova or PhoneGap.
   Flutter is a 3rd thing. It 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. This is basically the exact same approach as JavaSwing.
5. There are no external UI DSLs (i.e. html or xml files). The entire UI is written in Dart. This, for me, is a big win. I have an odd-ball opinion that external DSL’s are the root of all evil. They drastically reduce the amount of help that a static type checker (or IDE) can provide for you. They kill refactoring and code reuse. This is one of the reasons I love React.
   With Flutter, UI’s are coded in the same language as the rest of the app: Dart. Also, there is no JSX equivalent in Flutter. So when I say that Flutter is like React, what I mean is that Flutter is like React without JSX. While JSX-less code is pretty ugly in React/JavaScript, it is quite elegant in Flutter/Dart.
6. Finally, they have first class support for my favorite IDE (JetBrains).

So, in short, Flutter seems to have all of the Dave checkboxes:

1. Modern language
2. React-like UI architecture
3. A rich, built-in UI widget library
4. No external UI DSL required.
5. JetBrains support

I am a huge React fan. I love React. But there are two things that suck about React in my opinion (warning: controversial statements coming up):

1. The lack of an officially-sanctioned, stock set of UI components.
2. JavaScript

Flutter addresses both of these points and then some. Definitely something to keep your eye on.

Dave Ford is a developer, trainer and consultant specializing in Java, JavaScript, Kotlin and React. He is the author of Kotlin Quick Start for Java Developers, an online course published on Udemy. He offers instructor-led React and Kotlin training through his training company, Smart Soft.

✉️ Subscribe to Codeburst’s once-weekly Email Blast, 🐦 Follow Codeburst on Twitter, and 🕸️ Learn Full Stack Web Development.