Skip to content

Examples with @briklab/slikr

This page shows common usage patterns and realistic scenarios for slikr.

Chat Application

ts
import slikr from "@briklab/slikr";

const chatClient = slikr("wss://chat.example.com");

await chatClient.connect();

chatClient.on("message", (data) => {
  console.log(`${data.user}: ${data.text}`);
});

chatClient.on("user_joined", (data) => {
  console.log(`${data.user} joined the chat`);
});

// Send messages
await chatClient.send("message", {
  text: "Hello everyone!",
  user: "Alice"
});

Request-Response Pattern

ts
import slikr from "@briklab/slikr";

const apiClient = slikr("wss://api.example.com");

await apiClient.connect();

// Send a request and wait for response
async function makeRequest(action, data) {
  await apiClient.send("request", { action, data, id: Date.now() });

  try {
    const response = await apiClient.receive("response", 10000);
    return response;
  } catch (error) {
    throw new Error("Request timeout");
  }
}

// Usage
const result = await makeRequest("get_user", { id: 123 });
console.log("User data:", result);

Binary File Transfer

ts
import slikr from "@briklab/slikr";

const fileClient = slikr("wss://files.example.com");

await fileClient.connect();

// Send file chunks
async function sendFile(file) {
  const chunkSize = 1024;
  const chunks = [];

  for (let i = 0; i < file.size; i += chunkSize) {
    chunks.push(file.slice(i, i + chunkSize));
  }

  for (let i = 0; i < chunks.length; i++) {
    await fileClient.send("file_chunk", {
      index: i,
      total: chunks.length,
      data: chunks[i]
    });
  }

  await fileClient.send("file_complete", { name: file.name });
}

// Receive file
fileClient.on("file_chunk", (chunk) => {
  // Handle incoming chunk
  console.log(`Received chunk ${chunk.index}/${chunk.total}`);
});

Connection with Retry Configuration

ts
import slikr from "@briklab/slikr";

const client = slikr("wss://unreliable.example.com")
  .retry(5)                    // Max 5 retries
  .retryDelay(1000)            // Start with 1s delay
  .retryDelayIncreaseFn(d => d * 1.5)  // Increase delay by 50% each time
  .retryTimeout(3000)          // 3s timeout per attempt
  .totalTimeout(30000)         // Give up after 30s total
  .onRetry(n => console.log(`Retry attempt ${n}`))
  .onRetryTimeout(n => console.log(`Attempt ${n} timed out`))
  .onTotalTimeout(() => console.log("Connection failed completely"));

try {
  await client.connect();
  console.log("Connected successfully!");
} catch (error) {
  console.error("Failed to connect:", error.message);
}

Real-time Game State Sync

ts
import slikr from "@briklab/slikr";

const gameClient = slikr("wss://game.example.com");

await gameClient.connect();

// Enable keepalive for long sessions
gameClient.keepalive(true).keepalive(10000); // 10s intervals

gameClient.on("game_state", (state) => {
  updateGameUI(state);
});

gameClient.on("player_joined", (player) => {
  addPlayerToGame(player);
});

gameClient.on("player_moved", (move) => {
  updatePlayerPosition(move.playerId, move.position);
});

// Send player actions
function sendMove(direction) {
  gameClient.send("player_move", {
    direction,
    timestamp: Date.now()
  });
}

Error Handling

ts
import slikr from "@briklab/slikr";
import { Slikr } from "@briklab/slikr";

const client = slikr("wss://example.com");

try {
  await client.connect();
} catch (error) {
  if (error instanceof Slikr.Error) {
    console.error("slikr error:", error.message);
  } else {
    console.error("Unknown error:", error);
  }
}

// Handle connection drops
client.on("close", () => {
  console.log("Connection closed, attempting reconnect...");
  // Implement reconnection logic
});

Live Demo

Console
No logs yet.

Next Steps