Why website performance matters
Google uses Core Web Vitals as a ranking factor. A slow website ranks lower in search results and loses visitors.
The numbers:
53% abandon a page that takes longer than 3 seconds to load
1 second of delay = 7% fewer conversions
Google measures: LCP, FID/INP and CLS
Step 1: Optimise images
Images account for 50-80% of page weight.
Use WebP or AVIF format (30-50% smaller than JPEG)
Implement lazy loading — only load visible images
Specify width and height — prevent layout shifts (CLS)
Use responsive images with srcset
Step 2: Minimise JavaScript
Code splitting — load only the JavaScript needed per page
Tree shaking — remove unused code automatically
Defer non-critical scripts — load analytics and chat widgets later
Bundle analysis — identify large dependencies
Step 3: Server-side rendering (SSR) or static generation (SSG)
With Next.js you can pre-render pages:
SSG — pages are built as HTML (fastest)
SSR — pages are rendered per request
ISR — static pages that refresh periodically
Step 4: Caching strategy
Browser caching — cache static assets (CSS, JS, images) for a year
CDN — serve content from the nearest location
API caching — cache frequently requested data
Step 5: Font optimisation
Use font-display: swap — show a fallback font while loading
Preload critical fonts
Limit the number of font variants (2-3 max)
Consider variable fonts
Step 6: Remove render-blocking resources
Critical CSS inline in the head
Async/defer for non-critical JavaScript
Preconnect to external domains
Step 7: Monitor continuously
Google PageSpeed Insights — measure per page
Lighthouse — in Chrome DevTools
Web Vitals — real user monitoring
Want to make your website faster? We'll run a free performance audit.