8 Pluspunkte von Flutter im Vergleich zu React Native

Die mobile Entwicklung basiert zunehmend nicht auf nativer Entwicklung, sondern auf der Verwendung von Frameworks, mit denen Anwendungen für mehrere Plattformen gleichzeitig erstellt werden können. Heute möchte ich ein paar Worte über Flutter sagen, das allmählich den Markt von React Native gewinnt. Details - unter dem Schnitt.



Wenn das Projekt zur Entwicklung einer mobilen Anwendung beginnt, muss entschieden werden, auf welcher Plattform wir programmieren. Oft wird diese Frage vom Kunden selbst beeinflusst, der möchte, dass Software für jede Plattform nativ erstellt wird, oder umgekehrt Geld sparen möchte und die Entwicklung auf React Native wünscht.

Auf der Projektwebsite können Sie feststellen, dass Flutter nicht nur Google selbst, sondern auch einige andere Unternehmen aktiv nutzt. Zum Beispiel hat Flutter die neue The New York Times-App sowie mobile Versionen von eBay und Aliexpress geschrieben. Im Allgemeinen sieht die Liste jedoch nicht sehr beeindruckend aus, da sie nicht mehr als 20 Unternehmen umfasst.
Bild
Die Erfahrung der Entwickler unseres Unternehmens zeigt jedoch, dass Flutter in einigen Fällen besser und bequemer für die Erstellung mobiler Anwendungen ist. Netis kollektiver Verstand betrug insgesamt 8 Pluspunkte dieses jüngeren Rahmens.

Performance


Von Flatter entwickelte Anwendungen laufen viel schneller als React Native. Geschwindigkeitsvorteile werden durch unsere eigene Engine und die Verwendung einer anderen Programmiersprache erzielt. Im Gegensatz zu React Native, das mit Bridges und der Java Script-Sprache funktioniert, können Sie mit Flutter schnell Anwendungsprobleme lösen, insbesondere Probleme im Zusammenhang mit der Benutzeroberfläche. Native Compiler sind bereits in das Framework integriert, und in Dart geschriebener Code wird zu nativen Anweisungen für ARM-Prozessoren.

Interessante Vergleichstests wurden übrigens von Jungs von InVerita durchgeführt. In ihrem Artikel über Medium wurde die Leistung fertiger Anwendungen auf echten iPhone 6 und Xiaomi Redmi Note 5-Geräten verglichen.

Bild

Wie Sie sehen können, läuft der Gauß-Test unter iOS unter Flutter noch schneller als unter Swift, und RN zeigt eine Verzögerung von 20 Mal!

Bild

Bei Android benötigt Flutter 20% mehr Zeit, um den Test abzuschließen als Java und Kotlin, funktioniert aber immer noch 15-mal schneller als RN.

Anwendungsgröße


Aufgrund des vorherigen Absatzes enthalten Anwendungen, die auf der Basis von Flutter erstellt und auf Dart geschrieben wurden, weniger Zwischenkomponenten. Durch das Kompilieren in native ARM-Anweisungen können Sie nichts mehr speichern. Infolgedessen benötigen Anwendungsbinärdateien selbst bis zu zweimal weniger Speicherplatz auf dem Laufwerk des Geräts als bei der Entwicklung auf React Native.

Schnelle Animation


In gewissem Sinne folgt dieses Plus aus dem vorherigen. Wir haben uns entschieden, Flutter für Anwendungen zu verwenden, in die viele Animationen integriert sind. Tatsache ist, dass Flutter stabil 60 FPS demonstriert, was bedeutet, dass Benutzer nicht auf das zuckende Bild schauen müssen, wie dies häufig bei React Native der Fall ist.

Typisierte Programmiersprache


Die Basis von Flutter ist Dart, eine typisierte Programmiersprache, die bereits bei Enthusiasten beliebt ist. Bei Dart wird Codierung zu objektorientierter Programmierung ... und hier könnten wir uns natürlich an TypeScript erinnern und argumentieren, dass es auch typisiert ist. Aber leider ist es letztendlich transkompiliert und verwandelt sich immer noch in untypisiertes JavaScript. Das heißt, alle Vorteile von TS bleiben auf dem Komfortniveau des Encoders und beeinträchtigen die Leistung nicht. Dart hingegen ist nativ typisiert. Die Programmiersprache wird aktiv entwickelt und von der Community unterstützt. Sie können viel mehr Strukturcode auf Dart schreiben, was bedeutet, dass Sie komplexere Anwendungen und hierarchische Strukturen erstellen können.

