Most SaaS platforms treat push notifications as "native app only" — Firebase Cloud Messaging (FCM) for Android, Apple Push Notification service (APNS) for iOS. Wrong. The Web Push API, supported since Chrome 50 and iOS Safari 16.4, delivers browser and PWA notifications without building two separate platforms. Velocity X uses it to alert field reps: new lead assigned, deal won, calendar booking confirmed. Same notification, one backend.
Web Push vs Native Push — Why the Web One Is Simpler
Native push requires integrating with Apple and Google's infrastructure, managing certificates, handling token rotation, and maintaining separate code paths per platform. Web Push uses the browser as the intermediary. Your server sends a signed request to the browser's push service (controlled by the browser vendor, not you). The browser stores the notification. When the trigger hits, the browser fires the notification — whether the app is open or not.
Translation: one backend, one secret key, zero App Store gatekeeping. A `vapid-key` pair (VAPID = Voluntary Application Server Identification) signs your requests. The push service validates the signature and routes the notification. That's it. No certificates. No tokens to manage. No approval workflows.
The Setup: Service Worker + Push Subscription
On page load, register a Service Worker. When the user grants permission, the browser creates a push subscription — a unique endpoint URL. Send that subscription to your server. Store it in the database. When you need to alert the user, POST a signed payload to their subscription URL. The browser receives it, wakes the Service Worker, and fires the notification.
Here's the client side: register, request permission, subscribe.
```javascript // Register Service Worker if ('serviceWorker' in navigator) { navigator.serviceWorker.register('/sw.js'); } // Request permission and subscribe to push Notification.requestPermission().then(permission => { if (permission === 'granted') { navigator.serviceWorker.ready.then(registration => { registration.pushManager.subscribe({ userVisibleOnly: true, applicationServerKey: urlBase64ToUint8Array( 'YOUR_VAPID_PUBLIC_KEY' ), }).then(subscription => { // Send subscription to your server fetch('/api/subscribe', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(subscription), }); }); }); } }); ```Server side: sign the payload with your VAPID private key, POST it.
```javascript // Node.js with web-push library const webpush = require('web-push'); webpush.setVapidDetails( 'mailto:alerts@velocity-x.com', process.env.VAPID_PUBLIC, process.env.VAPID_PRIVATE ); // Send to all subscriptions subscriptions.forEach(subscription => { webpush.sendNotification(subscription, JSON.stringify({ title: 'New Lead Assigned', body: 'Sarah Chen — $2.4K contract', icon: '/icon-192.png', })); }); ```The Service Worker receives the push and displays the notification.
```javascript // Service Worker self.addEventListener('push', event => { const data = event.data.json(); event.waitUntil( self.registration.showNotification(data.title, { body: data.body, icon: data.icon, tag: 'velocity-notification', }) ); }); ```Permission UX — Don't Ask on Load
Nothing kills adoption like a permission prompt on page load. Velocity X asks after the first meaningful action — after a rep logs in and loads their route, in a quiet banner: "Enable notifications for real-time alerts?" The conversion rate is 65–70%. Asking in the first 2 seconds? 5%. Timing matters.
The Catch: Subscription Lifecycle and Reliability
Push subscriptions aren't permanent. If a user uninstalls the app, clears cache, or revokes permission, the subscription becomes invalid. Your server will get a 410 (Gone) response — clean it up. Velocity X retries failed sends once; if it fails again, the notification is logged as undelivered. No queuing, no retries forever. The goal is real-time, not guaranteed delivery. For truly critical alerts (account security, payment failure), fall back to in-app alerts or email.
Why This Beats Firebase for Field Sales
Field reps install Velocity X as a PWA. They don't install two native apps. Web Push reaches them across browser and PWA without separate backends. New lead assigned? Push. Deal won? Push. Same code, one backend. Firebase requires two code paths, two NDAs, two sets of credentials. For SaaS targeting mobile-first field teams in 2026, Web Push is the pragmatic choice.
Ready to scale field sales without native app headaches? See [what Velocity X pricing looks like](/pricing) and how teams use [push notifications inside a PWA](/blog/pwa-progressive-web-app-velocity-x-mobile).