--- title: "What's new for React 18?" publication: "React Status" issue: 258 published_at: "2021-09-29" canonical_url: "https://react.statuscode.com/issues/258" --- Plus listen to how React initially gained traction. | #​258 — September 29, 2021 [Read on the Web](https://react.statuscode.com/issues/258) React Status ⚛️ Your weekly React news digest, _every Wednesday_. [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/kjf1x9hxcpcpdst4g4vi.jpg)](https://www.robinwieruch.de/react-component-to-image) [Generating an Image from a Rendered React Component](https://www.robinwieruch.de/react-component-to-image) — Rather than implementing separate logic for downloadable images, why not use this straightforward method of creating a JPG or PNG from the component which has already rendered? [html2canvas](https://github.com/niklasvh/html2canvas) does the heavy lifting here. Robin Wieruch ▶[How React Got Traction, with Pete Hunt](https://swyx.transistor.fm/episodes/how-react-got-traction) — [The Swyx Mixtape](https://swyx.transistor.fm) is Shawn’s curated excerpts from other podcasts covering a broad range of subjects. In this episode (of just 11 minutes) his pick is a conversation between original React Core Team member Pete Hunt and Steve Krause from the [Future of Coding](https://futureofcoding.org/episodes/) podcast. Shawn 'Swyx' Wang podcast [![\](https://copm.s3.amazonaws.com/78ea9f9f.png)](https://buttercms.com/react-cms/?utm_source=reactstatus&utm_medium=email&utm_campaign=canyouupdateoursite) [ButterCMS - #1 Rated Headless CMS. Melts into React Apps](https://buttercms.com/react-cms/?utm_source=reactstatus&utm_medium=email&utm_campaign=canyouupdateoursite) — ButterCMS is the #1 rated Headless CMS for React. Enable your marketing team to update website content w/ our easy to use dashboard. Fast content API for modern apps. Secure. Scalable. Less Code. Try free today for 30 days. BUTTERCMS sponsor [What's New in React 18?](https://yagmurcetintas.com/journal/whats-new-in-react-18) — A general roundup of what’s turning up in the next (_not yet released_) major version of React. Yagmur Cetin Tas [Creating React Components from the Command Line with Agrippa](https://t.co/auuiuXtVcm?amp=1) — Last week in [issue 257](https://react.statuscode.com/issues/257) we featured the [Agrippa](https://github.com/NitzanHen/agrippa) library. Now here’s a walkthrough of just how to use it. Nathan Sebhastian [How to Build More Accessible React Apps](https://www.freecodecamp.org/news/react-accessibility-tools-build-accessible-react-apps/) — A thorough-yet-still-succinct guide to making your React apps [accessible](https://en.wikipedia.org/wiki/Web_accessibility). Besides being simply the right thing to do, there are SEO benefits, an improved UX experience for _all_ users and (in some locales) it will keep you on the right side of the law. Joseph Mawa ['My React App is Slow and I Don't Know Why'](https://alexsidorenko.com/blog/react-performance-tools/) — When you encounter performance issues in your React apps, what performance monitoring tools are available? Three quick suggestions from Alex here. Alex Sidorenko Jobs [React Native Engineer at IGN (Remote)](https://jobs.jobvite.com/careers/ign/job/o1l4ffwp) — IGN, leading publisher of video game & entertainment news, is seeking a full time engineer to join us and help build the next generation of mobile apps. Interested? We'd love to talk. IGN [Senior Software Engineer, Full Stack](https://forgeglobal.com/careers) — Forge unlocks liquidity & growth in the private market. Seeking collaborative SWEs to innovate & scale our products and platforms. Forge [Find React Jobs with Hired](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) — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It's free for job-seekers. Hired [Fifty Solitaires: A Beginning](https://www.notjustphysics.com/2021/09/fifty-solitaires-a-beginning/) — What started out as a bet for a case of beer many years ago morphed into a present day React programming challenge: to implement the game of Solitaire. There’s a catch though: it must implement _50_ different sets of gameplay rules. The author invites us to follow along. Holger Schmitz [A Quick Guide to Dropdown Menus With React](https://www.telerik.com/blogs/quick-guide-dropdown-menus-react?utm_medium=cpm&utm_source=reactstatus&utm_campaign=kendo-ui-react-blog-quick-guide-dropdown-menus&utm_content=brief-link) Progress KendoReact sponsor [7 Things You May Not Know About `useState`](https://thoughtspile.github.io/2021/09/27/usestate-tricks/) Vladimir Klepov [React Antipatterns to Avoid](https://t.co/ApJfDuYNsN?amp=1) Iskander Samatov [NativeScript vs React Native: Which One to Choose for Native Dev in 2021](https://t.co/nt6q3OLbpD?amp=1) Max Tsurbeliov [React is Declarative: What Does It Mean?](https://alexsidorenko.com/blog/react-is-declarative-what-does-it-mean/) Alex Sidorenko 🛠 Code and Tools [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/pbe78jlmb8dyqftuiaye.jpg)](https://github.com/iddan/react-spreadsheet) [React Spreadsheet: A Simple Component Implementation for the Pervasive UI Element](https://github.com/iddan/react-spreadsheet) — A pre-release version of the component which will still save considerable time over building one from scratch. [Example here](https://iddan.github.io/react-spreadsheet/). Iddan Aaronsohn [React Suite: v5.0 of a Popular Component Library](https://github.com/rsuite/rsuite) — Major changes include enhanced accessibility, support for CSS variables, refactoring components to employ hooks and [numerous other improvements](https://rsuitejs.com/guide/v5-features/) along with a few [breaking changes](https://rsuitejs.com/guide/v5-features/#handling-breaking-changes). React Suite [react-three-flex: The CSS Flexbox for react-three-fiber](https://github.com/pmndrs/react-three-flex) — Based on Facebook’s [Yoga](https://github.com/facebook/yoga) cross-platform layout engine, this library lets you wrap 3D objects in `` tags within a `` container. Poimandres [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/v1632908014/ykvwadv3i76shv9xvx8z.png)](https://burdy.io/) [Burdy: A New Contender in the Headless CMS Space](https://burdy.io/) — An apparently ‘clean sheet’ approach to [headless CMS](https://en.wikipedia.org/wiki/Headless_content_management_system), which is Dockerized, AWS-ready, supports a variety of mainstream relational databases and is built with React and TypeScript. Burdy Technologies ## ⚡️ Quick Bits: - [react-native-flash-message](https://github.com/lucasferreira/react-native-flash-message) — A flashbar and top notification alert utility. - [react-async-hook](http://github.com/slorber/react-async-hook) — A hook for any async operation in React components. - [react-native-scrollable-tabview](https://github.com/itenl/react-native-scrollable-tabview) — Make the most of that tiny screen. - [react-device-detect](https://github.com/duskload/react-device-detect) — Rendering which reflects the device being used. - [react-d3-cloud](https://github.com/Yoctol/react-d3-cloud) — A [word cloud](https://en.wikipedia.org/wiki/Tag_cloud) component for React based on [d3-cloud](https://github.com/jasondavies/d3-cloud). This issue was curated by Terence C. Gannon 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