A rather geeky/technical weblog, est. 2001, by Bramus
Ace talk by Shawn Wang: The design of React Hooks requires a good understanding of closures in JavaScript. In this talk, we’ll reintroduce closures by building a tiny clone of React! This will serve two purposes – to demonstrate the effective use of closures, and to show how you can build a Hooks clone in …
Dmitri Pavlutin has compared the several ways to fecthing data in React. Lifecycle methods had been for a long time the only solution to fetching. However fetching using them has problems with lots of boilerplate code, duplication, and reusability difficulties. Fetching using hooks is a better alternative: way less boilerplate code. Suspense’s benefit is declarative …
Continue reading “React: Fetching data with lifecycle methods, hooks, or suspense — a comparison”
React introduced hooks one year ago, and they’ve been a game-changer for a lot of developers. There are tons of how-to introduction resources out there, but I want to talk about the fundamental mindset change when switching from React class components to function components + hooks. The code-flow visualisations between the class component and function …
react-use – Browser APIs as React Hooks
react-use is a collection of React Hooks that wrap many browser APIs and functions. Want to track the geolocation of a device? Use useGeolocation. Want to read the battery status? Use useBattery. Etc. import {useBattery} from 'react-use'; const Demo = () => { const batteryState = useBattery(); if (!batteryState.isSupported) { return ( <div> <strong>Battery sensor</strong>: …
Kent C. Dodds: As hot as it is, React Hooks require a bit of a change in the way you think about React Component Lifecycles, State, and Side Effects and it can be easy to fall into problematic scenarios if you’re not thinking about React Hooks properly. So let’s look a bit at what pitfalls …
Continue reading “5 Tips to Help You Avoid React Hooks Pitfalls”
Yesterday, while at a workshop, React Hooks (intro here) became the subject of discussion between participants. Someone in the audience asked how to easily map the classes+lifecycle way of thinking onto hooks, as she had trouble doing so. In short, my recommendation was to no longer think in lifecycles but to think in effects, as …
Continue reading “React: Forget about component lifecycles and start thinking in effects”
useMemo and useCallback Insightful post by Kent C. Dodds on the costs and benefits of React’s useMemo and useCallback. We hear a lot that you should use React.useCallback to improve performance and that “inline functions can be problematic for performance,” so how could it ever be better to not useCallback? Just take a step back from React and …
Continue reading “React: When to use useMemo and useCallback“
Donovon has created this nice flowchart that explains the new lifecycle of a Hooks component. Comes in handy 😉 hook-flow →
useEffectToday Dan Abramov published an extensive deep dive into useEffect. The issue that many devs (who, including me, have been using componentDidMount before) are having, is that they now need to unlearn a few things It’s only after I stopped looking at the useEffect Hook through the prism of the familiar class lifecycle methods that …
setInterval Declarative with React HooksDan Abramov’s blog Overreacted is pure gold and contains a ton of information. Take today’s post “Making setInterval Declarative with React Hooks” for example, in which he explains why setInterval and Hooks (which should be released in today’s planned React 16.8 release) don’t play that nice together out of the box. // This won’t work …
Continue reading “Making setInterval Declarative with React Hooks”