Skip to main content

πŸ“¨ #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...

Β· 9 min read
SΓ©bastien Lorber
SΓ©bastien Lorber
Newsletter Editor - Docusaurus maintainer
Benedikt MΓΌller
Benedikt MΓΌller
Indie Hacker

Hi everyone!

This week is difficult to sum up, there's a lot of interesting news and I don't know which to highlight.

We notably have a sneak peek of a new React core hook replacing the confusing useFormState, that even React Native devs will now be able to use now!

πŸ’‘ Check this newsletter on Twitter - visual format 🎨

As always, thanks for supporting us on your favorite platform:

Don't miss the next 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:Β I use it myself to monitor the newsletter signupsΒ πŸ˜‰

    βš›οΈ React​

    React Core PR - New useActionState hook

    React Core PR - New useActionState hook

    It turns out the useFormState hook was confusing, and not even meant to be solely used in forms. The React team is addressing this by introducing a new React core hook to replace it:

    • Renames useFormState to useActionState
    • Adds a pending state to the returned tuple
    • Moves the hook to the react package

    Moving it from react-dom to react also means that now, other renderers such as React Native can use it too. There are other benefits to look at, such as a β€œpartial progressive enhancement” feature, but also new caveats documented in the PR.

    Don't miss the next 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​

      This section is now co-authored with Benedikt. Feel free to send us your comments by email or on Twitter!

      Improving Shopify App’s Performance

      Improving Shopify App’s Performance

      Shopify has been a proponent of React Native for a long time. But they did notice their app performance go down since they migrated to React Native. Instead of blaming the tech stack, they got to work and started optimizing for performance. The results speak for themselves: App launch is 44 % faster and screen load times were reduced by 59 %. Here’s a quick summary of some of the measures they took (hint: FlashList plays a big role in some of these). For details, read their great summary post:

      • Initially, only render what’s visible on the screen (especially true for the home screen)
      • Build all screens as lists (based on FlashList)
      • Use inlineRequires
      • Batch state changes
      • Optimize caching

      Very interesting insights and impressive results. I hope the Shopify team keeps sharing these details and maybe we’ll even see some of the things they mentioned they built during this process ending up as Open Source?

      πŸ”€ Other​

      🀭 Fun​

      alt

      See ya! πŸ‘‹


      Don't miss the next email!