La conférence React Native Connection 2025 s'est déroulée les 1er et 2 avril 2025 au Pan Piper à Paris avec des speakers d’horizon très divers et très intéressants (Expo, Microsoft, Shopify, Doctolib, Bluesky et même Meta!). Nous y étions bien entendu et dans une ambiance décontractée, on a pu échanger et partager autant pendant les pauses qu’attiser nos curiosités durant les conférences. Voici un résumé de quelques uns des sujets abordés lors de ces deux journées :
1er avril 2025 : 1/2 journée d'atelier / formation
- Reanimated – Gestes et micro-interactions
Présenté par Krzysztof Piaskowy et Bartłomiej Błoniarz
Cette session de hands-on a permit d’approfondir des concepts tels que les valeurs partagées, le threading, l'interpolation, les easings, les gestes, les animations de mise en page et Skia, visant à améliorer les compétences en création d'animations engageantes avec Reanimated.
2 avril 2025 : Les conférences
Nos hôtes de la technconnection nous ont encore gratifié d’une vidéo de teasing “the age of cursor” extrêmement bien réalisée sur la base des Marvel Avengers et de l’IA, sous la forme d’un Ultron forcément méchant mais qui pose la base de la réflexion sur les changements, quels qu’ils soient, qui s'annoncent avec la généralisation des aides au développement et des différentes formes de l’IA. Ces thèmes seront par ailleurs abordés durant les conférences suivantes et nourriront nombres de conversations durant les pauses et les échanges.
Mon focus est forcément subjectif mais met en lumière quelques unes des confs les plus marquantes :
- Intégrations Web avec React Native
Par Kadi Kraman
En tant que développeurs React Native, nous bénéficions d'une position rare : celle de développer pour les trois plateformes à partir d'une base de code unique : un avantage non négligeable dans un monde technologique où l'efficacité des développeurs est de plus en plus importante ! Cela ne signifie pas nécessairement tout mettre en œuvre et intégrer un site web complet à votre application React Native. Kadi passe en revue différentes fonctionnalités que vous pouvez activer progressivement ainsi que les nouveautés du SDK53 : l'utilisation de composants DOM pour une intégration fluide des éléments web à votre base de code RN, l'ajout de code côté serveur avec les routes API Expo Router, les MAJ “OTA”, au travers de l’EAS Hosting les actions serveur, les composants serveur, ainsi que les universal & App links (respectivement pour iOS et Android) jusqu’à la parité web et native complète. De même, Expo GO, grâce au scan d’un QR Code généré est une sandbox qui permet de simuler l’application sur son tel sans besoin d’une compilation préalable.
Expo SDK 53 est conçu pour être compatible avec React Native 0.79, offrant ainsi aux développeurs l'accès aux dernières fonctionnalités et améliorations de performance de React Native.
De plus, la Nouvelle Architecture de React Native, qui représente une refonte complète des composants internes pour améliorer les performances et la flexibilité, sera activée par défaut dans Expo SDK 53. Cela signifie que les nouveaux projets bénéficieront automatiquement de cette architecture optimisée. En outre, Expo SDK 53 introduit le support de SQLite.
- Accélérer l'accessibilité dans React Native avec l'IA : respecter la date limite de l'EAA
Par Britta Evans-Fenton
90 millions d’européens sont touchés par une déficience visuelle. Britta nous propose à travers son expérience personnelle une exploration de l'utilisation de l'intelligence artificielle afin d’améliorer l'accessibilité dans les applications React Native, en vue de se conformer aux exigences de l'European Accessibility Act qui pour rappel sera instauré à compter du 28 juin 2025.Britta nous détaille par l’exemple comment l’IA peut nous aider à rendre nos applications plus accessibles au travers d’un mini projet à condition de bien préciser nos attentes car par défaut le code proposé ne tiendra pas compte des normes d’accessibilité. Les délais étant courts pour les entreprises qui n’auront pas anticipé ce jalon, cette aide appréciable est une opportunité d’améliorer aisément l’accessibilité de leur app. Son conseil principal : CONTEXTUALISER ! Et en premier lieu, scinder les fonctionnalités / groupes d’écrans afin de travailler sur un périmètre clairement identifié et logique. Faire ensuite un première review qui permet à l’IA de décrire le fonctionnement et poser le contexte puis, avec les inputs adéquats concernant les guidelines d’accessibilité, relancer un prompt afin d’obtenir les recommandations A11Y. Ne pas hésiter à tester différents clients.
Ainsi on peut construire un contexte selon ces règles :
Un exemple avec Mistral AI :
- Faut-il vraiment re-render ? Les secrets de Shadow Tree et Unistyles 3.0
Par Jacek Pudysz
Présentation des techniques pour éviter les re-rendus inutiles en utilisant Shadow Tree et les nouveautés d'Unistyles 3.0. Qui n’a jamais été confronté aux difficultés d’appliquer des styles différents pour les différentes applications React Native sans la contrainte créer des hooks à chaque fois?Jacek nous présente Unistyles qu’il a créé suite à ce constat lors d’une reprise chez un client important. Et Unistyles peut nous aider à l’application plus simple d’un design system par exemple.
Les nouveautés d’Unistyles 3.0 publiée à l’issue de la conférence : Élimination des re-renders du processus de stylisation. Inspiré par la magie de Reanimated, Unistyles applique des principes similaires pour garantir un style rapide et fluide sans re-render de vos vues. De plus, passer à Unistyles est facile. Avec une parité 1:1 complète avec l'API StyleSheet de React Native, il vous suffit de remplacer vos imports ! Et si vous décidez de revenir en arrière, c'est tout aussi simple.
Unistyles fonctionne en arrière-plan, préservant votre hiérarchie de vues natives. Pas de wrappers, pas de contextes supplémentaires, et pas de hooks—juste des applications propres et efficaces. Enfin, construit sur une technologie de pointe, Unistyles exploite les modules Nitro avec une sécurité de typage complète de TypeScript → C++ → Kotlin/Swift.
- React Native et la quête de la couleur parfaite
Par Lucie Uffoltz et Antoine Thibierge
Présentation de l'intégration d’OKLab pour la gestion des couleurs dans React Native et les défis pour obtenir une reproduction plus fidèle des couleurs que le standard existant sRGB. Le DCI-P3 représente 25% de gestion de couleur en plus par rapport au sRGB et représente plus de 45% de l’espace colorimétrique de CIE 1931 (appelé GAMUT).Conscient de la diversification de l’utilisation des supports pour regarder films et séries, les entreprises ont commencé à introduire le DCI-P3 dans leurs appareils pour obtenir une meilleure reproduction des couleurs que l’utilisation de sRGB. De nombreux produits d’Apple, Sony, Samsung et Google ont un écran couleur extraordinaire par rapport aux anciennes versions. Le DCI-P3 est en train de devenir le nouveau standard en matière de périphériques, de sites Web et de logiciels et remplace progressivement le sRGB. Nos deux présentateurs ont donc proposé une RFC (RFC#871) afin que l’espace colorimétrique OKLAB soit supporté par React Native. Cela offre la possibilité de définir l'espace colorimétrique par défaut sur sRGB ou DisplayP3 et fournit le code natif nécessaire pour prendre en charge la syntaxe de la fonction color() conformément à la spécification W3C CSS Color Module Level 4.
The color() function allows a color to be specified in a particular, specified color space (rather than the implicit sRGB color space that most of the other color functions operate in). Its syntax is:
color() = color(
Ceci permettra d’obtenir des rendus plus proches de la réalité et permettra de les afficher sur les devices gérant le P3 ou de rebasculer en sRGB si ce n’est pas le cas.
- Optimisation des performances JavaScript avec Hermes statique
Par Krzysztof Piaskowy
Discussion sur l'amélioration des performances JavaScript en utilisant Hermes dans un contexte statique. - De JavaScript à l'écran : décryptage du pipeline de rendu de React Native
Par Hanno Gödecke
Analyse du processus de rendu dans React Native, depuis le code JavaScript jusqu'à l'affichage à l'écran. - Le dilemme de l'abstraction des plateformes : concevoir des API pour un monde multi-plateforme
Par Mathieu Acthernoene
Réflexion sur la conception d'API adaptées à plusieurs plateformes tout en maintenant une expérience utilisateur cohérente. - Comment construire des applications multi-plateformes sans devenir fou
Par Samuel Newman
Partage d'expériences et de stratégies pour développer des applications fonctionnant harmonieusement sur diverses plateformes. Samuel représente à lui seul ⅓ de de l'équipe de développement de Bluesky (sic!), le réseau social issu mais indépendant de Twitter. Compte tenu de ces facteurs, il aurait été illusoire de penser à maintenir plusieurs codebases pour chaque cible tout en tenant compte des enjeux inhérents à chacune des plateformes, web, smartphone, tablettes.
Ces sessions ont offert aux participants des perspectives approfondies sur les avancées et les meilleures pratiques dans le développement avec React Native avec comme à l’accoutumé une ambiance très décontractée et des intervenants captivants et accessibles entre les sessions permettant d’échanger nos points de vue et expérience et de préciser des notions. Une très belle conférence une fois encore, merci à nos organisateurs de la #TechConnection ainsi qu’à tous les participants pour leur talent et leur accessibilité.
