The release of hummingbird project has brought the flutter team one step closer to achieving the “write once, run anywhere” dream.
Before we get into the details of Hummingbird project, how about quick recap on flutter?
Flutter is Google’s cross platform framework to develop mobile apps that look and act the same in Android and iOS. Flutter app development has successfully bridged the gap between the two platforms.
What is Flutter Hummingbird then?
The release of Flutter 1.5 changed the image that Flutter is only for mobile apps. Project Hummingbird is another version of Flutter that will help developers build web apps with ease. From the very beginning, Google team intended it to be a portable UI toolkit instead of just a mobile UI toolkit.
Building Flutter for the web is a code compatible implementation of Flutter which is rendered using standards - based web technologies like HTML, CSS and JavaScript. With flutter for web you can compile the existing flutter code written in Dart into an interactive and graphically rich content that can be embedded in a browser and deployed to any web server.
You can use all the features of core flutter and you don’t need a browser plug-in for any of it.
Let’s tell you a bit about Flutter’s architecture first to help you understand how the latest improvements in framework will change the development process for good!
Flutter is a multi layered system in a way that higher layers are easier to use and allow you to display a lot with little code whereas the lower layers give you more control but with a little complications.
When the higher layers don’t allow developers to make the changes they want, they can drop to the lower layers. Developers have access to all layers that are above the Flutter engine. Flutter engine is exposed as lowest level library in Flutter, dart:ui. It doesn’t know anything about widgets, physics, layout or animation. All it knows is to compose pictures on screen and convert them into pixels. It would be hard to directly write applications on top of dart:ui which is why higher layers were created.
Everything above dart:ui is what the team calls “the framework” and everything below it is “the engine”.
While the framework is written using the Dart language, most of the engine is written in C++ with Android specific parts in Java and iOS specific parts in Objective C. Some basic classes and functions in dart:ui are written in Dart and mostly act as bridges between Dart and C++.
Before we go any further, it is important to tell you that the project is in very early stages of development. So, here are a few facts about hummingbird performance in the current situation. Web still doesn’t support the plugins, performance might be slow at times, not all Flutter APIs are supported and full desktop interaction is not complete.
Even though Flutter is in early stages of development, the Google team believes that Flutter web will prove to be valuable in many situations. For instance,
A connected progressive web application developed with Flutter - Web support for flutter enables the existing mobile applications to be packaged as a PWA for expanding to a larger variety of devices or to provide a companion web experience to an existing application.
Embedded interactive content - Flutter provides a powerful environment to create rich, data centric components that can easily be hosted in an existing web page. Whether its for data visualization, an online tool like car configurator or an embedded chart, it can provide a productive development approach for embedded web content.
Embedding dynamic content in a Flutter mobile app - A sure way to provide dynamic content updates in an existing mobile application is the use of web view control, that can load and display information dynamically. The support that flutter now offers for a unified environment for web and mobile content helps you deploy content online or embedded in an app without having to rewrite.
Developing Flutter web gave the team an interesting challenge of replacing the existing Flutter engine as it was not compatible with compiling to web. Hence, a modified version of the engine called “flutter web” was born. As the project becomes stable it will be merged back to the main Flutter repo.
Since only the engine and layers under the framework need to be changed and re-implemented, core Flutter API almost remains unchanged so it is entirely possible to port the UI from your Android/iOS flutter app to web.
Flutter Web in a Nutshell for You!
As mentioned earlier, flutter web is still under development so there are a lot of things missing. However, it seems surprisingly easy to get started and working with flutter web. Hire Flutter developers to get started with your web development project in Flutter. It is clear that the Google team is trying its best to make Flutter the best way to develop all kinds of apps right from Android and iOS to web and IoT.
It can be rightly said that with its revolutionary approach to technology and the corporate strategy of its original author and backer, Flutter has everything to become the next big thing!
Sagar Bagsariya
Principal Mobile App Developer
by Jigar Shah
by Sanjay kidecha
by Manav Patel
