Getting Started with @briklab/slikr

slikr provides a unified API for WebTransport and WebSocket connections with automatic fallback, retries, and keepalive.

What is slikr?

slikr is a real-time communication client that automatically chooses between WebTransport (for modern browsers) and WebSocket (fallback) based on browser support. It handles connection management, retries, and provides a simple event-based API.

import slikr from "@briklab/slikr";

const client = slikr("wss://echo.websocket.org");

await client.connect();

client.on("message", (data) => {
  console.log("Received:", data);
});

await client.send("hello", "world");

Basic Usage

Connecting

import slikr from "@briklab/slikr";

const client = slikr("wss://your-server.com/ws");

// Connect with default settings
await client.connect();

// Or with custom retry settings
await client
  .retry(3)
  .retryDelay(1000)
  .connect();

Sending Messages

// Send JSON data
await client.send("chat", {
  message: "Hello everyone!",
  timestamp: Date.now()
});

// Send binary data
await client.send("file", new Uint8Array([1, 2, 3, 4]));

Receiving Messages

// Listen for specific events
client.on("chat", (data) => {
  console.log("Chat message:", data.message);
});

// Listen for all events
client.on((eventName, payload) => {
  console.log(`Event ${eventName}:`, payload);
});

Waiting for Specific Messages

// Wait for a response with timeout
try {
  const response = await client.receive("response", 5000);
  console.log("Got response:", response);
} catch (error) {
  console.log("Timeout waiting for response");
}

Connection Status

console.log(client.status);
// Output: { url: "wss://your-server.com/ws", type: "WebSocket" }

Keepalive

slikr automatically sends keepalive pings to maintain connections:

// Enable keepalive with 5 second intervals
client.keepalive(true).keepalive(5000);

Live Demo

import slikr from "@briklab/slikr";
// Note: Live demo uses mock WebSocket for demonstration
const client = slikr("wss://echo.websocket.org");
console.log("Silkr client created:", client.status);
client.on("message", (data) => console.log("Received:", data));
// In real usage: await client.connect(); await client.send("test", "hello");

import slikr from "@briklab/slikr"; // Note: Live demo uses mock WebSocket for demonstration const client = slikr("wss://echo.websocket.org"); console.log("Silkr client created:", client.status); client.on("message", (data) => console.log("Received:", data)); // In real usage: await client.connect(); await client.send("test", "hello");

Console

No logs yet.

Transport Selection

slikr automatically detects browser support:

• WebTransport: Used when available (modern browsers with datagram support)
• WebSocket: Fallback for older browsers or when WebTransport isn't supported

Features

• Automatic Fallback: WebTransport with WebSocket fallback
• Retry Logic: Configurable connection retries with backoff
• Keepalive: Automatic heartbeat to maintain connections
• Event System: Simple pub/sub messaging
• TypeScript: Full type safety
• Binary Support: Send/receive binary data

Next Steps

Learn more about slikr:

• Examples: Common patterns and use cases
• Advanced: Advanced configuration and error handling
• Slikr API: Complete API reference