The top real-time notification services for building in-app notifications
Tags: webdev, programming, tooling
Published: 2023-10-24 20:11:29


Real-time, in-app notifications in a product allow you to instantly engage users with relevant content, enhancing user experience and user retention. These notifications foster immediate action and feedback, ensuring users stay informed and connected to the application's latest updates and activities.

But building in-app notifications from scratch is challenging. First, you have to manage the infrastructure for WebSockets and Publish/Subscribe messaging patterns to power the real-time behavior. Second, your product needs logic to deal with user preferences, user presence detection, storage, and logging. Finally, you need to build out the frontend UI features and underlying APIs to display the notifications.

Using a SaaS service to offload some or all of this complexity allows you to concentrate on your own product while still giving the benefit of in-app notifications to your customers.

Here, we will evaluate 4 providers to power the real-time infrastructure for your in-app notifications.

## The key features of real-time services for in-app notifications

What should you be looking for in a real-time service for in-app notifications?

- **Pricing**: The cost-effectiveness of in-app notifications can significantly influence an app's overall budget and profitability. Transparent, scalable pricing ensures you can anticipate costs, allocate resources, and adjust any strategy based on budget.
- **Scalability**: In-app notifications should adapt as user bases grow or shrink. A scalable notification system can handle spikes in traffic and vast volumes of concurrent users, ensuring every individual receives timely and consistent alerts without overburdening infrastructure.
- **Reliability**: A reliable in-app notification system guarantees that users receive messages without delays. This reliability is vital for maintaining trust, especially in applications where timely alerts can impact user decisions or safety.
- **Framework**: The chosen framework should support your desired communication mechanism, be it pub/sub for broadcasting messages to various subscribers, WebSockets for real-time bidirectional communication, or polling where the client periodically requests updates.
- **Features**: Essential features to consider include presence (indicating who is online), low latency (ensuring rapid message delivery), the ability to query the state (understanding the current status of a user or system), and encryption (securing the content of the messages for privacy and protection).
- **Developer experience**: An intuitive and well-documented platform streamlines the integration and maintenance process for developers. A positive developer experience translates to quicker implementation, fewer bugs, and more time spent refining and enhancing the core features of the application.

Let's look at a few services and how they align with these key features.

## Pusher


![Pusher](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wllg4041l802qmptl9gi.png)



