Liveblocks Broadcast

Broadcast real‑time events to connected users

Liveblocks Broadcast enables you to make your product smarter by sending real‑time events to people.

Use cases

Make your product smarter with event broadcasting

Use broadcast events to add features such as presentation mode, automatic refresh, automatic fetch, and more.

  • Automatic refresh

    Automatically refresh the page for certain people based on the rules defined in your codebase.

  • Presentation mode

    Enable users to present work by letting them control the state of everyone’s user interface.

  • Automatic fetch

    Broadcast events can be used to automatically fetch new data when other people have updated it.

  • Ephemeral chat

    Enable people to broadcast short messages in real‑time. Useful for things like chat cursors and more.

Designed for developers

Broadcast events to other connected clients in real‑time

Liveblocks integrates directly with popular frameworks and state‑management libraries, making it easy to broadcast events to connected clients in real‑time.

User A
User B
import { useState } from "react";import {  useBroadcastEvent,  useEventListener,} from "./liveblocks.config";
export default function Broadcast() { const [count, setCount] = useState(0); const broadcast = useBroadcastEvent();
useEventListener(({ connectionId, event }) => { switch (event.type) { case "increase": setCount((count) => count + 1); break; case "decrease": setCount((count) => count === 0 ? 0 : count - 1); break; } });
return ( <> {count} <button onClick={() => broadcast({ type: "decrease" })}> - </button> <button onClick={() => broadcast({ type: "increase" })}> + </button> </> )}

Start making your product collaborative with the Liveblocks toolkit today