Digests » 352

sponsor

How To Build an Accessible React Data Grid (Tutorial)

How do you make a React table (data grid) component accessible? Read this blog post for a comprehensive tutorial by one of our most experienced software engineers and accessibility experts.

this week's favorite

Accessible React forms

The last post covered a couple of tools that help developers create accessible apps. Forms are a common part of many apps, and they must be accessible so that many different people can use them efficiently. This post covers several points on creating accessible React forms.

React components composition: How to get it right

What I want to do today, is to offer a few techniques and rules, that could help identify when and how to extract components on time and how not to fall into an over-engineering trap. But first, let’s refresh some basics: what is composition and which compositions patterns are available to us?

Removal of implicit children

With React 18 we have the opportunity in @types/react to fix long-standing issues we had to deal with for a long time. We originally wanted to fix these in React 17, but held off because React 17 was a big step in enabling gradual migration. One of these changes is removal of implicit children in React.FunctionComponent types. I’ll try to explain why we want to make this change and how you can ease migration.

Why and how you should always cleanup side effects in React useEffect

Side effects happen a lot in React applications (in web applications generally. These effects include making asynchronous API calls, updating the DOM, creating sockets, etc. These side effects can happen when a button is clicked, when a form is submitted, or when a component mounts.

An overlooked factor for performance optimization in React

Many people, including me, sometimes like to seek out simple answers to problems they are faced with. It is relatively easy to arrive at a generic conclusion for most cases – we often forget or intentionally leave out edge cases. In the context of performance optimization in React, one of these edge cases is the position of your component in the component tree.

Join over 12,800 readers for a free weekly email with fresh news, articles and tutorials.