10. Tiptap 3.0 support

You can now use a collaborative Tiptap 3.0 editor, enabling features such as better static rendering, JSX extensions, improved TypeScript support, and more. This means we also support the latest versions of BlockNote now too.

9. Dashboard improvements

We’ve worked hard to improve the overall user experience of our dashboard, making it simpler and clearer how to manage your projects, rooms, and more. There's new hints and tooltips throughout.

8. Liveblocks AI assistant

We’ve added a multi-purpose AI assistant to our docs and dashboard, built with AI Copilots. Ask questions, create projects, navigate to pages, view your usage, contact support, and much more.

7. New AI Copilots examples and docs

I've spent a very long time writing detailed docs for AI Copilots, showing how to complex AI apps. We also have two new AI examples, the AI App builder, and the AI Calendar.

5. AI chat web search.

Your <AiChat /> can now search the web! Enable it when you create a copilot in the dashboard, or through our back end APIs.

3. Batched notifications.

You can now update existing notifications with new data. For example, sending status updates as a document is put in review or given a new assignee.

1. Group mentions.

You can now create group mentions in comments, for example "@​everyone" and "@​engineering".

There's two ways to enable it, either by passing a list of user IDs on the front end, or by using new managed groups on the back end.

Liveblocks now supports Tiptap 3.0! Check out our upgrade guide to get started.

Modals have descriptions, which explain how to build the feature, and you can scroll down to read them. Each product that's used in the demo is linked as a tag with its icon.

When you click on a card, @nextjs intercepted routes show a dynamic modal. However, when you refresh or load the page directly, an SEO optimised page is loaded, with its own title, schema, headings, etc.

Essentially, each modal is individually indexed by search engines.

Filter by product name or use the search for immediate results.

Each card displays a screenshot of the first video frame, and hovering over the card plays the video as soon as it's loaded. Mousing over also preloads a higher quality clip that's shown inside the larger pop-up.

They're all demos of @liveblocks.io, mostly built/recorded by me!

New video showcase, built with @pierrelevaillant.bsky.social.

↓ Design/code details

Liveblocks uses WebSockets to power our AI instead of HTTP, enabling multi-tab streaming, real-time updates, and more. You can see below how everything keeps streaming in, no matter if you change page, tab, or even reload.

Our team have written up why they chose WebSockets ↓

Spent a couple hours setting up AI that can edit sheets!

This combination feels really powerful when you give your AI other abilities, as demo'ed by this "Fetch weather" tool. Cells stream in one at a time, and are edited as they're completed.

Powered by @liveblocks.io .

Here's an unedited video—I'm using GPT-4.1 mini.

Liveblocks provides pre-built AI components for React, and to trigger to the streaming, I've added an `edit-code` tool with <RegisterAiTool />. In here, tell the tool it generates a string called `code` and it knows what to do!

Streaming AI generated code into an editor ✨

To make this work I'm calculating the line/character at the end of each chunk, and adding highlights in the editor. Then I'm merging the stream into the previous code so it doesn't start empty!

Uses by @liveblocks.io.