Chapitre 9 : L’Avènement de Flutter et du Langage Dart

I. Qu’est-ce que Flutter ?

Sorti d’abord timidement en 2017 par Google, Flutter a littéralement conquis le monde du développement Cross-Platform dans les années 2020 pour s’imposer mondialement en 2026.

C’est un kit de développement logiciel (SDK) d’interface utilisateur (UI) ultra-moderne. Sa prouesse extraordinaire : il écrit des applications qui se compilent nativement pour la plateforme cible (Android, iOS, Web, Windows, macOS, Linux, et Fuchsia) à partir d’une unique base de code.

II. Le langage : Dart

Google a exigé la création d’un langage conçu spécifiquement pour piloter Flutter : Dart. Dart est un langage fortement typé (orienté objet) qui emprunte la syntaxe facile du JavaScript mais force le développeur à typer rigoureusement comme du Java.

L’Arme secrète de Dart : La Double Compilation

1. En développement (AOT - Ahead of Time) : Son compilateur “Just In Time” (JIT) permet le rafraichissement instantané à la volée du code directement dans le simulateur du téléphone (Le fameux Hot Reload). C’est le designeur UI qui dicte sa fluidité sans attendre des compilations de 20 minutes (la faille du Natif classique).
2. En production : À l’export (AOB) Dart compile tout en langage binaire natif propre au matériel du téléphone (C/C++ pour la RAM pour ARMx64 par exemple) permettant des performances ahurissantes comparées à React Native, sans aucun Bridge / Pont JavaScript ralentisseur.

III. Le moteur de rendu : Skia (et Impeller)

C’est la différence la plus écrasante de Flutter par rapport à ses concurrents : Flutter dessine lui-même ses pixels sur l’écran !

Les architectures traditionnelles demandaient au téléphone l’autorisation d’afficher un bouton (un bouton constructeur UIImageView ou Widget de Google). Flutter embarque le moteur exclusif qui dessine nativement et à 120 FPS chaque pixel sur l’écran brut du téléphone. Historiquement ce moteur s’appelait Skia, remplacé en 2024-2026 par le redoutable moteur graphique d’animation matérielle 3D de Google : Impeller.

Cela garantit que l’app aura exactement le même habillage ultra-premium sur un écran Apple que sur un vieux téléphone Android. Plus aucune disparité, plus aucun “bouton décalé de 3 millimètres sur iPhone”.

IV. L’Architecture Widget : “Everything is a Widget”

En Flutter il n’existe pas d’objets ou de vues “Vues traditionnelles”, ni de balises XML (Android) ou HTML (Web). L’interface entière est structurée par un empilement imbriqué en arborescence de Widgets. Tout, absolument tout, s’écrit comme un Widget, qu’il s’agisse :

• D’un bouton visuel graphique.
• De la marge invisible de 10 pixels (Widget Padding).
• Même l’alignement central (Widget Center).

L’Arbre s’écrit ainsi (pseudo-code conceptuel déclaratif) :

Center(
  child: Column(
    children: [
      Text('Bienvenue !'),
      Padding(
        padding: EdgeInsets.all(8.0),
        child: ElevatedButton(
          onTap: () {},
          child: Text('Login'),
        ),
      ),
    ],
  ),
)

Les Deux Seigneurs du Widget

L’état de la donnée est au centre de l’interface qui doit réagir :

1. Le StatelessWidget : Le widget mort, purement visuel. Un texte statique, un icône. Il ne changera jamais en interne une fois la vue affichée.
2. Le StatefulWidget : Ce Widget est doté d’une “Mémoire d’Etat” (State). Il redessinera l’affichage dynamiquement à la seconde où une des variables internes change de valeur (par exemple : la case à cocher s’anime quand une booléenne passe de false à true).