Performance & Optimization
Investigate bundle size, rendering cost, and application performance. Use measured bottlenecks to decide what to change.
3 articles
Bundle Size Optimization in Next.js: Under 150KB Initial JS
How I cut initial JavaScript from 380KB to 120KB on a production Next.js e-commerce site. Covers @next/bundle-analyzer, dynamic imports, tree-shaking, Server Components, code splitting strategies, and heavy library alternatives — with real before/after numbers from FreshMart.
Image Optimization in Next.js: The Complete Performance Guide
A complete guide to image optimization in Next.js using next/image — covering WebP and AVIF format selection, blur placeholders, responsive sizing, priority loading, external image sources like Sanity and Cloudinary, CLS prevention, and the exact component patterns I use to hit PageSpeed 95+ on every project.
Core Web Vitals for Next.js: How I Hit 95+ on Every Project
A hands-on guide to achieving 95+ Lighthouse scores in Next.js — covering LCP, INP, CLS, bundle optimization, image strategy, font loading, and Server Components. Based on real production numbers from FreshMart and other projects I have shipped.