--- title: "A roundup of React component libraries" publication: "React Status" issue: 241 published_at: "2021-06-02" canonical_url: "https://react.statuscode.com/issues/241" --- Plus looking at Svelte as an option for React developers. | #​241 — June 2, 2021 [Read on the Web](https://react.statuscode.com/issues/241) React Status ⚛️ _Your weekly React news digest, every Wednesday_ [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/czenjf48yhxvdz4j4spg.jpg)](https://retool.com/blog/react-component-libraries/) [Top React Component Libraries (2021 Edition)](https://retool.com/blog/react-component-libraries/) — The folks at [Retool](https://retool.com) just released the 2021 update of their list of top React libraries. But it’s more than just a list, but rather a detailed synopsis seemingly based on first-hand experience. Kevin White [Svelte for the Experienced React Dev](https://css-tricks.com/svelte-for-the-experienced-react-dev/) — [Svelte](https://svelte.dev) distinguishes itself from other frameworks by gaining efficiency with build time (as opposed to run time) compilation to vanilla JS. This walks through the basics with a React-leaning eye. Adam Rackis [![\](https://copm.s3.amazonaws.com/4ace414e.jpg)](https://learn.launchdarkly.com/effective-feature-management/?utm_source=cooperpress&utm_medium=display&utm_campaign=q4-cooperpress&utm_content=ebook_oreilly_efm) [[Free Download\] Guide to Effective Feature Management](https://learn.launchdarkly.com/effective-feature-management/?utm_source=cooperpress&utm_medium=display&utm_campaign=q4-cooperpress&utm_content=ebook_oreilly_efm) — Learn feature management practices to accelerate release cycles and deploy every 6 hours, instead of every 6 weeks. LaunchDarkly sponsor [useStateMachine: The ½KB State Machine Hook](https://github.com/cassiozen/useStateMachine) — It only makes sense to bundle a state machine into a hook. We have featured a number of Cassio’s videos in the past, so it’s no surprise there’s a [video walkthrough](https://www.youtube.com/watch?v=EHQu6PMeqIc) with examples which illustrate its use. Cassio Zen ['Why We Need to Stop Using React'](https://t.co/Wo42UoizzO?amp=1) — Every once in a while we like to present an alternative perspective on React, just to keep everybody honest. This article has generated some light, for sure, but as you might expect quite a bit of heat to go along with it. What's curious is that in a followup, [Angular is pitched as the better alternative](https://javascript.plainenglish.io/throw-out-react-and-pick-up-angular-8b578bb7cabc). Sam Redmond _P.S. Don't stop using React.._ 😄 [Introduction to Framer Motion for React](https://t.co/mRUN8EscAL?amp=1) — A reasonably short, focused, step-by-step tutorial on the popular [animation library](https://www.framer.com). Manusha Chethiyawardhana Jobs [React Developer at X-Team (Remote)](https://x-team.com/remote-react-developer-jobs/?utm_source=cooperpress&utm_medium=email-ad&utm_campaign=react) — Join the most energizing community for developers and work on long-term projects for Riot Games, FOX, Sony, Coinbase, and more. X-Team [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) — Take 5 minutes to build your free profile & start getting interviews for your next job. Companies on Hired are actively hiring right now. Hired 📘 Tutorials and Stories [How to Use Testing Library to Test Storybook](https://t.co/V5LJMoSlG7?amp=1) — You may already be using [Storybook](https://storybook.js.org) to catalog all your key components states. Now you can re-use that logic with [React Testing Library](https://testing-library.com/docs/react-testing-library/intro/). Yann Braga [Dynamic vs Static Routing in React](https://t.co/TgUGVyOX1A?amp=1) — Static routes are defined upfront in a centralized location in your app, whereas dynamic routes are initialized on render and can provide more flexibility. This explains the difference between the two and the situations where each is applied. Chameera Dulanga [Why Tracing Might Replace (Almost) All Logging](https://go.lightstep.com/register-tracing-will-replace-logging-guide-co21?utm_campaign=react&utm_source=cooper&utm_medium=Email) Lightstep sponsor [Journey of Improving React App Performance by 10x](https://t.co/qnN8obF6Sl?amp=1) — The first of three articles focused on performance improvement: the first starts with some ways of figuring out why application performance is suffering and then provides four specific, prescriptive techniques for eliminating the bottlenecks. Mayank Sharma [Top Seven Libraries for Blazingly Fast React Applications](https://t.co/3n5Rtwz0ax?amp=1) — The second article in this mini-series provides some specific recommendations on libraries which will also help make your app even faster. Mohammad Faisal [Seven Steps to Modernize and Optimize Your React App](https://t.co/c3f4Roio1c?amp=1) — The third and final article in this mini-series provides still more recommendations for making your app’s performance truly stellar. Mucahit Gurbuz 🛠 Code and Tools [xstyled 3.0: A Utility-First CSS-in-JS Framework Built for React](https://xstyled.dev/) — A CSS-in-JS framework built for React with props based utilities like `display`, `fontSize` or `rotate`. Greg Bergé [Windmill React UI: Fast, Accessible and 'Gorgeous' UIs](https://windmillui.com/react-ui) — This brand new, pre-1.0 UI is stirring up considerable interest. [GitHub repo.](https://github.com/estevanmaito/windmill-react-ui) Estevan Maito [react-swipeable-views: A 'Swipeable' UI Made Easy](https://github.com/oliviertassinari/react-swipeable-views) — Swiping has become a de-facto standard within app navigation on mobile devices, and this library provides the basic tools to implement it. Try the [demo](https://react-swipeable-views.com/demos/demos/) on your phone or tablet or even, less naturally, your non-touch device. Olivier Tassinari [react-simple-flowchart: Flowchart Component Based on flowchart.js](https://github.com/alwinn1977/react-simple-flowchart) — The flowchart is celebrating it’s [**100th** anniversary](https://en.wikipedia.org/wiki/Flowchart#History) and it’s _still_ an effective way of diagramming process flow. Alex Vinokurov [React Editor Demo: Add an Editor Component the Easy Way](https://www.telerik.com/blogs/react-editor-demo-add-editor-component-easy-way?utm_medium=cpm&utm_source=reactstatus&utm_campaign=kendo-ui-react-blog-easy-react-editor&utm_content=sponsored-link) — Let’s remove the hassle of adding a Rich Text Editor into your app and implement some neat features while we're at it. [Learn how](https://www.telerik.com/blogs/react-editor-demo-add-editor-component-easy-way?utm_medium=cpm&utm_source=reactstatus&utm_campaign=kendo-ui-react-blog-easy-react-editor&utm_content=sponsored-link%20). Progress KendoReact sponsor [react-easy-crop: Crop Both Images and Video](https://github.com/ricardo-ch/react-easy-crop) — Switzerland’s largest online marketplace—[Ricardo](https://www.ricardo.ch)—contributes this richly-featured image _and_ video cropping tool. There are lots of CodeSandbox examples illustrating its various capabilities. Ricardo [React Slider: Flexible Input of Numeric Ranges](https://github.com/zillow/react-slider) — The popular UI affordance can be configured in a wide variety of ways, as illustrated with their [live demos](https://zillow.github.io/react-slider/) included in their documentation. Zillow **⚡️ Quick Bits:** Interesting projects which you may have missed: - [react-native-create-thumbnail](https://npmjs.com/package/react-native-create-thumbnail) — Video thumbnail generator with support for both local and remote sources. - [React Grid System](https://github.com/sealninja/react-grid-system) — [Bootstrap](https://getbootstrap.com)-like grid system for React. - [react-textarea-autosize](https://github.com/Andarist/react-textarea-autosize) — Like `textarea`, except that automatically resizes to fit the content. - [react-rating-tooltip](https://github.com/vilvaathibanpb/react-rating-tooltip) — Capture user rating/reviews with this component. 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