Liveblocks vs Socket.io

import { createClient } from '@liveblocks/client';
import { createRoomContext } from '@liveblocks/react';

const client = createClient({
  publicApiKey: process.env.NEXT_PUBLIC_LIVEBLOCKS_KEY!,
});

export const {
  RoomProvider,
  useOthers,
  useUpdateMyPresence,
} = createRoomContext(client);

// In your component:
function CollabRoom() {
  const others = useOthers();
  const updatePresence = useUpdateMyPresence();

  return (
    <div onMouseMove={(e) => updatePresence({ cursor: { x: e.clientX, y: e.clientY } })}>
      {others.map(({ connectionId, presence }) =>
        presence.cursor ? <Cursor key={connectionId} {...presence.cursor} /> : null
      )}
    </div>
  );
}

// Server (Node.js)
import { createServer } from 'http';
import { Server } from 'socket.io';

const httpServer = createServer();
const io = new Server(httpServer, { cors: { origin: '*' } });

io.on('connection', (socket) => {
  console.log('client connected', socket.id);
  socket.on('message', (data) => io.emit('message', data));
});

httpServer.listen(3001);

// Client
import { io } from 'socket.io-client';
const socket = io('http://localhost:3001');
socket.on('message', (data) => console.log(data));