Hervorragende Dokumentation


Für diejenigen, die sich mit der neuen Plattform im Internet beschäftigen möchten, gibt es Video-Tutorials, die Möglichkeiten für die Online-Arbeit mit Code sind durchdacht. Die von Google geführte Community hat umfassende Anweisungen und Anleitungen entwickelt. Darüber hinaus verfügt das Netzwerk sogar über ein vorgefertigtes Rezept für den Wechsel von React Native zu Flutter. Sie können es hier sehen . Natürlich gibt es auch eine Dokumentation für React Native, die jedoch aufgrund von Beschreibungen wie "removeClippedSubviews - Dies kann die Bildlaufleistung für große Listen verbessern" häufig unbrauchbar ist. Die Flutter-Community verfolgt einen viel ernsthafteren Ansatz bei der Dokumentation.

Uniformity UI


Der bekannte Vorteil von React Native ist die Möglichkeit, die Entwicklung für mehrere Plattformen gleichzeitig durchzuführen. Niemand garantiert jedoch, dass Sie ohne Finalisierung mit einer Datei sofort dieselbe Schnittstelle erhalten. Im Gegensatz dazu sieht eine in Flutter geschriebene Anwendung auf iOS und Android gleich aus und funktioniert auch so. Unsere Programmierer haben den Code nie neu geschrieben, damit die Anwendung unter iOS genauso funktioniert wie unter Android. Bei React Native ist alles anders. Solche Verbesserungen müssen mit beneidenswerter Regelmäßigkeit durchgeführt werden.

Unterstützung für eine Vielzahl von Plattformen


Flutter unterstützt bereits Android, iOS und Web. Gemessen an den Diskussionen in der Community wird die Unterstützung für MacOS, ChromeOS und Windows sehr bald verfügbar sein. Interessanterweise unterstützt Flutter bereits die zukünftige Google Fuchsia-Plattform. So kann jede Entwicklung sofort auf das neue Betriebssystem portiert werden.

Entwicklerwerkzeuge


Das Letzte, was ich erwähnen möchte, sind die entwickelten DevTools. Flutter verfügt über ein gutes Ökosystem an Entwicklertools. Sie können sie hier ansehen . Übrigens versucht Facebook, etwas Ähnliches zu tun, aber soweit wir sehen können, hat RN bisher nur eine Beta-Version von DevTools und erreicht aufgrund der Funktionalität nicht die Flutter-Gegenstücke.

Codebeispiel


Im Folgenden finden Sie beispielsweise den Code "Hallo Welt!" für React Native- und Flutter-Frameworks

// React Native
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';

export default class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <Text>Hello world!</Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center'
  }
})

Und so wird dieser Code in Flutter aussehen

// Flutter
import 'package:flutter/material.dart';

void main() {
  runApp(
    Center(
      child: Text(
        'Hello, world!',
        textDirection: TextDirection.ltr,
      ),
    ),
  );
}

Hat Flutter irgendwelche Nachteile?


Natürlich sind sie. Flutter ist eine junge Plattform. Es gibt nicht genug vorgefertigte Lösungen dafür. Zum Vergleich: Derselbe React Native verfügt bereits über viel mehr vorgefertigte Vorlagen, Rezepte und Implementierungsoptionen.

Das Schreiben einer Benutzeroberfläche in Flutter dauert länger. Und das Schreiben von Dart-Code ist länger. In React Native wird eine Anwendung als Designer aus Webkomponenten erstellt. Das Flattern erfordert noch eine gründliche Programmierung.

Darüber hinaus erfordert Flutter tiefere Programmierkenntnisse. Im Fall von React Native können Sie die Entwicklung jedem Spezialisten anvertrauen, der über Kenntnisse in Java Script verfügt. Mit Dart sind die Dinge komplizierter, da diese Sprache eine höhere Eintrittsschwelle als JS hat. Der Programmierer muss eingehender geschult werden.

Gleichzeitig sind die offenen Stellen für Entwickler bei Flutter noch recht gering. Russische Unternehmen haben noch kein Vertrauen in die neue Plattform. Dies hindert uns jedoch nicht daran, einen Teil der Entwicklung in diesem Rahmen durchzuführen. Und die bisherigen Ergebnisse sind mehr als positiv. Wenn Sie Erfahrung mit der Entwicklung von Flutter haben, teilen Sie Ihre Eindrücke bitte in den Kommentaren mit.

All Articles