react-topics

react-topics.md

Elements as props

• Elements as props
• Conditional rendering and performance
• Default values for the elements from props

Render props

• Render props for rendering Elements
• Children as render props
• Hooks replaced render props

Memoization

• The problem: comparing values
• useMemo and useCallback: how they work
• Expensive calculations
• React.memo

Diffing and reconciliation

• Reconciliation and state update
• Why we can't define components inside other components
• Arrays and keys
• Key attribute and memoized list
• State reset

Higher-order components

• Callbacks
• React lifecycle events
• Intercepting DOM events

Context and performance

• Context re-renders: split providers
• Reducers and split providers
• Context selectors

Refs

• Difference between Ref and state
• Ref: Doesn't trigger re-render
• Ref: synchronous and mutable
• forwardRef
• useImperativeHandle

Debouncing and throttling

• Dealing with re-renders
• Dealing with state inside

useLayoutEffect

• What is the problem with useEffect?
• Fixing it with useLayoutEffect
• Rendering, painting, and browsers

Portals

• Stacking Context in real apps
• How React Portal can solve this
• React lifecycle, re-renders, Context, and Portals

Data fetching

• Types of data fetching
• React lifecycle and data fetching
• Browser limitations and data fetching
• Requests waterfalls
• Suspense

Race conditions

• Force re-mounting
• Drop incorrect result
• Drop all previous results
• Cancel all previous requests

Error handling

• Simple try/catch in React: how to and caveats
• React Error Boundary component
• Error Boundary component: limitations
• Async errors with ErrorBoundary