How to trigger desktop notification 24 hours later without backend server?

I do not believe this is possible at this point in time.

Push notifications are specified in RFC8030, from its abstract:

This document describes a simple protocol for the delivery of real-
time events to user agents. This scheme uses HTTP/2 server push.

Which implies the requirement for a server supporting HTTP/2 push.

I do love to rant at Javascript, and I do not seem to be able to find an Javascript implementation of an HTTP2 server to run in the browser (there is for node), which is a shame for me, and would be awesome to mock about.

So, looking for fame, http2-server.js is missing.

You might be able to consider using localStorage. However, this is only beneficial for users that utilize the same device and browser.

Below is a function that kicks off on page load. If you want it to occur periodically throughout a session, you could wrap it into a setInterval and check periodically. This is assuming it needs to be exactly 24 hours later to the millisecond.

// on page load
window.onload = () => {
    const dayMs = 24*60*60*1000; // 1 day in milliseconds
    const notificationTimer = localStorage.getItem('notificationTimer');
    if(notificationTimer){
        const sendNotification = (Date.now() - (new Date(notificationTimer)).getTime()) > dayMs;
        if(sendNotification){
            const notification = new Notification('Displaying next day reminder from yesterday');
        }
    }

};

When the user selects the next day reminder you can then set the notificationTimer:

localStorage.setItem(notificationTimer, Date.now());

You'd have to make some caveats about the next day reminder not working across browsers or devices, which may or may not be desirable.

As things stand while writing this (3rd Jan 2019):

There is no "desktop notification" that is not strictly "push notification" and works well cross platforms.

• It is not possible to trigger a "desktop notification" without your app working in the background.
• Service workers are not supposed to use timers and will be shut down.
• The Operating System or other utility software may also suggest or even shut down your background application.
• There is no client side only approach to trigger your notification at a precise time in the future. There are too many reasons for organisations not allowing this to happen at present.

Your only choice seems to be to use a different Push Notification Service coupled with an external scheduling service that would trigger the external notification based on custom schedules.

Your requirements as I understand them:

• Each visitor would need to subscribe to push notifications
• Record externally customer preference (for example: using some cloud scheduling)
• Use the external scheduling service to trigger the push notification service.

PUSH NOTIFICATIONS are SERVER TRIGGERED not CLIENT REQUESTED

The main point of push notifications is that you should trigger the notification externally to avoid using resources on the end user device. This does not stop you collect notification preferences from users, save this information externally so you can trigger a notification externally when needed.

More information about PWA notification can be found in the following article: https://developers.google.com/web/fundamentals/codelabs/push-notifications/

As far I know PWA Service Workers should not use timers!

As an alternative to using the PWA notifications, you may want to rightly consider using different notification service. For example FCM https://firebase.google.com/docs/cloud-messaging/

The idea could be to save externally the notification preference of the user and trigger the FCM notification via another cloud service when the scheduled time is reached.

Obviously those notifications will only ever work if the users are connected to the network. However this would have been also the case with any Notification service requiring network access.

I hope the above helps, Cheers and happy codding!