Skip to content
Searchpedia SEO field notes Callum Bennett Callum

Site ops

PWA

A Progressive Web App (PWA) is a website that can act like a native app — installable, offline, fast — but it's still a web page under the hood. For SEO, that's both an opportunity and a trap.

Beginner6 min readUpdated 2026-07-27Notes by Callum Bennett

Start here

  • Render-test every key page in Search Console before going live.
  • Ensure internal links are real <a> elements in the initial HTML.
  • Service worker caching must differentiate between user and crawler requests.
  • Use SSR or pre-rendering — dynamic rendering as a fallback.
  • Monitor crawl stats: if Google stops deep crawling, your PWA might be blocking it.

Honestly, I fell for the 'it works offline, so it's SEO gold' line once. Took a few weeks and a Search Console panic to realise I'd hidden half my site from Google.

What I'd do first

  • Render test first. Open a few key pages in the URL Inspection Tool. Does Google see the actual content? If not, you need server-side rendering (SSR), dynamic rendering, or at least pre-rendering.
  • Check your internal links. If you're using client-side routing (e.g., React Router), make sure every page has a real <a href> that's in the initial HTML. Googlebot doesn't click buttons.
  • Inspect your service worker. What is it caching? For how long? A badly configured worker can serve stale HTML or block crawlers.
  • Test installability. Use Lighthouse. The manifest and service worker aren't just nice-to-haves — they affect the user experience signals that may influence rankings.
  • Set up proper error handling. PWA offline mode should not return a blank white screen to crawlers. Serve a 200 with fallback or a 503 — not a 200 with no content.

Plain-English take

A PWA is a website that wears a native-app costume. Underneath, it's HTML, CSS, JavaScript — the usual web stuff. But it can be installed on a phone's home screen, work offline, and send push notifications. The SEO catch: because PWAs lean heavily on JavaScript to do their magic, they can accidentally hide content from search engines. If you build one right, it's fast and indexable. If you build it sloppy, you get a slick-looking app that nobody finds.

How it shows up

For users, a PWA manifests as an install prompt in the browser or address bar. Once installed, it opens in its own window without browser chrome — like a real app. For Google, it's still a website. Googlebot crawls the initial HTML (which may be a thin shell), then executes JavaScript to render content. If the JS rendering depends on client-side events or slow API calls, content may not appear in the index. In Search Console, you'll see pages indexed but with no text or links — a sign your PWA's rendering failed.

Tradeoffs

There's always a tradeoff between app-like experience and crawlability. Server-side rendering or dynamic rendering adds complexity and server cost. Pre-rendering static pages can work but breaks if your content changes frequently. Service workers can cache aggressively for offline users, but that same cache can serve outdated content to crawlers if you're not careful with versioning.

I've found that the most pragmatic approach is to start with an SSR framework (Next.js, Nuxt) and treat the PWA enhancements as an extra layer — not the foundation. You lose some of the pure SPA speed, but you keep Google happy.

Another tradeoff: iOS support. Apple only recently (iOS 16.4) allowed service workers and manifest. If your audience is iPhone-heavy, you'll have to decide how much PWA effort to sink in.

What I got wrong

My first PWA project, I thought 'installable' meant I'd done enough. I had a manifest, a service worker, and an offline page. But I'd built it as a client-side React app without any pre-rendering. Googlebot got an empty div with a loading spinner. It took me weeks to realise that my beautiful offline-enabled app had zero organic traffic. I had to rebuild the entire routing layer to support SSR.

I also assumed that if my service worker cached the page, Google would get the same cached version. But Googlebot doesn't necessarily use the service worker; it may bypass it entirely. So my caching strategy was useless for SEO.

Lesson: treat the PWA as a website first, an app second. Test crawlability before you celebrate.

Next step

Quick answers

Is a PWA always faster than a traditional website?

Not automatically. A poorly optimised PWA with large service worker caches can be slower. But with proper caching strategies and fast initial load, it can be very fast.

Can I have a PWA without losing SEO?

Yes, but you have to be deliberate. Use SSR, test rendering, and keep links crawlable. Don't let the app-like features override basic SEO fundamentals.

Sources

Primary documentation is linked directly. Anything commercial is marked nofollow.

  • Google Search Central — Best source for SEO guidance on JavaScript rendering, crawlability, indexing, and mobile-friendly site behavior.
  • web.dev PWA guidance — Google-maintained reference explaining the core PWA model, installability, offline support, and single-codebase behavior.
  • MDN Web Docs — Clear technical definition of PWAs and the web platform features they rely on.
  • Microsoft Learn — Useful implementation overview from a major browser/platform vendor.

Notes from Callum Bennett.