React Hebdo #111: Reassure, Multiplayer Cursors, Next.js, Meteor, Storybook, TanStack, FlashList, Bun...
Sébastien Lorber ⚛️ This Week In React
🔥 ThisWeekInReact.com - 📨 Rejoins 45k+ devs - 🦖 Docusaurus maintainer @ Meta - Freelance
⚠️ IMPORTANT: ma newsletter LinkedIn est arretée
🔗Abonnez-vous sur ReactHebdo.fr 🇫🇷
------------------------------------------------------------------------------
Bonjour à tous!
Encore une semaine avec pas mal de releases sympa, comme Reassure, FlashList ou encore Bun 🤯
Egalement 2 articles interactifs👌
Vers fin Juillet, je vais passer sur un rythme bi-mensuel. Ca va me permettre de faire évoluer un peu le format de cette newsletter.
J'oublie souvent de le mentionner ici, mais je tiens à jour une page Indie Hacker: je fais un reporting mensuel sur cette newsletter avec tous mes chiffres: croissance, sponsoring etc…
J'explore l'idée de proposer un service de recrutement React premium, sur un modèle similaire aux chasseurs de tête. Si jamais tu es en recherche active, ou ouvert aux opportunités, n'hesites pas à me contacter.
🙏 Pour soutenir la newsletter:
React
Reassure est une nouvelle librairie de test de performance en React. Déjà présentée, elle vient juste d'être open-sourcée. Elle permet de poster un rapport dans une pull-request quand des régressions sont detectées. Exemple: un composant qui re-render plus lentement, ou plus souvent qu'avant. Pour l'instant seul React-Native est supporté, mais le support web arrivera très prochainement.
Un super article intéractif qui propose d'animer le curseur de la souris sur plusieurs browsers en temps réel. C'est un problème plus compliqué qu'il n'en a l'air. Chaque approche est illustrée avec une implémentation React et présente des tradeoffs différents: CSS transitions, spring, splines…
Article intéractif du même auteur, présentant de nombreux cas d'usage de middleware. Déjà publié ici, il vient d'être mis à jour suite à la sortie officielle de Next.js 12.2 qui comporte quelques breaking changes.
Sacha Grief (co-auteur de Discover Meteor, et aussi des sondages State of JS…) fait une rétrospective sur 10 ans de son histoire personnelle avec le framework. Meteor a perdu en popularité, mais largement influencé notre écosystème frontend.
Nadia met en avant quelques comportements React qui peuvent parfois être surprenants voir contre-intuitifs, et explique dans quel cas un re-render du parent va lancer un re-render de l'enfant.
Résumé des dernières nouveautés de la communauté Storybook: Component Encyclopedia, Figma plugin, Story Explorer, et divers addons: Variants, CSS variables, Recoil…
Présente les différents problèmes résolus par les solutions de state management et en compare quelques uns. Rétrospective pre/post Redux. Article complet mais assez long: pas évident à lire.
Extras:
💸 Sponsors
Recommandé par LinkedIn
Axiom vous permet de surveiller la santé et la performance de vos déploiements Vercel en ingérant toutes vos données de requête, de fonction et Core Web Vitals.
Utilisez le tableau de bord d'Axiom pour avoir une vue d'ensemble de tous vos logs et stats Vercel, explorez des projets et des déploiements spécifiques et obtenez un aperçu de la performance des fonctions en un seul clic.
💸 Jobs
Pricemoov est une solution SaaS de pricing dont la mission est de permettre à ses clients d'optimiser leur marge et leurs revenus grâce à une meilleure gestion de leurs stratégies de prix.
Notre siège est à Paris et nous avons ouvert notre bureau à New York en novembre 2021. Fin 2022, on accélère notre internationalisation avec l'ouverture de Singapour. Nous serons plus de 100 collaborateurs d'ici là !
En rejoignant l'équipe Engineering de Pricemoov, vous participerez notamment à la conception d'une architecture front-end intelligente afin de permettre au produit de scaler à l'international.
Notre ambition technique est l'amélioration continue en visant de hauts standards en terme de qualité de code. Vous y participerez en progressant sur le chemin du software craftsmanship.
Paris 10ème, remote friendly, 55K - 80K+ selon la séniorité technique.
Nabla - Front-end engineer React senior - Paris - 55-90k€
Nabla construit une plateforme de médecine asynchrone (chat sans rendez-vous + appel vidéo si besoin), en automatisant un maximum de tâches répétitives pour que les médecins se concentrent sur le soin et que le service reste accessible à tous.
Ils ont levé 17M€, remporté un award Google Play Best Apps of 2021 et viennent de lancer la première offre payante dédiée à la santé des femmes.
Les fans de hooks React et de Typescript se sentiront à la maison, ainsi que les amateurs de GraphQL, Tailwind, Vite ou Next.js. Pas mal de technos sympa à découvrir (WebRTC et codegen notamment)
Paris 3ème, remote possible, 55k-90k en fonction de l'expérience, + BSPCE.
React-Native
Shopify vient de sortir FlashList, son alternative à FlatList pour résoudre les problèmes de performance lors du scroll et éviter d'afficher des cellules vides. Le but est de garder 60fps même sur les appareils Android un peu ancien, sans pour autant compliquer l'implémentation. La librairie réutilise les cellules déjà rendues: il faudra adapter votre usage de key React pour lui laisser la main.
Répertorie le support API de chaque runtime React-Native (JSC, V8, Android…) de manière exhaustive. L'auteur explique également Explique aussi pourquoi React Native recommande la config TypeScript es2017
Extras:
Divers
Un nouveau runtime JavaScript qui vient directement concurrencer Node.js et Deno sur les performances, basé sur JSC (et pas v8) et écrit en Zig. Une toolchain complête avec bundler, transpiler, test runner, client npm… Outil à suivre de pret. On l'avait déjà parlé du bundler Bun l'année dernière mais le scope s'est élargi et la v0.1 vient de sortir.
Extras:
Merci pour le partage.