skills.rest
flaviogragnolati
flaviogragnolatiCOMMUNITY
Explore all skills by this author →
GitHub

subscriptions

Set up real-time event streams with async generator subscriptions and SSE.

Updated Jun 26, 2025
Search Tags:#subscriptions#real-time#trpc#SSE#event streams#async generator
One-click install
npx skills add https://github.com/flaviogragnolati/coco --skill subscriptions-flaviogragnolati
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: subscriptions
Source: https://github.com/flaviogragnolati/coco/tree/main/.agents/skills/subscriptions
Command: npx skills add https://github.com/flaviogragnolati/coco --skill subscriptions-flaviogragnolati

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @trpc/server, @trpc/client, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill addresses the challenge of setting up and managing real-time event streams with async generator subscriptions in server-side applications, focusing on server-side event handling and client-side subscription management.

Core Features & Use Cases

  • Async Generator Subscriptions: Set up event streams using .subscription(async function*() { yield }).
  • Server-Side Event Handling: Provides instructions for server-side event handling with SSE via httpSubscriptionLink.
  • Client-Side Subscription Management: Demonstrates client-side subscription setup with splitLink and httpSubscriptionLink.
  • Reconnection Recovery: Utilizes tracked(id, data) from @trpc/server for reconnection recovery with lastEventId.
  • WebSocket and SSE: Configures WebSocket via wsLink and createWSClient from @trpc/client, and applyWSSHandler from @trpc/server/adapters/ws.
  • Use Case: This Skill is ideal for developers looking to add real-time updates to their applications, such as live data feeds, real-time notifications, or live chat functionality.

Quick Start

Use the subscriptions skill to create a subscription to a real-time event stream and process events as they occur.

Frequently Asked Questions about subscriptions

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I set up real-time event streams with async generator subscriptions in tRPC?▼

Real-time event streams in tRPC are set up using async generator subscriptions via the `.subscription(async function*() { yield })` pattern. This approach handles server-side event generation and streams data directly to connected clients.

What is the best way to handle client-side subscription management with Server-Sent Events?▼

Client-side subscription management with Server-Sent Events (SSE) is handled using `splitLink` and `httpSubscriptionLink` from `@trpc/client`. This manages the connection and processes incoming events from the server.

How does tRPC handle reconnection recovery for real-time subscriptions?▼

Reconnection recovery in tRPC subscriptions uses the `tracked(id, data)` function from `@trpc/server`. It leverages the `lastEventId` to resume event streams seamlessly after a dropped connection.

Can I use WebSockets instead of SSE for tRPC subscriptions?▼

Yes, you can configure WebSockets for tRPC subscriptions instead of SSE. The setup uses `wsLink` and `createWSClient` from `@trpc/client`, combined with `applyWSSHandler` from `@trpc/server/adapters/ws`.

Do I need both @trpc/server and @trpc/client to manage real-time event streams?▼

Yes, both are required. `@trpc/server` manages server-side event handling and tracking, while `@trpc/client` handles client-side subscription setup and connection management for the real-time streams.

When should I use async generator subscriptions for real-time updates?▼

Async generator subscriptions are ideal for adding real-time updates like live data feeds, real-time notifications, or live chat functionality to server-side applications that require continuous event streams.

Related Skills

Explore More Software Engineering Skills→
flaviogragnolatiflaviogragnolati

links

Configure tRPC client link chains with httpLink, httpBatchLink, and wsLink.

Community
Intermediate
Ahoo-WangAhoo-Wang
15

fetcher-llm-streaming

Stream language model API responses via Server-Sent Events.

Community
Intermediate
apakouapakou

FE_PushNotificationIntegration

Integrate web push notifications in React apps using the Push API.

Community
Basic
JNZader-VaultJNZader-Vault

websockets

Implement WebSocket hub patterns for Go servers and TypeScript clients.

Official
Advanced