Wie im letzten Blogpost zum Thema Flutter bereits erwähnt, arbeiten die Entwickler von Flutter mit Hochdruck daran, das Framework auch für Webentwicklung bereitzustellen.
Aus Projekt Hummingbird wurde Flutter Web, welches sich momentan in der Beta Phase befindet. Ziel von Flutter Web ist es, mit einer Codebasis nicht nur Android und iOS zu bedienen, sondern auch den Browser.
Auch wenn man den Code für Android/iOS zu 100% für Web wiederverwenden könnte, wird höchstwahrscheinlich für Flutter Web eigens Code geschrieben werden müssen. Eine Webanwendung hat einfach ein ganz anderes Look-and-Feel als eine mobile Anwendung. Nichtsdestotrotz kann man State und Logik bei einer sauberen Trennung wiederverwenden.
Wie funktioniert Flutter Web?
Grundsätzlich ist Dart als eine Web Programmiersprache entworfen und entwickelt worden, wodurch sie bereits vor Flutter im Web zum Einsatz gekommen ist. Da der Browser keinen Dart Code ausführen kann, wird dieser mit dem von Google entwickelten Dart2js Compiler in Javascript übersetzt. Der zu Javascript verwandelte Flutter Code erzeugt nun HTML Elemente, welche im Browser dargestellt werden.
Leider kommt es hier noch zu Performance Problemen, wodurch eine Flutter Web App öfters leicht ruckelt und nicht ganz so flüssig zu bedienen ist. Google hat hierfür aber bereits eine Alternative. Es ist möglich eine Flutter Web Anwendung mit der eigenen Render Engine Skia auszuliefern.
Diese läuft im Browser mit Hilfe von WebAssembly und anstelle von HTML Elementen wird ein großes Canvas erzeugt, worauf Skia die Elemente rendert. Dies läuft wesentlich flüssiger als die andere Variante. Um Accessibility zu gewährleisten, wird intern ein sogenannter Accessibility-Tree aufgebaut, welcher mit aktuell verfügbaren Screenreadern kompatibel ist.
Natürlich ist die Bedienung einer Web Anwendung grundlegend anders als die einer mobilen Anwendung. Deshalb arbeitet Google mit Hochdruck daran, die bestehenden UI-Komponenten so zu überarbeiten, dass diese auch mit der gewohnten Maus-Interaktion verwendet werden können, welche sich ja signifikant von der Touch-Eingabe auf mobilen Geräten unterscheidet. Hier ist bereits ein Großteil erledigt.
Plugins, die beispielsweise native Funktionen auf Smartphones ausführen, müssen, um im Web auch zu funktionieren, upgedated werden. Google geht hier mit gutem Beispiel voran und arbeitet am Web-Support für etliche Plugins, wie zum Beispiel das gesamte Firebase Umfeld.
Ausblick in die Zukunft
Flutter Web befindet sich zwar noch in der Beta Phase, funktioniert jedoch bereits ganz gut. Für einen Produktivbetrieb sollte man eventuell trotzdem noch ein paar Monate warten, da es hier und da noch kleinere Bugs gibt. Google's Plan ist es, im laufenden Jahr mit Flutter Web produktionsreif zu werden.
Spannend auch - der Support für Desktop Anwendungen. Hier befindet sich MacOS bereits in der Beta Phase, Windows und Linux befinden sich beide noch in der Alpha Phase.
Sie wollen mehr über App Entwicklung erfahren?
Mit individueller App Entwicklung zu einzigartiger User Experience!
