SPA vs PWA — worker & installable
Proyek NXDOM selalu SPA (satu index.html, routing di browser).
webWorker, serviceWorker, dan pwa menambah performa
atau perilaku aplikasi terpasang — tidak mengganti model SPA.
Electron (desktop): nonaktifkan
pwa dan biasanya
serviceWorker di App.js — aplikasi sudah jendela native, bukan
install PWA di browser.
Panduan PWA & desktop →
1. Lapisan di proyek
| Lapisan | Fungsi | Config / file |
|---|---|---|
| SPA | Navigasi tanpa reload; konten di #main |
NexaRoute, templates/*.js, route / autoload |
| Web Worker | Fetch/cache API di thread terpisah | webWorker di App.js — bukan syarat PWA |
| Service Worker | Cache offline, fallback navigasi ke index.html |
sw.js, serviceWorker di App.js |
| PWA (installable) | “Pasang aplikasi”, tampilan standalone |
manifest.webmanifest, pwa di App.js |
Yang tidak otomatis:
serviceWorker: { enabled: true } saja
belum membuat PWA penuh — masih perlu manifest valid, ikon, dan (produksi)
HTTPS. Tanpa manifest, browser tidak menawarkan “Install app” meskipun SW aktif.
2. PWA (installable)
| File / config | Peran |
|---|---|
manifest.webmanifest |
Nama app, ikon, start_url, display: standalone |
index.html |
<link rel="manifest">, theme-color, apple-touch-icon |
pwa di App.js |
NX.initNexaPwa — banner pembaruan saat SW update |
assets/modules/Pwa/NexaPwa.js |
Helper manifest meta + update watcher |
pwa: {
enabled: true,
manifestUrl: "/manifest.webmanifest",
themeColor: "#CB2F2F",
promptUpdate: true,
},Uji: Chrome DevTools → Application → Manifest & Service Workers; Lighthouse PWA. Gunakan ikon 192×192 dan 512×512 untuk hasil install terbaik.
3. Service Worker (ringkas)
serviceWorker |
Perilaku |
|---|---|
enabled: false |
SW tidak terdaftar; registrasi lama yang cocok scriptUrl di-unregister |
enabled: true |
Cache static, GET API, precache shell; lewat NX.initNexaServiceWorker |
backgroundSync: true |
Menyiapkan event sync; logika kirim ulang data offline Anda tulis sendiri |
Detail webWorker dan opsi lengkap:
Web Worker,
Service Worker,
PWA di App.js.
Rute: Mode autoload ·
Panduan SPA.