Performance optimisation in React ​

• minimize the number of updates
  • useCallback,
  • useMemo
• use react.Fragment to optimize both virtual-dom and the real one
• Virtualize long lists with react-window (or else)
• Lazy-load the components once they are needed
• use code splitting to reduce initial load time
• memoize the Pure Components
• use key prop properly
• use useCallback hook to stop unnecessary re-renders
• use Server-Side Rendering to reduce the Initial Page Load
• optimize Images Loading
  • compress them
  • use appropriate image formats
  • use responsive images
  • lazy load them
  • use CDN if possible
• avoid inline-styling, use pre-processors or CSS-in-JS libs instead
  • optimize CSS with PurgeCSS or PostCSS