La React Conf 2021 en bref

Le 17 décembre 2021 par Jesslyn Tannady et Rick Hanlon

C’était la première édition en ligne de la React Conf, et nous l’avons streamée gratuitement, traduite dans 8 langues différentes. Des participants du monde entier ont rejoint le Discord de la conférence et la réédition en ligne qui permettait une accessibilité depuis tous les fuseaux horaires. Plus de 50 000 personnes se sont inscrites, avec plus de 60 000 vues pour les 19 présentations, et 5 000 personnes au total étaient sur Discord lors de la conférence d’origine et de sa réédition.

Toutes les présentations sont disponibles en ligne.

Voici un résumé de ce que nous avons partagé sur scène.

React 18 and concurrent features

Dans cette plénière, nous partagions notre vision de l’avenir de React, à commencer par React 18.

React 18 ajoute le moteur de rendu concurrent attendu de longue date, ainsi que des évolutions de Suspense, sans introduire de rupture majeure de compatibilité ascendante (breaking change, NdT). Les applis peuvent migrer sur React 18 et commencer à adopter les fonctionnalités concurrentes de façon graduelle, avec un niveau d’effort similaire aux versions majeures précédentes.

Ça signifie qu’il n’y a pas de mode concurrent, uniquement des fonctionnalités concurrentes.

Dans cette plénière, nous avons aussi partagé notre vision pour Suspense, les Composants Serveur, les nouveaux groupes de travail React, ainsi que notre vision à long terme de prise en charge multi-plateforme pour React Native.

Regardez la session plénière intégrale présentée par Andrew Clark, Juan Tejada, Lauren Tan et Rick Hanlon :

React 18 for Application Developers

Nous avons aussi annoncé dans la plénière qu’une version candidate (RC) de React 18 était disponible pour essai dès maintenant. Sauf si de nouveaux retours l’imposent, il s’agira de la version exacte de React que nous publierons comme stable au début de l’année prochaine.

Pour essayer la RC de React 18, mettez à jour vos dépendances :

npm install react@rc react-dom@rc

et basculez vers la nouvelle API createRoot :

// Avant
const container = document.getElementById('root');
ReactDOM.render(<App />, container);

// Après
const container = document.getElementById('root');
const root = ReactDOM.createRoot(container);
root.render(<App/>);

Pour une démo de mise à jour sur React 18, regardez cette présentation de Shruti Kapoor :

Streaming Server Rendering with Suspense

React 18 inclut également des améliorations de performance pour le rendu côté serveur grâce à Suspense.

Le rendu streamé côté serveur permet de générer du HTML à partir de composants React côté serveur, puis de streamer ce HTML à vos utilisateurs. Avec React 18, vous pouvez utiliser Suspense pour découper votre appli en petits blocs indépendants qui peuvent être streamés individuellement les uns des autres sans bloquer le reste de l’appli. Ça signifie que vos utilisateurs verront votre contenu plus tôt, et pourront interagir avec bien plus vite.

La présentation de Shaundai Person ci-dessous explore ce sujet dans le détail :

The first React working group

Nous avons créé pour React 18 notre premier groupe de travail afin de collaborer avec un panel d’experts, de développeurs, de mainteneurs de bibliothèques et d’éducateurs. Nous avons travaillé ensemble pour créer une stratégie d’adoption progressive et affiner les nouvelles API telles que useId, useSyncExternalStore et useInsertionEffect.

Cette présentation d’Aakansha Doshi fait un tour d’horizon de ce travail :

React Developer Tooling

Pour prendre en charge les nouvelles fonctionnalités de cette version, nous avons par ailleurs annoncé une nouvelle équipe dédiée aux outils de développement React, ainsi qu’un nouveau Timeline Profiler pour aider les développeurs à déboguer leurs applis React.

Pour plus d’informations et une démo des nouvelles fonctionnalités des outils de développement, regardez la présentation de Brian Vaughn :

React without memo

En regardant plus loin encore vers l’avenir, Xuan Huang (黄玄) nous partage la progression de la recherche des React Labs research autour d’un compilateur auto-mémoïsant. Regardez sa présentation pour plus d’informations et une démo d’un prototype du compilateur :

React docs keynote

Rachel Nabors a inauguré une séquence de présentations sur l’apprentissage et la conception avec React, au travers d’une plénière retraçant notre investissement dans les nouvelles docs de React (react.dev) :

Et plus encore…

