Store notification records once, then let independent delivery policies decide whether an event belongs in durable history, a transient toast, an unread badge, or an operating-system notification. Bound interruptions, deduplicate repeated events, and keep accessibility urgency separate from business priority.
A save confirmation, a failed payment, and a new team invitation are all called notifications. They should not behave the same way. The design becomes manageable once the durable fact is separated from the way that fact reaches a person.
Start with records and delivery channels
The source of truth is a notification record with an event identity, recipient scope, timestamps, read state, destination, and safe display data. A delivery policy may project that record into one or more channels:
- toast for timely feedback in the current viewport;
- notification center for durable history;
- badge for a compact unread signal;
- browser or operating-system notification for an allowed return path;
- email or another external channel when product policy requires it.
The channels share the event, not their interruption rules. Closing a toast must not delete the history record. Reading the history record may clear a badge without recalling an operating-system notification that was already delivered.
The public interview prompt
Design a reusable toast and notification-center system. Explain:
- event normalization, recipient scope, durable records, read state, and preferences;
- toast eligibility, priority, bounded queues, deduplication, timers, and dismissal;
- in-app history, pagination, optimistic updates, cross-tab and cross-device synchronization;
- polite status messages, urgent alerts, keyboard access, reduced motion, and zoom;
- hidden documents, offline use, reconnects, retries, ordering, and idempotency;
- browser push permission, service workers, deep links, privacy, and retention;
- performance, observability, testing, rollout, and evolution.
Assume a signed-in web application. Version one supports in-product toasts, a durable notification center, unread badges, and optional browser notifications. Email campaigns, mobile-native push infrastructure, and marketing automation are outside the first release.
What the premium solution covers
The complete solution defines the notification record, ingestion and delivery boundaries, toast scheduler, priority and preemption policy, deduplication keys, hidden-tab behavior, live-region lanes, notification-center pagination, optimistic read state, cross-tab coordination, offline reconciliation, browser push consent, privacy, observability, deterministic tests, rollout, and an interview scoring rubric.
Original media follows repeated and urgent events through a bounded toast queue. A separate visual compares toast, durable center, and operating-system delivery. A deterministic lab lets you enqueue repeats, promote an urgent alert, hide the document, and inspect the resulting queue and announcement lane.