How to use React.memo() to improve performance | Felix Gerschau
performancereactHow to use React.memo() to improve performanceLearn how to use React.memo, some common pitfalls you might encounter, and why you shouldn't use React.memo for all your components. React internally already optimizes the performance quite a bit without having to explicitly optimize for performance. React.memo can help you to optimize the number of renders of your React components even
How to use React Context like a pro - Devtrium
How to use React Context like a proSeptember 13, 2021 • 9 min read IntroductionUsing React's Context API is often very useful. I've found that there are several patterns that you should regularly use in combination with contexts in React, and these patterns aren't that well known. I'm sharing them in this article so you can start using React Contexts like a pro! As a quick reminder before we start
Tao of React - Software Design, Architecture & Best Practices
Tao of React - Software Design, Architecture & Best PracticesJanuary 18, 2021 • 25 minute read I’ve been working with React since 2016 and still there isn’t a single best practice when it comes to application structure and design. While there are best practices on the micro level, most teams build their own “thing” when it comes to architecture. Of course, there isn’t a universal best practice tha
React antipatterns to avoid
📅 Sep 19, 2021 · ☕ 5 min read · ✍️ Iskander Samatov Here are some of the antipatterns most commonly seen in React applications and how to fix them. These antipatterns will make your codebase a nightmare to work with if you’re don’t learn to recognize and prevent them at their early stages. Putting everything in Redux Redux is awesome. It optimizes performance behind the scenes and lets us easil
React Accessibility Tools – How to Build More Accessible React Apps
Making a website or web app accessible improves the user experience for people with disabilities and for all users as well. Since developers deal with tight deadlines and competing priorities, it is easy to accidentally ship unresolved accessibility issues to production. And things becomes even more complex when working with JavaScript frameworks such as React which involves writing JSX. But fortu
The "best" way to manage icons in React.js
Icon Rendering Techniques If you have been building user interfaces for any amount of time, you know that icons are, well, they are everywhere. I have spent the last 7 years building UIs with React.js and I have tried a number of different techniques for managing icons. Each technique has different tradeoffs. The main techniques I have used are: Image + SVG <img src='icon.svg'> Inline SVG const ic
Popular React Folder Structures and Screaming Architecture
Screaming ArchitectureEvolution of a React folder structure and why to group by features right away React folder structures have been debated for years due to React's unopinionated approach, leading developers to ask, "Where should I put my files? How should I organize my code?" I've researched the most popular approaches to organizing React projects: Grouping by file type like components, context
Delightful React File/Directory Structure
IntroductionReact is famously unopinionated when it comes to file/directory structure. How should you structure the files and directories in your applications? Well, there is no one “right” way, but I've tried lots of different approaches in the 7+ years I've been using React, and I've iterated my way to a solution I'm really happy with. In this blog post, I'll share the structure I use across all
Choosing the right component library for your design system: MUI vs Chakra
Design systems can be very complex, or very simple depending on the needs of an organization. At the center of every design system though, is a component library. The goal of this project is to choose which component library is the best fit for Udacity’s next generation design system. TL;DRAfter testing the two libraries the results were nearly identical in every category— except for theming. Them
React Architecture: How to Structure and Organize a React Application
There is no consensus on the right way to organize a React application. React gives you a lot of freedom, but with that freedom comes the responsibility of deciding on your own architecture. Often the case is that whoever sets up the application in the beginning throws almost everything in a components folder, or maybe components and containers if they used Redux, but I propose there's a better wa
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Understanding re-rendering and memoization in React
React Hook: Detect Click outside of Component
Accessible React Forms
Prefer Declarative State Updaters | Kyle Shevlin
Understanding React's useRef Hook
What Are Proper Use Cases For Snapshot Testing React Components?
How to use async functions in useEffect (with examples) - Devtrium
An overview of React State Management Techniques in 2021 ⚜️🌐
Introduction to Redux Toolkit for Beginners
How I structure my React projects