Im Dezember 2018 wurde die erste stabile Version von Flutter veröffentlicht. Nach vier grossen Updates ist das SDK mittlerweile bei Version 1.12 angekommen. Gemäss dem jährlichen Octoverse-Bericht von Github hat sich das von Google koordinierte Open-Source-Projekt im selben Zeitraum auf Rang drei der aktivsten Projekte hochgearbeitet und die von Flutter eingesetzte Programmiersprache Dart weist das höchste Wachstum aller Sprachen auf. Ähnliches zeigt sich bei einer Internet-Suche zum Thema Flutter: in Blogs und Foren finden sich unzählige positive Rückmeldungen zum Produkt. Worin sind dieses grosse Interesse und das Lob begründet?

Rendering mit Skia

Bei der Entwicklung von Flutter waren drei Ziele ausschlaggebend: Apps sollen eine visuell ansehnliche Oberfläche besitzen, performant ausgeführt werden und komfortabel zu entwickeln sein. Diese Ziele werden in erster Linie durch die Verwendung der Rendering Engine Skia, der baumartigen Strukturierung der Oberflächen-Elemente sowie den Einsatz der Programmiersprache Dart erreicht.

Im Gegensatz zu anderen Cross-Plattform-Tools verwendet Flutter für die Darstellung der Oberfläche eine eigene Rendering Engine namens Skia anstelle der nativen Bedienelemente des darunterliegenden Betriebssystems. Beim Start einer App fordert die Flutter Engine beim Betriebssystem eine weisse Zeichenfläche an. Auf diese Fläche zeichnet Skia anschliessend die grafischen Elemente, in Flutter Widgets genannt. Dank dieser eigenen, hoch-performanten Engine sind Flutter-Apps unabhängig vom darunterliegenden Betriebssystem und dessen grafischen Möglichkeiten. So lassen sich selbst visuell aufwendige Oberflächen inklusive komplexer Animationen plattformübergreifend gestalten. Google verspricht eine konstante Bildrate von mindestens 60 Bildern pro Sekunde bei Einhaltung der empfohlenen Programmierrichtlinien. Im Gegenzug muss die Engine aber als Teil jeder App ausgeliefert werden, wodurch der Speicherbedarf um einige Megabyte anwächst. Ferner übernehmen Flutter-Apps aufgrund des Verzichts auf die nativen Bedienelemente nicht automatisch den Look & Feel der darunterliegenden Plattform. Ist dies nötig, so kann mittels vorgefertigter Widgets der Android- oder iOS-Stil nachgeahmt werden. Hierbei ist zu berücksichtigen, dass eine mit iOS-Widgets gestaltete App auch bei der Ausführung auf Android diesen Stil besitzt. Unterschiedliche Oberflächen pro Plattform sind gegenwärtig nur mit mehrfacher Implementierung möglich.

In Flutter werden jegliche Elemente der grafischen Oberfläche als Widget implementiert. Dieses Grundprinzip führt zu vor allem anfangs ungewohnten Konstrukten. Soll beispielsweise ein Element horizontal zentriert werden, so erfolgt dies durch Verschachtelung des Zielelements innerhalb eines Center-Widgets.

Von Haus aus bietet Flutter einen umfangreichen Widget-Katalog für verschiedenste Anwendungsfälle. Bei Bedarf können aber auch eigene Widgets erstellt werden. Wie im vorherigen Beispiel erklärt, können Widgets verschachtelt werden. So lassen sich einfache Grundelemente zu einem Widget-Baum kombinieren. Dieser Baum wird letztendlich von der bereits behandelten Skia Engine gezeichnet.

Zur Optimierung der Darstellungsgeschwindigkeit werden Widgets in zustandslose und zustandsbehaftete Elemente aufgeteilt (in Englisch: «Stateless» und «Stateful»). Bei einer Änderung am Zustand der Applikation berechnet die Flutter Engine die von der Änderung betroffenen Elemente im Widget-Baum. Skia zeichnet anschliessend nur diejenigen Elemente neu, welche von der Änderung wirklich betroffen sind.