npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

directus-extension-pwa-hook

v1.0.0

Published

Progressive Web App (PWA) support for Directus admin interface with automatic meta tags, manifest.json, and service worker

Vulnerabilities

Powered byPowered by Snyk
  • 0High
  • 0Medium
  • 0Low

Links

Git

Maintainers

thederfthederf

Keywords

directusdirectus-extensiondirectus-extension-hookpwaprogressive-web-appservice-workermanifestoffline

Readme

Directus PWA Hook Extension

Adds Progressive Web App (PWA) support to your Directus admin interface. Automatically injects PWA meta tags, serves a dynamic manifest.json, and registers a service worker.

Installation

From Directus Marketplace

  1. Set the environment variable:

    MARKETPLACE_TRUST_ALL=true

  2. Install via Directus admin:

    • Go to Settings > Marketplace
    • Search for "PWA Hook"
    • Click Install

Manual Installation

  1. Copy this extension to your Directus extensions directory:

    cp -r directus-extension-pwa-hook /path/to/directus/extensions/

  2. Restart Directus

Configuration

Configure in Settings > Project Settings:

  • Project Name: App display name
  • Project Descriptor: App description
  • Project Color: Theme color (hex)
  • Project Logo: App icon (auto-sized to 192x192 and 512x512)
  • Public Background: Background color

Changes apply immediately without restart.

Features

  • Injects PWA meta tags into admin app
  • Serves /pwa/manifest.json dynamically from settings
  • Serves /pwa/sw.js service worker
  • Auto-registers service worker on page load
  • Enables "Add to Home Screen" on supported browsers

Testing

Desktop (Chrome/Edge)

  1. Open DevTools > Application
  2. Check Manifest and Service Workers tabs
  3. Look for install icon in address bar

Mobile

  1. Open admin in mobile browser
  2. Look for "Add to Home Screen" prompt
  3. Install and verify standalone mode

Offline

  1. DevTools > Network tab > Check "Offline"
  2. Refresh page - should load from cache

Important Notes

  • Service worker cache doesn't do much yet - primarily provides basic offline support
  • PWA installation tested only on Android and Windows 11 - other platforms may have issues
  • Vibecoded with Claude Sonnet 4.5 - may have bugs or unexpected behavior
  • Requires HTTPS in production (localhost works for development)

Browser Support

  • Chrome/Edge: Full support
  • Firefox: Full support
  • Safari iOS 11.3+: Partial support
  • Safari macOS: Limited manifest support

Troubleshooting

Service worker not registering?

  • Check browser console for errors
  • Ensure HTTPS (or localhost)
  • Hard reload (Ctrl+Shift+R)

Install prompt not showing?

  • Must be on HTTPS
  • User must interact with site first
  • Different browsers have different criteria

License

MIT