On trouvait aussi des présentations sur l’apprentissage et la conception avec React :

• Debbie O’Brien : Things I learnt from the new React docs.
• Sarah Rainsberger : Learning in the Browser.
• Linton Ye : The ROI of Designing with React.
• Delba de Oliveira : Interactive playgrounds with React.

Des présentations par les équipes de Relay, React Native, et PyTorch :

• Robert Balicki : Re-introducing Relay.
• Eric Rozell and Steven Moyes : React Native Desktop.
• Roman Rädle : On-device Machine Learning for React Native

Et des présentations par la communauté sur l’accessibilité, l’outillage et les Composants Serveur :

• Daishi Kato : React 18 for External Store Libraries.
• Diego Haz : Building Accessible Components in React 18.
• Tafu Nakazaki : Accessible Japanese Form Components with React.
• Lyle Troxell : UI tools for artists.
• Helen Lin : Hydrogen + React 18.*

Merci

C’était la première fois que nous planifiions une conférence nous-mêmes, et nous avons énormément de monde à remercier.

Merci tout d’abord à nos orateurs et oratrices Aakansha Doshi, Andrew Clark, Brian Vaughn, Daishi Kato, Debbie O’Brien, Delba de Oliveira, Diego Haz, Eric Rozell, Helen Lin, Juan Tejada, Lauren Tan, Linton Ye, Lyle Troxell, Rachel Nabors, Rick Hanlon, Robert Balicki, Roman Rädle, Sarah Rainsberger, Shaundai Person, Shruti Kapoor, Steven Moyes, Tafu Nakazaki et Xuan Huang (黄玄).

Merci à celles et ceux qui ont aidé en fournissant des retours sur les présentations, notamment Andrew Clark, Dan Abramov, Dave McCabe, Eli White, Joe Savona, Lauren Tan, Rachel Nabors et Tim Yung.

Merci Lauren Tan pour avoir mis en place le Discord de la conférence et avoir joué le rôle de notre administrateur Discord.

Merci à Seth Webster pour ses retours sur la direction générale et pour s’être assuré que nous mettions l’accent sur la diversité et l’inclusion.

Merci à Rachel Nabors pour avoir lancé nos efforts de modération, et à Aisha Blake pour avoir créé notre guide de modération, avoir piloté notre équipe de modérateurs, avoir formé les traducteurs et modérateurs, et avoir aidé à modérer les deux événements.

Merci à nos modérateurs Jesslyn Tannady, Suzie Grange, Becca Bailey, Luna Wei, Joe Previte, Nicola Corti, Gijs Weterings, Claudio Procida, Julia Neumann, Mengdi Chen, Jean Zhang, Ricky Li et Xuan Huang (黄玄).

Merci à Manjula Dube, Sahil Mhapsekar et Vihang Patel de React India, ainsi qu’à Jasmine Xie, QiChang Li et YanLun Li de React China, pour avoir aidé à modérer notre réédition et y avoir maintenu une atmosphère vivante et intéressante pour la communauté.

Merci à Vercel pour avoir publié leur guide de démarrage pour un événement virtuel, qui a servi de base pour le site web de la conférence, et à Lee Robinson et Delba de Oliveira pour avoir partagé leur expérience de la tenue de la Next.js Conf.

Merci à Leah Silber pour avoir partagé son expérience de tenue de conférences, les leçons qu’elle a tirées de la tenue de la RustConf, et pour son livre Event Driven et les conseils qu’il contient sur la tenue de conférences.

Merci à Kevin Lewis et Rachel Nabors pour avoir partagé leur expérience de la tenue de la Women of React Conf.

Merci à Aakansha Doshi, Laurie Barth, Michael Chan et Shaundai Person pour leurs conseils et idées tout au long de la planification.

Merci à Dan Lebowitz pour avoir aidé à designer et construire le site web de la conférence et la billetterie.

Merci à Laura Podolak Waddell, Desmond Osei-Acheampong, Mark Rossi, Josh Toberman et les autres membres de l’équipe Facebook Video Productions pour avoir enregistré les vidéos de la plénière et des présentations des employé·e·s de Meta.

Merci à notre partenaire HitPlay pour avoir aidé à organiser la conférence, pour le montage de toutes les vidéos lors du streaming, pour la traduction de toutes les présentations, et pour la modération du Discord dans plusieurs langues.

Enfin, merci à tous·tes les participants·es pour avoir contribué à faire une super React Conf!