--- title: "Explaining why React re-renders" publication: "React Status" issue: 353 published_at: "2023-09-06" canonical_url: "https://react.statuscode.com/issues/353" --- Plus CSS-in-JS has 'plateaued' and bringing 3D models into React apps. | #​353 — September 6, 2023 [Read on the Web](https://react.statuscode.com/issues/353) **👋 If you didn't receive any issues recently, we were on vacation.. but we're back!** It's been a quiet summer for the React world, though, so catching up won't be too tricky – let's get moving.. 😉 __ _Peter Cooper and the Cooperpress team_ Together with [![Storyblok\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,e_trim,w_500,h_100/e_make_transparent/co_white,e_outline:7/pi39lhmxzhcqyja90jku.png)](https://www.storyblok.com/lp/o-reilly-report-decoupled-applications-and-composable-web-architectures?utm_source=react_status&utm_medium=sponsor&utm_campaign=DGM_GC_CP_LEA&utm_content=reactstatusnewsletter_sep2023) React Status [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/w4vdqdcqrbdy9kz1vxo4.jpg)](https://reacthandbook.dev/automated-testing) [A Wide View of Automated Testing in React Apps](https://reacthandbook.dev/automated-testing) — A straightforward and to the point introduction as to why you might use automated testing, how to get going in the scope of a React app, and _what_ to be testing. While this is the newest page in the handbook, [the rest of the handbook](https://reacthandbook.dev/) is well worth a look, too. The React Handbook [Astro 3.0 Released](https://astro.build/blog/astro-3/) — Astro _isn’t_ a ‘React framework’ like Next.js, but more a turbo charged static site generator with some dynamic and interactive chops by way of [‘islands.’](https://docs.astro.build/en/concepts/islands/) You can use numerous libraries with it but, admittedly, React is probably the most popular. v3 implements the View Transitions API ([more on that here](https://developer.chrome.com/blog/astro-view-transitions/)), making transitions possible without being an SPA, and also includes improvements to Image Optimization, Fast Refresh JSX and more. Astro Team The Astro team has also announced [Vercel is Astro's new official hosting partner.](https://astro.build/blog/vercel-official-hosting-partner/) [![\](https://copm.s3.amazonaws.com/892f042c.png)](https://www.storyblok.com/lp/o-reilly-report-decoupled-applications-and-composable-web-architectures?utm_source=react_status&utm_medium=sponsor&utm_campaign=DGM_GC_CP_LEA&utm_content=reactstatusnewsletter_sep2023) [Decoupled Applications and Composable Web Architectures](https://www.storyblok.com/lp/o-reilly-report-decoupled-applications-and-composable-web-architectures?utm_source=react_status&utm_medium=sponsor&utm_campaign=DGM_GC_CP_LEA&utm_content=reactstatusnewsletter_sep2023) — Get your hands on the latest O'Reilly report on frontend composability, serverless backend implementations and modular design principles. This trending report is free courtesy of Storyblok, the CMS that helps developers build faster. Storyblok sponsor [Why React Re-Renders and When to Worry About It](https://punits.dev/jargon-free-intros/why-react-rerenders-and-when-to-worry-about-it/) — Beyond the topic itself, this is an interesting way to present information - basically a cross between a presentation and a comic. Tezify 👀 The Next.js docs have added [a page on migrating from Vite to Next.js.](https://nextjs.org/docs/app/building-your-application/upgrading/from-vite) ❓ On his new [_Pro Next.js_ blog,](https://www.pronextjs.dev/articles) Jack Herrington is posting frequently, tackling questions like [Should I Use Server Actions or APIs?](https://www.pronextjs.dev/should-i-use-server-actions-or-apis), [Should I Use Inheritance in React?](https://www.pronextjs.dev/should-i-use-inheritance-in-react) and [Should I Use React-Query or useEffect/fetch?](https://www.pronextjs.dev/should-i-use-react-query-or-useeffect-fetch) 📱 Jamie Birch attempts to tie together the various goings-ons in the React Native space to figure out the [things to look forward to in React Native.](https://buttondown.email/whatever_jamie/archive/things-to-look-forward-to-in-react-native/) 📺 A look at what happened when NBC Universal's _Peacock_ streaming app [switched from React Native to a purely native app](https://www.emergetools.com/deep-dives/peacock) earlier this year and why the switch was made. 🎨 [_"The CSS-in-JS sector has plateaued,"_](https://2023.stateofcss.com/en-US/css-in-js/) according to the results of the latest _State of CSS_ survey. [The Underlying Mechanisms of React’s Concurrent Mode](https://andreigatej.dev/blog/the-underlying-mechanisms-of-reacts-concurrent-mode/) Andrei Gătej [Create a Hand-Drawing Component with React Native Skia](https://spin.atomicobject.com/2023/07/26/react-native-skia/) Gage Vander Clay ▶[Why I Stopped Using Next.js and Chose Astro Instead](https://www.youtube.com/watch?v=BoeZqPaYw9s) James Q Quick ▶[tRPC + Next.js App Router = Simple Typesafe APIs](https://www.youtube.com/watch?v=qCLV0Iaq9zU) Jack Herrington 🛠 Code and Tools [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/k8cye0fqz3jsyc7vc4r4.jpg)](https://platejs.org/) [Plate: Roll Your Own Rich Text Editor](https://platejs.org/) — A framework for building React and Slate-based rich text editors lets you select the specific features and functionality you need. [GitHub repo.](https://github.com/udecode/plate) Ziad Beyens [React Email: Build and Send Emails Using React and TypeScript](https://react.email/) — High-quality components for creating good looking emails using React and TypeScript while taking care of some email client inconsistencies. There's a [comprehensive tutorial](https://react.email/docs/introduction) to get you started. [GitHub repo.](https://github.com/resendlabs/react-email) Bu Kinoshita and Zeno Rocha [Frontend Performance Monitoring 101](https://sentry.io/resources/frontend-performance-monitoring-101/?utm_medium=paid-community&utm_source=reactstatus&utm_campaign=performance-fy24q3&utm_content=newsletter-performanceworkshop-register) — Learn the basics of React application performance monitoring to see (and fix) slow faster. Join us for a live AMA. Sentry sponsor [gltfjsx: Turn glTF 3D Models into JSX Components](https://github.com/pmndrs/gltfjsx) — glT.. what now? [glTF](https://en.wikipedia.org/wiki/GlTF) is a standard format for storing 3D scenes and models and this tool can help you bring them into your react-three-fiber powered apps. Poimandres 💡 If you'd prefer a full tutorial, [Thomas Derflinger has one here.](https://tderflinger.com/en/react-three-fiber-displaying-gltf-model) [React Currency Input Field Component](https://github.com/cchanxzy/react-currency-input-field) — A component that aims to capture the nuances of currency input, if a freeform approach doesn’t cut it for you. Try it out with [the live demo.](https://cchanxzy.github.io/react-currency-input-field/) Chun Chan 📰 Classifieds 💻 Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. [Create a free profile now](https://hired.com/join/?utm_source=newsletter&utm_medium=sponsor&utm_campaign=%28b2c%29%28l-all%29%28r-all%29%28cooper-reactstatus%29&utm_content=find-your-next-job). --- 📅 [React Brussels](https://www.react.brussels/) is a React conference taking place in the heart of Europe (or online, if you prefer) on October 13. There's a fantastic array of speakers and tickets are available now. --- 🎉 Our sister newsletter, [Node Weekly](https://nodeweekly.com/) has just celebrated [its 500th issue.](https://nodeweekly.com/issues/500) Check it out if Node.js is part of your stack. _Classifieds_ is a way to share projects, services, events, or jobs you may find useful, replacing our job listings section. [CopilotKit: 'Copilot' Features for any React App](https://github.com/RecursivelyAI/CopilotKit) — Provides a drop-in textarea replacement that has GitHub Copilot-style LLM-based autocompletion features (powered by OpenAI and/or Vercel AI, for now). Recursively [Tabler Icons: Over 4500 4650 Vector Icons for the Web](https://tabler-icons.io/) — MIT-licensed icons you can use by either copying the SVG or using [@tabler/icons-react](https://www.npmjs.com/package/@tabler/icons-react) to take them direct into a React app. I’ve been using this recently - it’s good. Tabler _QUICK RELEASES:_ - [React Native VisionCamera 3.0](https://www.react-native-vision-camera.com/) ↳ Feature-rich camera component. - [Sonner 0.7](https://sonner.emilkowal.ski/) ↳ Opinionated toast notification component. - [React Native Share 9.4](https://react-native-share.github.io/react-native-share/) ↳ Simple data sharing to social apps. - [react-native-permissions 3.9](https://github.com/zoontek/react-native-permissions/releases/tag/3.9.0) ↳ Unified permissions API for React Native. - [Recharts 2.8](https://recharts.org/en-US/) ↳ Chart library built atop React and D3. - [🌊 React Wavify 1.9](https://github.com/woofers/react-wavify) ↳ Animated wave component. [Demo shows all.](https://jaxs.onl/react-wavify/) - [react-timeago 7.2](https://github.com/nmn/react-timeago) ↳ Turn date props into live time-ago elements. - [Ink 4.4](https://github.com/vadimdemedes/ink) ↳ React for interactive command-line apps. This issue was curated by Terence C. Gannon and Peter Cooper and edited by the Cooperpress team. 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