Every 1-second delay in page load time reduces conversions by 7%, according to Google research. For a small business getting 500 visits per month and closing 5% of them — that's real money walking out the door every day your site loads slowly.
The good news: most speed problems come from a handful of fixable causes. Here's exactly what we optimize on every project at CodesWrap, ranked by impact.
1. Serve Next-Generation Image Formats
Images account for 60–80% of a typical webpage's total weight. Converting from JPEG/PNG to WebP or AVIF cuts file sizes by 40–80% with no visible quality loss.
<img
src="/hero.webp"
srcset="/hero-400.webp 400w, /hero-800.webp 800w"
sizes="(max-width: 768px) 100vw, 50vw"
loading="lazy"
alt="CodesWrap web design"
/>
If you're on WordPress, the ShortPixel or Smush plugins handle this automatically. On Next.js, the built-in <Image> component does it by default.
Impact: Typically shaves 1–3 seconds off First Contentful Paint (FCP).
2. Eliminate Render-Blocking Resources
Every <script> in your <head> that loads synchronously makes the browser pause rendering until the script downloads and executes. The fix:
- Add
deferto non-critical scripts - Move analytics and chat widgets to load after
DOMContentLoaded - Inline critical CSS (above-the-fold styles)
Google Tag Manager is often the biggest culprit. Loading it with async instead of the default snippet reduces blocking by an average of 400ms.
3. Enable Browser Caching with Proper Cache-Control Headers
When a returning visitor hits your site, their browser can serve assets from cache instead of re-downloading them. Configure your server to send aggressive cache headers for static assets:
Cache-Control: public, max-age=31536000, immutable
For HTML pages, use a shorter max-age=3600 so updates propagate within an hour. On Vercel and Netlify, this is configured automatically.
Impact: Repeat visits load 70–90% faster.
4. Use a Content Delivery Network (CDN)
A CDN stores copies of your static assets on servers around the world. A visitor in Dallas gets your images from a Dallas edge node — not your origin server in New York.
If your site is on Vercel or Netlify, you already have a CDN. If you're on shared hosting, Cloudflare's free plan adds CDN capabilities without changing your hosting.
Impact: Cuts latency by 50–200ms depending on visitor geography.
5. Minimize and Tree-Shake JavaScript
JavaScript is the most expensive resource a browser downloads — it has to be parsed, compiled, and executed, not just decoded like images.
Audit your bundle with tools like bundlephobia.com before installing npm packages. A date picker library that adds 200KB might not be worth it. Common oversized dependencies we see on client sites:
- Moment.js (→ replace with
date-fns) - jQuery (→ often unused, just remove it)
- Full icon libraries (→ import only what you use)
Impact: Each 100KB of eliminated JavaScript saves ~50ms on mobile.
6. Implement Lazy Loading for Off-Screen Content
Don't load images, videos, or interactive components that appear below the fold until the user scrolls toward them.
<!-- Native lazy loading — no JavaScript required -->
<img src="/testimonial-avatar.jpg" loading="lazy" alt="Client photo" />
For React/Next.js, use dynamic() with { ssr: false } for heavy client-side components like maps, charts, and video players.
Impact: Reduces initial page weight by 30–50% on image-heavy pages.
7. Audit Third-Party Scripts Ruthlessly
Every third-party script — live chat, pop-up tools, A/B testing platforms, social share buttons — adds network requests, JavaScript execution time, and potential render blocking. Run your site through WebPageTest and look at the waterfall chart.
Our rule of thumb: if a script adds more than 300ms and you can't directly tie it to revenue, remove it.
Common offenders: Hotjar (heavy), Intercom (heavy), Facebook Pixel (problematic loading), multiple chat widgets running simultaneously.
Pro Tip
Run a free speed test at PageSpeed Insights (Google's tool) to get a Lighthouse score and specific recommendations for your current site.
How We Implement This at CodesWrap
Every website we build at CodesWrap ships with:
- Next.js Image component for automatic WebP/AVIF conversion
- Vercel Edge Network for global CDN
- Bundle analysis during build to catch bloated dependencies
- Lighthouse CI check as part of every deployment
A fast website isn't a luxury — it's table stakes for ranking on Google and converting visitors in 2025.
Want a Website That Loads in Under 2 Seconds?
Our development team optimizes for Core Web Vitals on every project. Get a free performance audit of your current site.
Get a Free Speed AuditJordan Kim
Lead Engineer, CodesWrap Technologies
Jordan leads engineering at CodesWrap, specializing in Next.js performance optimization and full-stack architecture. He has shipped 300+ production web applications.
Related Articles
The Complete Local SEO Guide for US Small Businesses (2025)
Local SEO is the single highest-ROI marketing channel for most small businesses. This step-by-step guide shows you exactly how to rank in your city — without paying for ads.
10 Web Design Mistakes That Are Costing Your Small Business Customers
Most small business websites make the same design mistakes — and each one silently kills conversions. Here's what to fix first.
Does Your Small Business Need a Mobile App? (The Honest Answer for 2025)
Everyone says you need a mobile app. But the real answer depends on your business model, customers, and budget. Here's a framework for deciding — and what to do if the answer is yes.