--- title: "Using WebAssembly in creating React components" publication: "React Status" issue: 267 published_at: "2021-12-01" canonical_url: "https://react.statuscode.com/issues/267" --- Plus a no-nonsense React Router guide, and a Xmas themed React 18 course. | #​267 — December 1, 2021 [Read on the Web](https://react.statuscode.com/issues/267) React Status ⚛️ Your weekly React news digest, _every Wednesday_. [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/kymms6beqt6rzqttqdr5.jpg)](https://www.joshfinnie.com/blog/using-webassembly-created-in-rust-for-fast-react-components/) [Using WebAssembly (from Rust) to Create Fast React Components](https://www.joshfinnie.com/blog/using-webassembly-created-in-rust-for-fast-react-components/) — Just how easy is it to integrate Rust into a standard React workflow? Josh takes a look. This may seem a real meeting of buzzwords, but ideas like this have a way of turning into the future! Josh Finnie ▶[React Router v6 - The No Nonsense Guide](https://www.youtube.com/watch?v=9wm54eDHDI8) — We’ve mentioned the [React Router v6](https://reactrouter.com/) release a few times now, but here’s a ten minute screencast cutting down to the basics and showing it off. Mitchel S [![\](https://copm.s3.amazonaws.com/be71bcf3.png)](https://www.telerik.com/blogs/what-gantt-chart-anyway-when-use-react-apps?utm_medium=cpm&utm_source=reactstatus&utm_campaign=kendo-ui-react-awareness-general&utm_content=blog-gantt-chart-anyway) [What Is a Gantt Chart and When to Use It in Your React Apps](https://www.telerik.com/blogs/what-gantt-chart-anyway-when-use-react-apps?utm_medium=cpm&utm_source=reactstatus&utm_campaign=kendo-ui-react-awareness-general&utm_content=blog-gantt-chart-anyway) — The Gantt Chart - a component that can provide a ton of utility in very few scenarios. Jump into this blog to understand when you should consider using a Gantt and see how you can add one into your app with the help of the KendoReact UI library. Progress KendoReact sponsor [How To Maintain a Large Next.js App](https://www.smashingmagazine.com/2021/11/maintain-large-nextjs-application/) — Rather than trying to scale the ad hoc maintenance techniques used when the codebase was kicked off, here are tools which will keep the code in good shape as it grows. Nirmalya Ghosh 🎄📧 [React Holiday: A React 18 Advent Email Course](https://react.holiday/) — Last year this domain hosted an advent calendar of React tips. This year it’s a 25 day React 18 course of sorts. Free but behind an email wall. There’s a Discord too if you want to chat about it. Michael Chan [`useEffect` Sometimes Fires Before Paint: Why?](https://thoughtspile.github.io/2021/11/15/unintentional-layout-effect/) — Does your application have an annoying flicker which is hard to explain and even harder to diagnose? It could be that _[useEffect](https://reactjs.org/docs/hooks-effect.html)_ isn’t firing when you think it does. Vladimir Klepov [A React Folder Structure for Enterprise Level Apps](https://medium.com/@kolbysisk/react-folder-structure-for-enterprise-level-applications-f8384eff162b) — While these types of articles represent subjective opinion, it’s still instructive to compare your appoach to their’s to see how the two stack up. Kolby Sisk Jobs [Senior Full Stack Engineer (Remote)](https://grnh.se/5505867f2us) — Invoca is looking for passionate developers to join our team. Help build something awesome with React, GraphQL and Ruby on Rails. Invoca [React Developer at X-Team (Remote)](https://x-team.com/remote-react-developer-jobs/?utm_source=cooperpress&utm_medium=email-ad&utm_campaign=cooperpress-react&utm_content=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) — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It's free for job-seekers. Hired [Implementing Server-Sent Events (SSE) in Node and React](https://blog.tericcabrel.com/implement-server-sent-event-in-node-js/) — [Server-Sent Events](https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events) (SSE) is an often overlooked technology for sending live updates from a backend server to a frontend client without refreshing the page _or_ endless polling from JavaScript. This is a basic example. Eric Cabrel Tiogo [Introducing Svelte, and Comparing it to React and Vue](https://joshcollinsworth.com/blog/introducing-svelte-comparing-with-react-vue) — Born out of the New York Times’ demanding requirement to quickly build snappy interactive visualizations, [Svelte](https://svelte.dev) has only gone from strength to strength recently. Here's how it compares with what you may already know. Josh Collinsworth [Learning React Concepts with Sourcegraph: A Cheatsheet for Common Uses](https://learn.sourcegraph.com/learning-react-concepts-with-sourcegraph?utm_campaign=learnreact-ddg-tofu-q42021&utm_medium=newsletter&utm_source=react-status) Sourcegraph sponsor [Using `localStorage` for Persisting State With a Custom Hook](https://t.co/l7pLgtK8Ws?amp=1) — It seems not a week goes by where there isn’t yet another way of persisting state in React. The author takes a refreshingly straightforward approach: simply use[localStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage)? Damiano Magrini 🛠 Code and Tools [React PDF Reader 1.0: A Simple PDF Viewer Component](https://github.com/ZEISS/react-view-pdf) — A wrapper around [PDF.js](https://mozilla.github.io/pdf.js/), as used by Firefox. ZEISS Group [Goober: CSS-in-JS for Peanuts](https://github.com/cristianbote/goober) — A 1KB alternative to the 23KB combination of [styled-components](https://github.com/styled-components/styled-components) and [emotion](https://github.com/styled-components/styled-components). And they’ll pay you to make _goober_ smaller—if you can! Cristian Bote [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/swxursydlnvoxdcyyrh5.jpg)](https://teetow.github.io/elementary_grid/?tracks=0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0&kick=0&tone=stab) [Elementary Grid: A JS + Elementary Powered Music Creator](https://teetow.github.io/elementary_grid/?tracks=0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0&kick=0&tone=stab) — Attempt to be the next _deadmau5_ with this JavaScript powered grid music creator.. or at least have a fun 30 seconds. Johan Althoff [lottie-react-native: JSON-Based, Multi-Platform Animation](https://github.com/lottie-react-native/lottie-react-native) — Create animations with [Adobe After Effects](https://www.adobe.com/ca/products/aftereffects.html) and run them on React Native using [Lottie](https://lottiefiles.com). Lottie - React Native [React Virtual 2.9: Hooks for Virtualizing Scrollable Elements in React](https://github.com/tannerlinsley/react-virtual) — With a single headless hook you can work with row, column and grid level virtualization, get imperative scrolling when needed, custom scrolling function support, and more. Tanner Linsley ## ⚡️ NPM Corner: - [react-native-select-dropdown](https://npmjs.com/package/react-native-select-dropdown) — Highly customizable dropdown component. - [React Simple Rating](https://npmjs.com/package/react-simple-star-rating) — Make it easy for users to do star ratings. - [react-tree-graph](https://npmjs.com/package/react-tree-graph) — Render data as an SVG tree. - [react-native-oss-license](https://npmjs.com/package/react-native-oss-license) — License list generator. - [react-leaf-carousel](https://npmjs.com/package/react-leaf-carousel) — Infinite carousel with lazy loading. 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