This Week In React

Share this post

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

substack.thisweekinreact.com

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

Sébastien Lorber
Nov 2, 2020
Share this post

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

substack.thisweekinreact.com

React

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

  • ...

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.

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.

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..

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...).

ReactNative

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.

Décrit tout un workflow pour profiler les problèmes de performance sous ReactNative avec le runtime Hermes.

Une lib de style utility-first pour ReactNative, inspirée de TailwindCSS. Dans le même genre, voir aussi Dripsy (inspiré de theme-ui).

Divers

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.

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.

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!

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.

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.

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.

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.

Share this post

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

substack.thisweekinreact.com
Previous
Next
Comments
TopNewCommunity

No posts

Ready for more?

© 2023 Sébastien Lorber
Privacy ∙ Terms ∙ Collection notice
Start WritingGet the app
Substack is the home for great writing