✓ Todo List
Multiplayer todo app. One shared list for all connected clients — ROUTE scope.
ROUTE scope means every browser tab visiting this URL shares the same todo list. Add an item in one tab and it appears in all others instantly.
Mixed scopes on the same page: the todo list is shared (ROUTE), but the input field is private (TAB) — your draft doesn't leak to others.
Broadcast pushes updates to all connected clients in the scope. After adding, deleting, or toggling a todo, everyone's view re-renders.
cacheUpdates: false disables view caching so every broadcast re-renders the full list. This is intentional — the todo array changes on every action.
Partial rendering — on updates only the
#todo-list fragment is sent, not the entire page shell. This keeps SSE payloads small and fast.In-memory storage keeps it simple for a demo. In production you'd swap the static array for a database query inside the view function.
-
Bcfg
-
Hccc
Total: 2 items
⚡ Signals
newTodo
string TAB "" Draft input text — private per tab so your typing doesn't leak to others.
🎯 Actions
addTodo
Appends the draft to the shared list and broadcasts to all viewers.
deleteTodo
Removes a todo by ID and broadcasts the updated list.
toggleTodo
Flips the completed state of a todo and broadcasts.
👁 Views
todo.html.twig
ROUTE-scoped shared list with TAB-scoped input. Partial rendering sends only the #todo-list block on updates.