[Pusher Channels](https://pusher.com/channels) is a real-time notifications service that empowers developers to swiftly integrate real-time functionality, like live notifications and chat, into web and mobile apps using WebSockets. Pusher is known for reliability and scalability and is used by Buffer, GitHub, and Datadog.

### Features

- Managed WebSocket connections with fallback
- Support for Publish/Subscribe framework
- Presence detection
- The ability to query the API to find out channel and state information
- Interactivity through webhooks
- End-to-end encryption

### Pros

- **Scalability**. Pusher easily handles surges in traffic, ensuring consistent real-time communication for applications ranging from startups to large enterprises.
- **Versatility**. With SDKs for various languages and platforms, Pusher seamlessly integrates with numerous tech stacks, simplifying real-time feature implementation.
- **Reliable WebSocket fallback**. Pusher's automatic fallback mechanisms guarantee continuous connectivity, even when WebSockets are unsupported or unstable.

### Cons

- **Location.** You are locked into a specific data center location when you sign up for Pusher and “it's not possible to change it afterwards.” This means that notification latency will slow further from the data center location.
- **Pricing complexity**. With eight tiers and pricing changing with messages, connections, and support, it is not clear how you'll have to pay. You also have to pay separately for Pusher Beams, their Push notification service.

### Pricing

Pusher has [eight pricing tiers](https://pusher.com/channels/pricing/) ranging from free on the “Sandbox” tier, where you get 200k messages per day and 100 concurrent connections, standard support and no monitoring, to $1,199/month on the “Growth Plus” tier for 90 million messages per day and 30,000 concurrent connections with premium support and monitoring. After that, you can contact the team for enterprise-level pricing.

## PubNub


![PubNub](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ok4wcgeqzxomk7y5as4f.png)



[PubNub](https://www.pubnub.com/) is a real-time communication platform based on HTTP long-polling instead of WebSockets. It provides scalable infrastructure to send and receive messages at low latency, and supports presence, compression, and storage. Customers include Niantic, Kustomer, and Autodesk.

### Features

- Uses the Publish/Subscribe framework to send high volumes of messages
- Low latency messaging
- GZip message compression
- Message persistence for history through their storage API
- Presence detection

### Pros

- **Broad integration options**. PubNub offers SDKs for numerous platforms and languages, making integration effortless across various development environments.
- **Robust feature set**. Beyond just messaging, PubNub provides presence detection, storage, and playback, catering to diverse real-time app requirements.
- **High scalability**. Built for large-scale applications, PubNub can handle millions of concurrent connections without compromising performance.

### Cons

- **Pricing concerns**. As message volumes or connections increase, costs can escalate due to usage-based pricing, making budgeting unpredictable for high-traffic applications.
- **Lack of WebSockets**: PubNub uses the Publish/Subscribe model across HTTP rather than WebSockets. WebSockets have better scalability, better error handling, and lower latencies.

### Pricing

[PubNub](https://www.pubnub.com/pricing/) has a free tier giving users up to 200 MAUs or 1M total transactions per month. They are clear that this is for testing purposes only and should not be used for production. For production-level applications, they have a $49/month tier that allows up to 1000 MAUs and 3000 transactions per MAU. Usage-based billing is used beyond those limits.

## Ably


![Ably](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dfw9wpfmak2wikm09tdm.png)



[Ably](https://ably.com/) is a robust real-time data delivery platform based on WebSockets with features like message ordering, presence, and connection recovery. Customers include Toyota, HubSpot, and Verizon.

### Features

- Low latencies of ~65ms for notification delivery
- Queryable state API to find popular channels and user presence
- Reduced bandwidth with delta compression
- Also supports MQTT and server-side events as well as WebSockets

### Pros

- **Connection State Recovery**: Ensures interrupted users can resume their session without missing data.
- **Data Consistency**: Guaranteed message ordering and delivery ensure that all users receive updates in the correct sequence.
- **Edge network**. Ably uses 15 data centers around the globe and persists data across each to lower latencies.

### Cons

- **Pricing Model**: With a pay-as-you-go model, costs can escalate quickly with little control if you add more users and channels.

### Pricing

[Ably pricing](https://ably.com/pricing) has a free tier offering 6M monthly messages across 200 concurrent channels and 200 concurrent connections. They then move to a pay-as-you-go model which charges $2.50 per million messages, $15.00 per thousand concurrent channels, and $15.00 per thousand concurrent connections.

## [Socket.io](http://socket.io/)


![Socket.io](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c5rt5fzy1nvapbwy3cfn.png)



[Socket.io](https://socket.io/) is an open-source JavaScript library that facilitates real-time web communication. It simplifies bidirectional data transfer between web clients and servers. By abstracting WebSockets with fallbacks, it ensures consistent performance across devices and browsers, making real-time chats, notifications, and dynamic content more accessible for developers.

### Features

- Automatic reconnection
- Middleware to filter and act on incoming packets
- Built-in support for binary data.
- Multiplexing through multiple namespaces

### Pros

- **Ease of use**: Socket.io offers a simple API, enabling developers to quickly integrate real-time functionalities without deep expertise in WebSockets.
- **Cross-platform**: It provides client-side libraries for multiple platforms, ensuring broad compatibility across devices and browsers.
- **Fallback mechanisms**: If WebSockets aren't available, Socket.io automatically falls back to other methods, ensuring consistent connectivity.

### Cons

- **Scalability concerns**: For very large-scale applications, Socket.io might face challenges, requiring additional configurations or optimizations.
- **Self-hosting**: As Socket.io is only a library, you have to set up the infrastructure yourself.

### Pricing

N/A. Socket.io is an open-source library that allows you to build real-time communication more easily.

## Choosing the right solution

The above options are great choices for providing the backend infrastructure for real-time notifications. But if you want to use these real-time services as the foundation for in-app notifications, then you’ll have to think about what needs to be built around them. These options don’t feature:

- **UI components**. While these services provide the backend infrastructure for notifications, they don't typically offer ready-to-use frontend components, meaning you'd need to design and implement the visual aspects of your notifications separately.
- **Templated messaging**. You may need to build or integrate a system that allows for templated messages, letting you send consistent yet customizable notifications based on predefined templates.
- **Read receipts**. Knowing if and when a user has seen a message can be vital for engagement and user experience. These platforms might not offer out-of-the-box solutions for read receipts, necessitating additional development.
- **Interactivity**. These services deliver messages, but enabling interactive elements (e.g., buttons or links within notifications) would require additional development and design efforts.
- **User preferences**. Tailoring notifications to user preferences, such as frequency, type, or topic, is crucial for a positive user experience. Incorporating such customization would need a separate mechanism or system.

Each of these will have to be built out for a complete in-app notification system.

### Introducing notification infrastructure

[Knock](https://knock.app/) is a developer tool for building cross-channel notification systems. You can use it to add in-app notifications to your app with pre-built components to get you started quickly, but the power comes from integrating in-app and out-of-app channels such as email, push, SMS, and Slack. You can build workflows for these notifications so the right messages are sent via the right channels to the right users at the right time. We built Knock to be the best option for teams needing to implement any type of notification in their application.


![Knock](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3p4aqy2do775zesfia3e.png)



Knock also takes care of all of your retry and delivery logic, as well as [batching](https://docs.knock.app/designing-workflows/batch-function) (collapsing multiple notifications about a single topic into one), managing [per-user notification preferences](https://knock.app/features/preferences), and providing [unparalleled visibility into the notifications your product is sending](https://knock.app/features/observability).

[Knock](https://knock.app/) is an all-in-one notification platform that allows developers to build stateful, in-app notification experiences like floating feeds, inboxes, toasts and banners. Customers include [Vercel](https://knock.app/customers/vercel), [Amplitude](https://knock.app/customers/amplitude), and [Darwin Homes](https://knock.app/customers/darwin-homes).

### Features

- Pre-built components to power in-app notifications that can be customized to match your brand
- No infrastructure setup, no APIs to build
- Workflow builder to determine how to alert users
- Visual template builder to create and update notification templates
- Preferences API to let users take control of their notifications
- Strong support with responses in hours

If you'd like to try it out, you can [sign up for a free account](https://dashboard.knock.app/signup) and get started by checking out our [in-app feed docs](https://docs.knock.app/in-app-ui/overview). 👋