How to make a website work offline in an APK

Choose the right build type

Only file-based apps (HTML or ZIP) carry their content inside the APK. A URL app always needs the network, though it can show an offline screen.

Offline checklist

• Libraries: replace <script src="https://cdn…"> with local copies in js/.
• Fonts: download Google Fonts files into fonts/ and declare them with @font-face, or use system fonts.
• Icons: use inline SVG or a local icon font, not a hosted kit.
• Images and audio: keep them in the bundle and compress them.
• Data: ship JSON files in the bundle and read them with relative paths; save user progress with localStorage or IndexedDB.
• Analytics and ads: they will simply fail offline — make sure the page does not wait for them before rendering.

Mixing offline and online

An offline app can still use the network when available — for example to sync scores or fetch fresh prices. Check navigator.onLine, try the request, and fall back to bundled data on failure so the app always renders something useful.

Test like a user

1. Install the APK and open it once with a connection.
2. Turn on flight mode, force-stop the app and open it again.
3. Visit every page, open every image and run every feature.
4. Anything missing points to a file still loaded from the internet.

Example: replace a CDN script

<!-- Before: needs internet -->
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js"></script>

<!-- After: bundled in js/ -->
<script src="js/chart.umd.min.js"></script>

Open the CDN URL in a browser, save the file into your project's js/ folder, and change the src. Do the same for CSS frameworks.

Example: self-host a Google Font

/* fonts/inter-400.woff2 saved in your project */
@font-face {
  font-family: "Inter";
  src: url("fonts/inter-400.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}
body { font-family: "Inter", system-ui, sans-serif; }

Find every network request

Open your site on a computer, open DevTools → Network, tick Disable cache and reload. Every row whose domain is not your local server is something that will fail offline. Fix them until the list shows only your own files.

How much can an offline app store?

localStorage holds a few megabytes of text — fine for settings, scores and small lists. For larger data (hundreds of records, images, drafts) use IndexedDB, which can store far more and handles binary data.