Skip to content

PWA Features

Cameron Rye edited this page Nov 19, 2025 · 1 revision

Progressive Web App Features

DosKit is a fully-featured Progressive Web App (PWA) that can be installed on your device and works offline!

Key PWA Features

  • Installable: Install DosKit as a native app on desktop and mobile
  • Offline Support: Works completely offline after first visit
  • Fast Loading: Service worker caches assets for instant loading
  • Native Experience: Standalone mode without browser UI
  • Auto-Updates: Automatic updates when new versions are available
  • Connection Status: Real-time online/offline indicator

Installation

Desktop (Chrome/Edge/Brave)

  1. Visit doskit.net
  2. Click the install icon in the address bar
  3. Click "Install" to add to your desktop
  4. Launch from your desktop or start menu

Mobile (Android)

  1. Visit doskit.net in Chrome
  2. Tap "Add to Home screen" from the menu
  3. Tap "Add" to confirm
  4. Launch from your home screen

Mobile (iOS)

  1. Visit doskit.net in Safari
  2. Tap the Share button
  3. Tap "Add to Home Screen"
  4. Tap "Add" to confirm
  5. Launch from your home screen

Offline Functionality

How It Works

DosKit uses a Service Worker to cache all necessary files:

  • HTML, CSS, and JavaScript files
  • js-dos WebAssembly modules
  • DOS application files
  • Images and icons

After your first visit, DosKit works completely offline!

What Works Offline

  • Launch the application
  • Load previously accessed DOS applications
  • Run DOS programs
  • All emulator features

What Requires Internet

  • Loading new DOS applications (first time)
  • Checking for updates
  • Downloading additional content

Service Worker

Caching Strategy

DosKit uses different caching strategies for different types of content:

  • Network-first: HTML files (always get latest)
  • Cache-first: Static assets (fast loading)
  • Stale-while-revalidate: API calls (balance speed and freshness)

Cache Management

The service worker automatically:

  • Caches new files as you use them
  • Updates cached files when new versions are available
  • Cleans up old cache entries
  • Manages cache size limits

Updates

Automatic Updates

DosKit automatically checks for updates:

  1. Service worker detects new version
  2. Downloads new files in background
  3. Shows "Update Available" notification
  4. Click to reload and apply update

Manual Update

Force an update:

  1. Open browser DevTools
  2. Go to Application > Service Workers
  3. Click "Update" or "Unregister"
  4. Refresh the page

Connection Status

Online/Offline Indicator

DosKit shows your connection status:

  • Green indicator: Online
  • Red indicator: Offline
  • Automatic detection of network changes

Behavior When Offline

  • Previously loaded apps continue to work
  • New apps show "offline" message
  • Updates are queued until online

Manifest

App Manifest

DosKit includes a web app manifest (manifest.json) that defines:

  • App name and description
  • Icons for different sizes
  • Theme colors
  • Display mode (standalone)
  • Start URL

Customization

You can customize the manifest in public/manifest.json:

{
  "name": "DosKit",
  "short_name": "DosKit",
  "description": "DOS Emulator",
  "theme_color": "#000000",
  "background_color": "#000000",
  "display": "standalone",
  "start_url": "/",
  "icons": [...]
}

Benefits

For Users

  • No installation required - Works in browser
  • Optional installation - Install for native app experience
  • Works offline - Use anywhere, anytime
  • Fast loading - Cached assets load instantly
  • Auto-updates - Always get the latest version

For Developers

  • Cross-platform - One codebase for all platforms
  • Easy deployment - Just deploy to web server
  • No app store - No approval process
  • Instant updates - Push updates immediately
  • Web technologies - Use familiar web stack

Browser Support

PWA features are supported in:

  • Chrome/Edge 90+ (Full support)
  • Firefox 88+ (Full support)
  • Safari 15+ (Full support)
  • Opera 76+ (Full support)

Troubleshooting

Installation Not Offered

  1. Check you're using HTTPS (required for PWA)
  2. Verify manifest.json is valid
  3. Check service worker is registered
  4. Try a different browser

Offline Mode Not Working

  1. Check service worker is active
  2. Verify files are cached (DevTools > Application > Cache Storage)
  3. Try clearing cache and reloading
  4. Check browser console for errors

Updates Not Applying

  1. Click "Update Available" notification
  2. Hard refresh: Ctrl+Shift+R (Windows/Linux) or Cmd+Shift+R (Mac)
  3. Clear cache and reload
  4. Unregister service worker and reload

Best Practices

For Users

  1. Install the app for best experience
  2. Allow notifications to get update alerts
  3. Keep app updated by clicking update notifications
  4. Use offline after first visit

For Developers

  1. Test offline functionality regularly
  2. Version service worker to force updates
  3. Cache strategically - not everything needs caching
  4. Handle errors gracefully when offline
  5. Notify users of updates

Related Documentation


Made with ❤️ by Cameron Rye

Clone this wiki locally