skills/real-time-features/SKILL.md
Implement real-time functionality using WebSockets, Server-Sent Events (SSE), or long polling. Use when building chat applications, live dashboards, collaborative editing, notifications, or any feature requiring instant updates.
npx skillsauth add cenjie/skills real-time-featuresInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
Implement real-time bidirectional communication between clients and servers for instant data synchronization and live updates.
Minimal working example:
// server.ts
import WebSocket, { WebSocketServer } from "ws";
import { createServer } from "http";
interface Message {
type: "join" | "message" | "leave" | "typing";
userId: string;
username: string;
content?: string;
timestamp: number;
}
interface Client {
ws: WebSocket;
userId: string;
username: string;
roomId: string;
}
class ChatServer {
private wss: WebSocketServer;
private clients: Map<string, Client> = new Map();
private rooms: Map<string, Set<string>> = new Map();
constructor(port: number) {
// ... (see reference guides for full implementation)
Detailed implementations in the references/ directory:
| Guide | Contents | |---|---| | WebSocket Server (Node.js) | WebSocket Server (Node.js) | | WebSocket Client (React) | WebSocket Client (React) | | Server-Sent Events (SSE) | Server-Sent Events (SSE) | | Socket.IO (Production-Ready) | Socket.IO (Production-Ready) |
development
Launch both thermo-nuclear review subagents in parallel, then synthesize their findings. Use for thermos, double thermo review, or combined bug/security and code-quality branch audits.
development
Comprehensive security and correctness audit of a branch's changes. Use for thermo nuclear, thermonuclear, or deep review requests, or branch/PR diff audits focused on bugs, breaking changes, security issues, devex regressions, and feature-gate leaks.
development
Run an extremely strict maintainability review for abstraction quality, giant files, and spaghetti-condition growth. Use for a thermo-nuclear code quality review, thermonuclear review, deep code quality audit, or especially harsh maintainability review.
development
Use for custom storefronts requiring direct GraphQL queries/mutations for data fetching and cart operations. Choose this when you need full control over data fetching and rendering your own UI. NOT for Web Components - if the prompt mentions HTML tags like <shopify-store>, <shopify-cart>, use storefront-web-components instead.