Voir le profil

React Hebdo #36: NextJS 10, Formik 3, Remix, Recoil, ReactNative, Hermes

React Hebdo #36: NextJS 10, Formik 3, Remix, Recoil, ReactNative, Hermes
Par Sébastien Lorber • Numéro #36 • Consulter en ligne
Bonjour à tous,
Beaucoup de sorties cette semaine!
Content de vous présenter mon travail sur le site de ReactNative, passé en production jeudi dernier. Mon talk ReactNativeEU est en ligne: Cross-platform: ReactNative, Jamstack and beyond.
Sortie de NextJS 10 avec plein de bonnes choses (optims image, routing i18n, dashboard analytics…)
Ryan Florence et Michael Jackson en dévoilent une preview de Remix, leur metaframework React. A voir si un framework payant peut séduire la communauté…
Première alpha pour Formik 3, qui veut résoudre les problèmes de perf de la v2, et propose des features de masking.
La release ReactNative 0.64 est bloquée de la PR “Hermes sur iOS”. En attendant, un article sur le profiling de perfs sous Hermes est dispo.
Recoil est sorti en 0.1.x assez discrètement. Support expérimental de ReactNative, mais certains disent que ça marchait déjà avant…
Coté Jamstack, l'article Jamstack vs WordPress est très intéressant, complet et objectif. On y parle d'un peu de tout (WordPress + CloudFlare, générer un site statique à partir de WordPress, les couts, la sécurité…).
Un nouveau benchmark sur les temps de build Jamstack, avec de bons résultats pour NextJS et assez mauvais pour Gatsby… Dans l'avenir, on va surveiller attentivement l'impact de esbuild, esbuild-loader et Webpack 5 sur les temps de build…
Gatsby a également 2 nouvelles RFC (Static Image, Gatsby serverless functions)

🇫🇷🇫🇷🇫🇷 SVP, envoyez moi vos meilleurs articles React en français, je les inclus en priorité!
Bonne lecture!
Chat React Hebdo (Discord)
Petites annonces

React
NextJS 10
Sortie à l'occasion de la conf NextJS, avec pas mal de nouveautés
  • Optimisations d'images (sans ralentir le build)
  • React 17, fast refresh, nouveau JSX transform
  • Routing i18n (domain et subpath)
  • NextJS analytics basé sur métriques réelles des users
  • …
nextjs.org  •  Partager
Static Site Generator Build Times
Benchmark du temps de build de 6 frameworks Jamstack.
Les résultats de Gatsby sont assez décevants. Rien vu d'anormal dans le code pour autant.
Les résultats de NextJS sont impressionnants , avec une scalabilité assez linéaire, qui dépasse même Eleventy sur un gros site.
Laissons un peu de temps passer avant d'en tirer trop de conclusions. Webpack 5 (pas utilisé ici) pourrait bien changer la donne, au moins sur le build incrémental.
css-tricks.com  •  Partager
Formik 3 Alpha
Formik v3 veut résoudre les problèmes de performance, lié au fait d'avoir supposé qu'il y aurait un hook React useSelector pour souscrire efficacement a un sous-ensemble de context React. Il y aura quelques breaking changes à prévoir.
Nouvelles features de input masking (via parse/format), utiles pour formatter les numéros de téléphone.
formik.org  •  Partager
Le nouveau metaframework React de Ryan Florence et Michael Jackson est sortie en preview. Pas encore beaucoup d'infos sur le site officiel (plus d'infos par leur mailing list). Ce post permet de découvrir quelques aspects.
Le framework est payant (license à minimum 250$/an qui fait parler). A voir avec le temps si ils vont pouvoir concurrencer NextJS, Blitz, Redwood..
dev.to  •  Partager
Première release 0.1.x, avec quelques features expérimentales.
  • Améliorations de perf
  • Support ReactNative
  • Atom Effects
  • Test snapshots
Annonce également quelques features prévues sur la roadmap (perf, devtools, effects library…).
recoiljs.org  •  Partager
ReactNative
ReactNative: nouveau site
Dans le cadre de mon contrat de freelancing avec Facebook sur Docusaurus, on a effectué la migration du site ReactNative de Docusaurus v1 vers Docusaurus v2. 
Quelques changements visibles:
  • Dark mode
  • Single-page-application, navigation fluide, prefetching…
  • Algolia DocSearch v3
Le contenu du site reste identique, mais la v2 ouvre de nouvelles possibilités, en particulier via MDX, pour rendre la doc plus intéractive et maintenable. 
On risque également d'y utiliser prochainement les features i18n pour traduire le site, sur lesquelles je travaille actuellement.
Prochaine migration prévue: Jest, qui est un site v1 déjà traduit.
www.linkedin.com  •  Partager
Hermes + React Native perf profiling
Décrit tout un workflow pour profiler les problèmes de performance sous ReactNative avec le runtime Hermes.
www.g2i.co  •  Partager
Une lib de style utility-first pour ReactNative, inspirée de TailwindCSS. Dans le même genre, voir aussi Dripsy (inspiré de theme-ui).
github.com  •  Partager
Divers
WordPress and Jamstack
Article intéressant de Chris Coyier (créateur de CSS-Tricks). Pèse le pour et contre de la Jamstack versus WordPress sur de nombreux aspects.
css-tricks.com  •  Partager
Is the pain worth the gain?
Est-ce que ça vaut le coup d'écrire une webapp en C?
Propose un benchmark d'une appli web simple en C (Facil), Python (Flask), NodeJS.
dev.to  •  Partager
esbuild
Le bundler JavaScript le plus rapide (écrit en Go) continue d'évoluer. Il a maintenant un site et une vraie documentation.
A noter également le projet esbuild-loader qui permet de remplacer le loader babel, par un loader esbuild, et améliorer les perfs de votre build Webpack!
esbuild.github.io  •  Partager
Rich Harris a annoncé à la conférence Svelte que le framework Sapper sera abandonné, au profit de nouvelles features intégrées dans Svelte. Repose sur Snowpack en dev.
dev.to  •  Partager
Un résumé rapide à lire des nouveautés de Webpack 5. J'ai bien envie de tester ça, en particulier pour l'amélioration du temps de build.
medium.com  •  Partager
Propose une liste des alternatives aux single-page-applications. 
Turbolinks, Phoenix LiveView… pas très détaillé, mais donne un bon point d'entrée.
macwright.com  •  Partager
Pas d'inquiétude, on peut toujours utiliser Sass via dart-sass, qui sera peut être moins performant, mais mieux maintenu et plus proche de la spec Sass.
sass-lang.com  •  Partager
Avez-vous aimé ce numéro ?
Sébastien Lorber

Chaque semaine, je vais t'envoyer les nouvelles pertinentes pour un(e) dev React et React-Native, et tu vas gagner du temps sur ta veille.

Je pars du principe que tu es déjà à l'aise avec React, et ouvert(e) d'esprit: on parle aussi de NodeJS, TypeScript, Jamstack, CSS, Serverless, Flutter, Svelte, mobile...

🙏 Pour me soutenir: recommande la newsletter autour de toi.

Si vous ne voulez plus recevoir les prochaines mises à jour, vous pouvez vous désabonner 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