Retour sur dotJS 2024

Après plusieurs années d’absence, la conférence JavaScript dotJS a fait son retour en grande pompe aux Folies Bergère, en plein centre de Paris. Pour l’occasion, toute l’équipe de l'agence Premier Octet était présente pour aiguiser son expertise technique et discuter avec la communauté JavaScript européenne.

Voici notre retour sur les différents talks de cette édition 2024 !

Dante's Inferno of Fullstack development

📺 Voir le talk

🎤 James Q Quick - @jamesqquick

Dans son talk "Dante's Inferno of Fullstack development", James offre une perspective originale sur l'évolution du développement web full-stack, en la comparant aux cercles de l'Enfer de Dante. Il retrace le parcours depuis le rendu côté serveur traditionnel jusqu'aux innovations récentes comme les composants serveur, en passant par les applications monopage (SPA) et la génération de sites statiques. Chaque étape de cette évolution est présentée comme une tentative de résoudre les problèmes de l'approche précédente, tout en introduisant parfois de nouveaux défis.

James conclut en utilisant la métaphore d'une spirale ascendante pour illustrer que, malgré l'impression de revenir aux mêmes problématiques, le développement Web progresse constamment.

💡 Les points clés du talk

• Les SPA ont amélioré la performance de navigation mais ont posé des défis en termes de SEO et de chargement initial
• La génération de sites statiques a résolu des problèmes de SEO mais a introduit des défis de temps de build
• Le rendu hybride et la régénération statique incrémentale ont cherché à combiner les avantages des approches précédentes
• Les composants serveur représentent la dernière innovation, offrant un équilibre entre performance, SEO et contenu dynamique

💬 Retrouvez ses slides sur https://www.jamesqquick.com/talks/dotjs-2024/

What to test in your web app

🎤 Jessica Sachs - @_jessicasachs

📺 Voir le talk

Jessica présente une exploration de l'histoire des tests dans le développement Web. Elle retrace l'évolution des pratiques de test depuis les années 90 jusqu'à nos jours, en mettant en lumière les défis et les innovations qui ont façonné notre approche actuelle. Elle souligne comment les problèmes d'infrastructure et de réseau ont toujours été au cœur des préoccupations, depuis l'époque du CGI jusqu'à l'ère moderne des applications edge et serverless.

Jessica examine ensuite l'émergence de divers outils de test, des premiers tests manuels aux test runners modernes comme Jest et Vitest. Elle met en évidence l'importance croissante des tests unitaires dans le navigateur et l'impact des changements technologiques, comme l'avènement de Node.js et des bundlers modernes, sur les pratiques de test.

Elle conclut en soulignant que malgré l'évolution des outils, les tests manuels restent pertinents dans certains contextes.

💡 Les points clés du talk

• L'évolution des tests web reflète celle des technologies et des infrastructures
• Les test runners in-browser comme JSTestDriver ont ouvert la voie à des outils plus sophistiqués
• Node.js et JSDOM ont révolutionné les tests JavaScript côté serveur
• Les tests manuels restent pertinents pour certains scénarios complexes ou nouveaux

Converging Web Frameworks

🎤 Minko Gechev - @mgechev

📺 Voir le talk

Minko nous parle de convergence des frameworks web modernes, en prenant pour exemple Angular et React. Il explique comment ces frameworks, malgré leurs différences syntaxiques, partagent des structures sous-jacentes similaires pour gérer la synchronisation entre le modèle et la vue. Il met en lumière l'évolution vers l'utilisation de signaux pour améliorer la réactivité, une tendance adoptée par de nombreux frameworks, y compris Angular.

Il partage également son expérience dans la convergence de deux frameworks chez Google : Angular et Wiz. Cette convergence a conduit à des améliorations significatives, notamment pour YouTube mobile. Minko conclut en suggérant que le choix d'un framework devrait se baser sur la stabilité, la fiabilité et l'écosystème plutôt que sur des différences techniques qui tendent à s'estomper.

💡 Les points clés du talk

• Les frameworks Web convergent vers des structures internes similaires malgré des différences syntaxiques
• L'adoption des signaux comme mécanisme de réactivité est une tendance majeure
• La convergence d'Angular et Wiz chez Google a conduit à des améliorations significatives pour YouTube
• Le choix d'un framework devrait se baser sur la stabilité, la fiabilité et l'écosystème

API Design is UI Design

🎤 Lea Verou - @LeaVerou

📺 Voir le talk

Lea Verou établit un parallèle entre la conception d'interfaces utilisateur et celle des API et souligne que les principes de design UI s'appliquent également aux API, car ces dernières ne sont qu'un type d'interface où les utilisateurs sont des développeurs.

Le cœur du message de Lea est que la complexité dans une API devrait être révélée progressivement, en s'adaptant aux besoins réels des utilisateurs. Elle insiste sur l'importance de créer une courbe d'apprentissage douce, où la complexité de l'interface augmente graduellement avec celle des tâches à accomplir. Elle souligne également l'importance des tests utilisateurs pour les API, encourageant les concepteurs à observer comment les développeurs interagissent réellement avec leurs interfaces.

💡 Les points clés du talk

• Les principes de design UI s'appliquent aux API
• La complexité doit être révélée progressivement dans une API
• Il faut optimiser pour les cas d'utilisation les plus courants
• Il faut privilégier la cohérence interne à la complexité externe
• L'empathie est essentielle dans la conception d'API

Becoming the multi-armed bandit

🎤 Ben Halpern - @bendhalpern

