6 days agoReact re-renders guide: why components re-renderThis is part 1 & part 2 of the full guide on React re-renders. The guide explains what are re-renders, what is necessary and unnecessary re-render, what can trigger a React component re-render. The full guide also includes the most important patterns that can help prevent re-renders and a few…React5 min read
Jul 11The mystery of React Element, children, parents and re-rendersOriginally published at https://www.developerway.com. The website has more articles like this 😉 In one of the previous articles about React composition, I showed an example of how to improve performance of a component with heavy state operations by passing other components to it as children instead of rendering them directly…React11 min read
Jun 15How to useMemo and useCallback: you can remove most of themOriginally published at https://www.developerway.com. The website has more articles like this 😉 If you’re not completely new to React, you’re probably already at least familiar with useMemo and useCallback hooks. And if you work on a medium to large-scale application, chances are you can describe some parts of your app…React12 min read
May 25React project structure for scale: decomposition, layers and hierarchyOriginally published at https://www.developerway.com. The website has more articles like this 😉 How to structure React apps “the right way” seems to be a hot topic for as long as React existed. React’s official opinion on it is that it “doesn’t have opinions”. This is great, it gives us total…React20 min read
May 10React key attribute: best practices for performant listsOriginally published at https://www.developerway.com. The website has more articles like this 😉 React “key” attribute is probably one of the most “autopilot” used features in React 😅 Who among us honestly can say that they use it because of “…some valid reasons”, rather than “because eslint rule complained at me”…React10 min read
Published in Level Up Coding·Apr 12React components composition: how to get it rightOne of the most interesting and challenging things in React is not mastering some advanced techniques for state management or how to use Context properly. More complicated to get right is how and when we should separate our code into independent components and how to compose them properly. I often…React15 min read
Mar 23Implementing advanced usePrevious hook with React useRefAfter Context, ref is probably the most mysterious part of React. We almost got used to the ref attribute on our components, but not everyone is aware, that its usage is not limited to passing it back and forth between components and attaching it to the DOM nodes. We actually…React9 min read
Published in JavaScript in Plain English·Mar 1Have React Hooks Made Higher-Order Components Obsolete?Higher-Order Components in the React Hooks Era — Is it true that React hooks have made higher-order components obsolete? And the only use case for those is to be a remnant of the past in some existential legacy corners of our apps? And what is a higher-order component anyway? Why did we need them in the first place? …React13 min read
Feb 17React component as prop: the right way™️As always in React, there is one million way to do exactly the same thing. If, for example, I need to pass a component as a prop to another component, how should I do this? If I search the popular open-source libraries for an answer, I will find that: I…React12 min read
Published in Level Up Coding·Feb 10How to Write Performant React Apps with ContextIt’s impossible to have a conversation on how to write performant React code without having an article or two on Context. And it’s such a controversial topic! There are so many prejudices and rumours surrounding it. Context is evil! React re-renders everything for no reason when you use Context! …React14 min read