performance

Code splitting breaks your bundle into smaller chunks that load on demand. Use it for route-based splitting, heavy components, and vendor libraries. This reduces initial load time by only loading code when it's needed.

Use tools like webpack-bundle-analyzer, Vite's rollup-plugin-visualizer, or source-map-explorer to visualize bundle composition. Reduce size by removing unused code, using smaller alternatives, lazy loading, and tree shaking.

Optimize React apps by: preventing unnecessary re-renders (memo, useMemo, useCallback), virtualizing long lists, code splitting routes/components, optimizing context usage, and using proper keys. Measure first with React DevTools Profiler.

CSR (Client-Side Rendering) renders in browser. SSR (Server-Side Rendering) generates HTML on each request. SSG (Static Site Generation) pre-builds HTML at build time. SSR/SSG improve initial load and SEO; CSR is simpler but slower first paint.

Debouncing waits until activity stops before executing (e.g., search after user stops typing). Throttling limits execution to once per interval during continuous activity (e.g., scroll events). Both reduce excessive function calls.