📺 Voir le talk

Ben présente une approche novatrice du développement logiciel en combinant art et science à travers l'algorithme "Multi-armed bandit". Cet algorithme, inspiré des machines à sous, permet d'optimiser les décisions en équilibrant l'exploration de nouvelles options et l'exploitation des meilleures solutions connues.

Il explique comment cet algorithme peut être appliqué au développement de logiciels pour optimiser les décisions basées sur les données. Ben illustre son propos avec des exemples concrets, notamment l'optimisation de l'expérience utilisateur et les tests A/B, en soulignant l'importance de trouver un équilibre entre l'exploration de nouvelles solutions et l'exploitation des meilleures options connues. Il insiste sur l'intégration de cette approche dans l'infrastructure même des projets pour améliorer la communication au sein des équipes et optimiser les résultats de manière continue.

💡 Les points clés du talk

• L'algorithme du "Multi-armed bandit" peut optimiser les décisions dans le développement logiciel
• L'intégration de cette méthode dans l'infrastructure des projets améliore la communication d'équipe

Remixing the bundler

🎤 Mark Dalgleish - @markdalgleish

📺 Voir le talk

Lors de son talk "Remixing the bundler", Mark explore l'évolution des frontières entre les bibliothèques et les frameworks JavaScript, en prenant pour exemple le parcours de Remix et React Router. Il explique comment Remix, initialement construit sur ESBuild, se tourne vers Vite pour simplifier son architecture et offrir plus de flexibilité aux développeurs. Cette transition met en lumière les défis de l'orchestration des builds dans un framework full-stack et contribue à l'évolution de Vite lui-même.

Mark explique ensuite comment cette expérience a mené à une refonte majeure : celle de la fusion de Remix dans React Router. Cette décision fait évoluer React Router d'une simple bibliothèque de routage à un outil plus puissant, tout en conservant sa flexibilité.

Il souligne l'importance croissante de Vite comme plateforme pour les frameworks, permettant de simplifier leur développement et leur maintenance, tout en offrant une meilleure DX.

💡 Les points clés du talk

• La distinction entre bibliothèques et frameworks devient de plus en plus floue
• Vite émerge comme une plateforme de choix pour le développement de frameworks
• La fusion de Remix dans React Router illustre cette tendance de simplification
• Les plugins Vite permettent d'ajouter des conventions de framework à des bibliothèques
• Cette évolution simplifie la création et la maintenance de frameworks

The Future of Serverless is WebAssembly

🎤 David Flanagan - @rawkode

📺 Voir le talk

David présente sa vision de l'avenir du serverless grâce à WebAssembly. Il commence par illustrer la différence de performance entre les containers traditionnels et WebAssembly et met ensuite en avant Spin, un framework développé par Fermyon, qui permet de créer des applications serverless basées sur WebAssembly.

Le talk se poursuit avec une démo de Spin, montrant sa facilité d'utilisation et sa flexibilité. Il souligne les avantages de WebAssembly dans un contexte serverless, notamment sa rapidité d'exécution, sa portabilité et sa capacité à supporter plusieurs langages de programmation.

💡 Les points clés du talk

• Spin permet de créer facilement des applications serverless basées sur WebAssembly
• WebAssembly offre des performances supérieures aux containers traditionnels pour le serverless
• Spin propose des fonctionnalités avancées comme le routage entre composants, la gestion d'état et l'intégration d'IA
• L'approche WebAssembly permet une véritable scalabilité à zéro et une isolation par requête

Generative UI: Bring your React Components to AI today!

🎤 Malte Ubl - @cramforce

📺 Voir le talk

Le CTO de Vercel, Malte Ubl a conclu la journée en donnant sa vision de l'intégration de l'IA dans le développement front-end. Il souligne l'évolution rapide de l'IA et son impact sur le développement logiciel, passant du machine learning complexe à des modèles accessibles via de simples appels API.

Il explique ensuite comment les développeurs front-end peuvent tirer parti de cette évolution en intégrant leurs composants React directement dans les interactions avec l'IA. Le talk se concentre sur une démo pratique de cette intégration en utilisant le SDK Vercel AI.

Il montre comment les LLMs peuvent appeler des fonctions JavaScript, et par extension, des composants React, et illustre ce concept à travers un exemple d'application de réservation de vol, où l'IA interagit avec des composants React pour fournir une expérience utilisateur fluide et interactive.

Nous avions d’ailleurs écrit quelques articles sur le sujet :

• AI et UI - Filtres intelligents avec le SDK Vercel AI et Next.js
• Intégrez vos données métiers au modèle OpenAI GPT avec Next.js

💡 Les points clés du talk

• L'IA évolue rapidement, devenant plus accessible aux développeurs via des API
• Les interfaces textuelles ne sont pas toujours la meilleure solution pour l'interaction avec l'IA
• Les composants React peuvent être intégrés directement dans les interactions IA
• Le SDK AI permet une intégration facile entre l'IA et les composants React

Pour finir

C’est donc avec grand plaisir que nous avons participé à cette édition 2024 de dotJS. Nous avons trouvé la conférence bien rythmée grâce à une alternance de long talks (20/25 minutes), de sessions de questions/réponses et de lightning talks (5 minutes). Comme toujours, Christophe Porteneuve a fait un excellent maître de cérémonie !

Si vous êtes dans l'écosystème JavaScript, nous ne pouvons que vous conseiller d'y participer l'année prochaine (début avril).

Un grand bravo à toute l'organisation de dotJS !

À l'année prochaine 👋