Aller au contenu principal

📨 #176: useActionState, React Compiler, Million Lint, TanStack, Generative UI, Vinxi, Remix i18n, Next.js security, Typesafe Router, Shopify RN perf, RCTRootViewFactory, iOS Live Activities, Uni Stack, TypeScript, Parcel...

· 10 minutes de lecture
Sébastien Lorber
Sébastien Lorber
Editeur - Mainteneur de Docusaurus

Salut à tous !

Cette semaine est difficile à résumer, il y a beaucoup de nouvelles intéressantes et je ne sais pas lesquelles mettre en avant.

Nous avons notamment un aperçu d'un nouveau hook React remplaçant le déroutant useFormState, que même les développeurs React Native pourront désormais utiliser !

💡 Consulter cette newsletter sur Twitter - format visuel 🎨

Pour me soutenir:

Ne manque pas le prochain email !

    💸 Sponsor​

    Axiom - the best logging platform for Vercel apps

    Axiom - the best logging platform for Vercel apps

    😴 Sleep peacefully knowing that Axiom’s zero-config observability for Vercel projects has you covered.

    • Use Axiom's pre-built dashboard for an overview across all your Vercel logs and vitals, drill down to specific projects and deployments, and get insight on how functions are performing with a single click.
    • next-axiom allows you to send logs and events from any part of your Next.js projects - client, edge, or server-side - without any special configuration.
    • Easily send structured logs directly from your code and analyze them together with Vercel logs.

    Axiom efficiently captures 100% of your event data so you’ll never have to worry about sampling or retention, and you’ll never have to guess what your users are experiencing.

    PS : Je l'utilise moi-même pour suivre les inscriptions à la newsletter 😉

    ⚛️ React​

    React Core PR - New useActionState hook

    React Core PR - New useActionState hook

    Il s'avère que le hook useFormState était confus, et n'était même pas destiné à être utilisé uniquement dans les formulaires. L'équipe React s'attaque à ce problème en introduisant un nouveau hook React pour le remplacer :

    • Renomme useFormState en useActionState
    • Ajoute un état pending au tuple retourné
    • Déplace le hook vers le package react.

    Le déplacement de react-dom vers react signifie également que maintenant, d'autres moteurs de rendu tels que React Native peuvent également l'utiliser. D'autres avantages sont à prendre en compte, comme une fonctionnalité « d'amélioration progressive partielle », mais aussi de nouvelles mises en garde documentées dans le PR.

    Ne manque pas le prochain email !

      💸 Sponsor​

      Need more than just a sign-in box?

      Need more than just a sign-in box?

      Clerk streamlines React app authentication and user management, ensuring a quick setup for the modern web.

      Experience the benefits of Clerk:

      • 💅 Pre-built UI components for sign-in, sign-up, user profiles, and organizations. Customize with any CSS library and deploy on your domain
      • 📦 SDKs for React, React Native, Next.js, Redwood, Remix, and other frameworks
      • ⚡ Integrations with Firebase, Supabase, Convex, and other BaaS providers
      • 🎁 User management, social login, magic links, MFA, and more out of the box

      Dive into Clerk's quickstarts and tutorials to kickstart your project🚀

      📱 React-Native​

      Cette section est désormais co-écrite avec Benedikt. N'hésitez pas à nous envoyer vos commentaires par email ou sur Twitter !

      Improving Shopify App’s Performance

      Improving Shopify App’s Performance

      Spotify est un adepte de React Native depuis longtemps. Mais ils ont remarqué que les performances de leur application avaient baissé depuis qu'ils avaient migré vers React Native. Au lieu de blâmer la pile technologique, ils se sont mis au travail et ont commencé à optimiser les performances. Les résultats parlent d'eux-mêmes : Le lancement de l'app est 44 % plus rapide et les temps de chargement des écrans ont été réduits de 59 %. Voici un résumé rapide de certaines des mesures prises (indice : FlashList joue un rôle important dans certaines d'entre elles). Pour plus de détails, lisez leur excellent article de synthèse :

      • Au début, ne rendre que ce qui est visible sur l'écran (surtout pour l'écran d'accueil)
      • Construire tous les écrans comme des listes (basé sur FlashList)
      • Utiliser inlineRequires
      • Changements d'état par batch
      • Optimiser la mise en cache

      Des informations très intéressantes et des résultats impressionnants. J'espère que l'équipe de Shopify continuera à partager ces détails et peut-être verrons-nous même certaines des choses qu'ils ont indiqué avoir conçues au cours de ce processus finir en Open Source ?

      🇫🇷 En français​

      🔀 Autre​

      🤭 Fun​

      alt

      A plus 👋


      Ne manque pas le prochain email !