Next.js bundle size analysis is one of the highest-ROI performance tasks you can do — it takes an afternoon, and the wins compound across every page. Here is exactly how I ran it on a client e-commerce site and cut first-load JS from 487 kB to 301 kB. Setting up @next /bundle-analyzer Install the package and wire it into next.config.ts . // next.config.ts import type { NextConfig } from ' next ' ; import withBundleAnalyzer from ' @next/bundle-analyzer ' ; const withAnalyzer = withBundleAnalyzer ({ enabled : process . env . ANALYZE === ' true ' , openAnalyzer : true , }); const nextConfig : NextConfig = { // your existing config }; export default withAnalyzer ( nextConfig ); Enter fullscreen mode Exit fullscreen mode Then run: ANALYZE = true next build Enter fullscreen mode Exit fullscreen mode This opens two treemap files in your browser — one for the client bundle, one for the server bundle. The client treemap is the one to fix first because it is what your users download.…