--- title: "What the React community is doing and thinking" publication: "React Status" issue: 394 published_at: "2024-07-24" canonical_url: "https://react.statuscode.com/issues/394" --- Plus a look into how Airbnb upgraded from React 16 to 18. | #​394 β€” July 24, 2024 [Read on the Web](https://react.statuscode.com/issues/394) Together with [![Clerk\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,w_220,h_64/e_make_transparent/co_white,e_outline:5/j3vhv1hnwqeffgkzzlvu.png)](https://go.clerk.com/o65GuW7) React Status [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/qvowfnumcp3ib6kxi5wj.jpg)](https://2023.stateofreact.com/en-US/) [The Results of _State of React 2023_](https://2023.stateofreact.com/en-US/) β€” The _State of React 2023_ survey ran last December but the results from over 13,000 respondents have finally landed. It’s packed with interesting tidbits, but we learn: - [SPAs still dominate](https://2023.stateofreact.com/en-US/usage/) for most developers. - [`forwardRef` is the React API causing the most pain.](https://2023.stateofreact.com/en-US/features/#main_apis_pain_points) - 🎧 [What podcasts React developers are listening to.](https://2023.stateofreact.com/en-US/resources/#podcasts) - [Python and PHP are the most common backend languages](https://2023.stateofreact.com/en-US/libraries/back-end-infrastructure/#backend_language) (after JS/TS). - [MUI and React Bootstrap](https://2023.stateofreact.com/en-US/libraries/component-libraries/) lead the way in component libraries. - [React 18 adoption is strong.](https://2023.stateofreact.com/en-US/usage/#react_version) Devographics [![\](https://copm.s3.amazonaws.com/f3c2e775.png)](https://go.clerk.com/o65GuW7) [Build a Waitlist with Clerk User Metadata](https://go.clerk.com/o65GuW7) β€” Discover how to implement a waitlist in your app using Clerk's user metadata, including setting up an admin dashboard for efficient user access management. This guide simplifies controlling user entry and enhances your app's onboarding workflow. Clerk | Complete User Management sponsor [How Airbnb Smoothly Upgrades React](https://medium.com/airbnb-engineering/how-airbnb-smoothly-upgrades-react-b1d772a565fd) β€” Airbnb has recently completed an upgrade of all its Web-facing sites from React 16 to React 18. Few of us get to work on such large systems, but Airbnb’s strategies and processes could provide some inspiration for your own upgrades. Andre Wiggins (Airbnb) πŸ“Ί Over on YouTube, Theo has a video about [how the New York Times saw performance improvements](https://www.youtube.com/watch?v=_6kDnkeReKo) by upgrading to React 18, too. _(We recently featured [the NYT's post](https://open.nytimes.com/enhancing-the-new-york-times-web-performance-with-react-18-d6f91a7c5af8) that inspired Theo's take.)_ **IN BRIEF:** - [Astro 4.12](https://astro.build/blog/astro-4120/) has been released with experimental support for _server islands_, a way to integrate static HTML and server-side generated components. You can [see a demo here.](https://server-islands.com/) - Vercel's [_Turbopack_ bundler is moving home](https://vercel.com/blog/turbopack-moving-homes) into Next.js's monorepo. While it's not Next.js-exclusive, the Vercel team wants to focus on its development more and thinks it'll be a better place to do that. [How to Choose the Best Rendering Strategy for Your App](https://vercel.com/blog/how-to-choose-the-best-rendering-strategy-for-your-app) β€” Get a feel for the differences between Static Site Generation (SSG), Server-Side Rendering (SSR), Client-Side Rendering (CSR), Incremental Static Regeneration (ISR), and Partial Prerendering (PPR). Alice Alexandra Moore (Vercel) [DRY – A Common Source of Bad Abstractions](https://swizec.com/blog/dry-the-common-source-of-bad-abstractions/) β€” The pursuit of avoiding repetition at all costs can sometimes result in crude, hard to maintain code. Think about the actual _concerns_ involved and you might find a better way to break things down. Swizec Teller [Use `useId()` Instead of Hand-Making IDs](https://reacttraining.com/blog/use-useid-instead-of-hand-making-ids) β€” Why to use `useId` instead of hand-made IDs to link two DOM nodes for accessibility. Brad Westfall πŸ“„ [How to Optimize Next.js App Performance with Lazy Loading](https://www.freecodecamp.org/news/next-js-performance-optimization/) Tapas Adhikary πŸ“„ [Rendering Prisma Queries with React Table: The Low-Code Way](https://zenstack.dev/blog/react-table) Yiming (ZenStack) πŸ›  Code, Tools & Libraries [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/nsqx2xasysng6tibnpg6.jpg)](https://margelo.github.io/react-native-filament/) [React Native Filament: A 3D Rendering Engine for React Native](https://margelo.github.io/react-native-filament/) β€” It’s fast, native 3D rendering with a React touch. Rendering takes place on a separate thread for efficiency, and on iOS, Filament uses the efficient native _Metal_ API. [GitHub repo](https://github.com/margelo/react-native-filament) and some [pretty good docs, too.](https://margelo.github.io/react-native-filament/docs/guides/camera) Marc Rousavy πŸ“… [React DayPicker: A Component to Create Date Picker Controls](https://daypicker.dev/) β€” There are a lot of date selection components out there, but not many are ten years old with 6000 GitHub stars. DayPicker focuses on providing the basics for you to then style and customize as you wish - it complies with modern accessibility requirements too. [GitHub repo.](https://github.com/gpbl/react-day-picker) Giampaolo Bellavite πŸ“° Classifieds πŸ¦‘ [React Rally](https://ti.to/react-rally/react-rally-2024/discount/ReactStatus) is back! Aug 12-14 Park City UT, workshops, learning, and networking. Use discount code [ReactStatus](https://ti.to/react-rally/react-rally-2024/discount/ReactStatus) for 25% off. --- 🐘 Postgres user? Be sure to check out our sister newsletter, [Postgres Weekly.](https://postgresweekly.com/) πŸ—ΊοΈ [GeoStyler 15.0: UI Components for Map Styling](https://geostyler.org/) β€” Build flexible user interfaces for map styling in the browser. GeoStyler - [React Spectrum, Summer Release](https://react-spectrum.adobe.com/releases/2024-07-22.html) – React implementation of Adobe's Spectrum design system. - [React Menu 4.2](https://szhsin.github.io/react-menu/) – Component for building accessible menus, dropdowns, submenus, etc. - [react-native-bootsplash 6.0](https://github.com/zoontek/react-native-bootsplash/releases/tag/6.0.0) – Show a splash screen during startup. - [Tinybase 5.1](https://github.com/tinyplex/tinybase/releases/tag/v5.1.0) – The reactive data store for local‑first apps. - [Wasp 0.14](https://github.com/wasp-lang/wasp/releases/tag/v0.14.0) – [Wasp](https://wasp-lang.dev/) is a Rails-like framework for React, Node.js and Prisma. - [Preact 10.23](https://github.com/preactjs/preact/releases/tag/10.23.0) – The 3KB React compatible alternative. - [MUI X 7.11](https://github.com/mui/mui-x/releases/tag/v7.11.0) – Popular React component suite. Curated by Peter Cooper and Terence C. Gannon. A **[Cooperpress](https://cooperpress.com/)** publication. [Change your email address](https://react.statuscode.com/edit_subscription/*|UID|*) or[Stop getting this newsletter](https://react.statuscode.com/leave/*|UID|*) Β© Cooper Press Ltd Β· Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom