Seven Performance Lessons for Building a Fast News Website

News websites have a hard job. They publish many pages a day, carry heavy images and ads, and most of their readers arrive on mid-range phones over patchy mobile data. In India especially, a slow page doesn't just annoy readers. It loses them before the headline loads.

Here are seven practical lessons for anyone building or maintaining a content-heavy site.

1. Treat the article page as the product

Most readers never see your home page. They land on a single article from search, social or a messaging app. Measure Core Web Vitals on article templates first, and test them on a real low-end Android phone, not just your laptop.

2. Serve images at the right size

Images are usually the biggest bytes on a news page. A few habits help:

• Generate several widths and use srcset and sizes so phones don't download desktop images.
• Use modern formats such as WebP or AVIF, with a JPEG fallback if you need it.
• Always set width and height (or aspect-ratio) so the layout doesn't jump while images load.
• Lazy-load everything below the fold with loading="lazy", but never the lead image.

3. Keep the main thread free

Third-party scripts for analytics, ads, comments and social embeds compete for the same main thread that renders your text. Audit them every quarter. Load non-essential scripts after the page becomes interactive, and replace heavy social embeds with a static preview that loads the real embed on tap.

4. Cache aggressively, invalidate precisely

Most article pages change rarely after the first few hours. Put them behind a CDN with a sensible cache lifetime and purge only the URLs that change when an editor updates a story. Use stale-while-revalidate so readers never wait for a cache refill during a traffic spike.

Cache-Control: public, max-age=300, stale-while-revalidate=86400

5. Make fonts fast or skip them

Custom fonts can delay text rendering. Self-host them, subset them to the scripts you actually use, preload only the one weight used in body text, and use font-display: swap. If you publish in several Indian languages, think carefully about which scripts truly need a custom font.

6. Design for bad networks

Assume packet loss and high latency. Keep the critical CSS small and inline, avoid long chains of requests, and make sure the article text is in the initial HTML rather than fetched by JavaScript. Server-rendered or statically generated pages are a good fit for news.

7. Monitor real users, not just lab scores

Lab tools are useful during development, but real-user monitoring tells you what readers actually experience. Track Largest Contentful Paint, Interaction to Next Paint and Cumulative Layout Shift by device type and region, and set alerts when they regress after a deploy.

Wrapping up

Performance work on a news site is never finished, because every new widget, ad slot or embed adds weight. The teams that stay fast are the ones that treat speed as a feature with an owner and a budget, not a one-off clean-up.

I write about technology and digital media for Peepals, an Indian news network.