Voir le profil

React Hebdo #90: JSX, Tinybase, Dioxus, Owl, useWorkerizedReducer, Perf, TypeScript, CSS...

React Hebdo #90: JSX, Tinybase, Dioxus, Owl, useWorkerizedReducer, Perf, TypeScript, CSS...
Par Sébastien Lorber • Numéro #90 • Consulter en ligne
Bonjour à tous!
Newsletter en retard cette semaine! J'ai de gros problèmes de connexion internet 😅 avec le retard, l'article tant attendu Remix vs Next.js vient d'être publié: je commente ça pour la semaine prochaine ;)
Une semaine assez variée, avec des articles React sympas et quelques nouveaux outils.
Parcel CSS qui réutilise une lib Rust créée pour Firefox, c'est plutôt cool!
Très content de constater Node.js supporte maintenant Error Cause!
Bonne lecture et à bientôt.
🙏 Pour soutenir la newsletter 🙏

React
On aime React pour sa proximité avec JavaScript: avec JSX pas besoin d'apprendre un nouveau langage de templating spécifique au framework. Cependant il faut reconnaitre qu'il y a quelques pièges à éviter 😅 Cet article en est un très bon résumé.
Surma (Google) nous propose d'utiliser un Service Worker pour créer un reducer React (avec possibilité de code async). Ceci est réalisé de manière performante puisqu'il utilise postMessage et des patchs json pour la communication. Le support navigateur a l'air correct (Firefox a besoin d'un polyfill). A voir quels sont les cas d'usage 🤷‍♂️.
Reflexions sur les limites actuelles du typage de bout avec Next.js. Il y a un risque de désynchro entre getServerSideProps et les props du composant. Trop de boilerplate à écrire, et un helper InferGetServerSidePropsType qui ne fonctionne pas toujours comme on l'espère. Mentionne une feature TypeScript très attendue par tous les frameworks: la possibilié de typer un module. Présente d'autres solutions comme Blitz, Server Components ou tRPC. Ce dernier me plait bien (voir aussi le boilerplate zart).
Une nouvelle base de donnée réactive pour les données structurées (en tableau, comme SQL ou normalizr), qui dispose aussi d'un package d'intégration React performant, avec des hooks comme useCell. Une petite lib en taille, mais pas mal de features: indexes, relationships, undo/redo…
Extras:
React-Native
Cette nouvelle solution propose de lancer nativement vos écrans React-Native, prendre des screenshots, et de les comparer visuellement avec les screenshots précédent stockés dans un dossier ./owl, en produisant un rapport. Tout cela s'intègre facilement avec Jest.
Super content de voir le visual regression testing se développer pour React-Native, ça manque vraiment! Voir aussi Storybook React-Native-Web qui peut permettre une intégration avec Chromatic, mais nécessite une conversion web.
Extras:
💸 Jobs
Sponsorise React Hebdo pour publier ton offre d'emploi
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.
Cajoo: Dev & Architecte Fullstack Remote - 40-90k€ (+BSPCE)
Cajoo veut créer le supermarché de demain 🛒 Nous sommes présents dans 10 villes en France et suite à un investissement de 40M$ de Carrefour nous étoffons l'équipe tech pour créer la stack tech du futur du retail. Les squads s'insèrent dans les 3 streams:
  • 🛍️ Consumer: App B2C en React Native, back-office React, backend Hasura & lambdas Node/Typescript
  • 🏭 Warehouse: PWA React avec XState pour les opérateur en entrepôt, back-office React, backend Hasura & NestJS
  • 🚴 Delivery: App coursiers en React Native sur Expo, back-office React, backend Hasura & lambdas Node/Typescript via Serverless
Notre code est typé de bout en bout avec Hasura en backend qui génère des endpoints GraphQL que nous consommons en frontend avec Apollo et un typing fort via Typescript.
  • 🌴 Remote pour les équipes Tech, Produit et Data (avec possibilité de venir dans nos locaux dans le 8ème à Paris)
  • 🏄‍♂️🏔️ Offsite chaque trimestre dans un endroit sympa en France (Hossegor, Chamonix)
Divers
Un nouveau parser, compiler et minifier CSS écrit en Rust, qui réutilise rust-cssparser de Firefox. Surperforme ses concurrents (même esbuild) en terme de vitesse et de taille du CSS émis. Ce nouvel outil est intégré au bundler Parcel, mais peut aussi être utilisé en standalone, en Rust ou JavaScript (Webpack loader?), et même Deno ou web (WASM).
Un nouveau framework en Rust fortement inspiré de React (hooks, VDOM, RSX…), fortement typé, performant, cross-platform (web, mobile, desktop, SSR). L'adoption semble facilitée pour les devs React/TypeScript.
J'ai regardé un peu le support cross-platform mais je n'ai pas encore très bien compris comment ça marche. On parle de performances natives mais en même temps ça a l'air de se baser sur Tauri qui si je ne me trompe pas repose sur des WebViews.
Extras:
Avez-vous aimé ce numéro ?
Sébastien Lorber

Chaque semaine, je t'envoie les nouvelles les plus pertinentes pour un(e) dev React et React-Native ouvert d'esprit.

Pour vous désabonner, cliquez ici.
Si on vous a fait suivre cette lettre d'information et que vous l'aimez, vous pouvez vous y abonner ici.
Propulsé par Revue
Lambda Scale - SIRET 82951115300027