Being aware of the parent/owner component distinction can help isolate updates and increase rendering performance.
There are two, similar but different component trees in React. Being aware of this difference can help you better structure your React application.
Dealing with multiple promise efficiently using the Promise concurrency methods, visualized.
Reacts API includes several optional and alternative parameters which provide additional behavior like optimization or other extras. Let’s look at those as animated diagrams.
A visual, spatial overview of the React API.
A first look at the useSyncExternalStore hook, its rationale, its caveats and its non-library purposes.
ref callbacks are a little known feature in React, they’re used to perform an action when React attaches or detaches a ref to a DOM element. ref callbacks have a few use cases, let’s look at some.
An explorable visualization of the modern HTML elements.
An interactive timeline showing how a React component with hooks runs including a quiz of React Riddles to test your knowledge.
Cleaner conditional rendering in React by matching values using component maps, optionally, lazy-load components to make a “lazy component map”
useReducer is not just for complex state-updating logic, it can be used for commonplace state updates; state updates that are not complex, and not super simple either; medium, mundane reducers.
There are a few cases where the React devtools can’t infer a name for a component, use displayName to avoid anonymous components in the devtools.
useReducer is not just for complex state-updating logic, it can be used for very simple state updates. One of the reducers two arguments can be ignored, making it either actionless or stateless.
Some small React tricks you may or may not have seen before.
In React, you can reuse state updater functions by moving them to module scope.
Quick, semi-organized thoughts on why I’m starting a personal site
An Observable notebook ‘explainable’ to learn what JavScript typed arrays are, how they work and when to use ’m.