React Newsletter #267

A major minor release of RTK Query, Why React Hooks can't be conditioned, and improving performance by 10x


This week’s issue is sponsored by SyncFusion.

The Syncfusion React UI components library contains over 65 high-performance, lightweight, modular, and responsive UI components in a single package. You also get a built-in theme studio including material, bootstrap, and fabric design components.

👉 Check out their free trial.


News

RTK Query releases v1.6

This release adds the new RTK Query data fetching APIs to Redux Toolkit. It also adds multiple new options to createAsyncThunk for including meta fields and working with results, updates dependencies to Redux 4.1 and Immer 9, and includes a complete rewrite of the build toolchain with additional "modern" build artifacts in the package.

Mark Erikson calls it "a minor release in terms of semver, but a huge update in terms of functionality, scope, and effort."


Articles

Simplify React state management with Hookstate

Hookstate is a fast and flexible state management tool based on the React state Hook. It’s a small library packed with features that include both global and local states, as well as partial state updates and asynchronously loaded states. In this article, Ebenezer Don introduces Hookstate and lets you see it in action by building a demo chat app.

Why React Hooks cannot be conditioned

Thomas Belin writes about his investigation into how React Hooks work and why they cannot be conditioned.

Journey of Improving React App Performance by 10x

In this article, Mayank Sharma discusses his team's journey of improving the memory footprint of their app from ~1.5GB to ~150Mbs, thereby improving the performance of the application by 10x and ensuring no more "Aw Snap!" error messages from Chrome.


Tutorials

Introduction to Framer Motion for React

In this tutorial, Manusha Chethiyawardhana writes about putting Framer Motion to the test, while discussing its core features and examples with React, React Hooks, and Styled Components.

Getting Started With Webpack

Nwani Victory wrote this in-depth intro to Webpack that covers why bundlers like Webpack were created, demonstrates how to use Webpack in various settings, and gives some helpful links to other Webpack resources.

Rendering in an iframe in a React app

This quick tutorial by Sharad Chand walks through how to render within an iframe in a React app. You might find this useful if you want to build a CodeSandbox alternative or Storybook alternative or a website builder.


Jobs

2x Sr. Frontend Engineers - React (100% Remote)

Close.com is looking for two experienced individuals that have a solid understanding of React and want to help design, implement and launch major, user-facing features. They are a 100% globally distributed team of ~45 high-performing, happy people that are dedicated to building a product our customers love.


Projects

@remotion/three

A small package of two new APIs for integrating React Three Fiber with Remotion, created by Jonny Burger.

Snipsnap Templates

A new VS Code extension for managing, sharing, and using code templates. It helps you create a flexible folder and file structures that you can easily recreate with just a few clicks using the VS Code Extension.

Windmill React UI 1.0

A component library for building fast and accessible development of gorgeous interfaces that just released v1.0, created by Estevan Maito.

Gooey-React

A tiny React component for creating the "gooey effect" (aka shape blobbing) that's often used in different web sites and blog posts.


Videos

Building a Modern, Full Stack App with Dark Mode Support

This 30-minute video is Part 1 in a video series that teaches various React fundamentals like state and routing while building a more advanced To-do list app. Part 2 goes over setting up the back end and authentication.

made with ❤️ by ui.dev