Examples menu

All Scopes multiplayer

Change a status that every visitor sees, a counter shared by everyone on this page, and a message only your tab sees. The three cards are components in GLOBAL, ROUTE and TAB scope; Page A and Page B each get their own ROUTE counter.

Three scopes on one page: GLOBAL (status banner), ROUTE (shared page counter), and TAB (personal message). Each component lives in a different scope to show the contrast.
Navigate between sub-pages to see the difference: the GLOBAL banner stays identical everywhere, each page has its own ROUTE counter, and the TAB message is unique per browser tab.
Components encapsulate each scope layer. The same page factory mounts all three components, so adding a new sub-page is a single function call.
Scope hierarchy visualised: GLOBAL is one state for the whole server, ROUTE is one state per URL, and TAB is born and dies with each browser tab.
Try it: open two tabs on the same sub-page and click the ROUTE counter. Both tabs update. Now open a tab on a different sub-page: its counter is independent.
One worker: this demo keeps the ROUTE counters in PHP statics, which each worker holds on its own. See What stays per worker before you run it with withWorkerNum().
GLOBAL: System Status
Status: All systems operational · Visitors: 0

Shared across ALL pages and users. Changes propagate everywhere.

ROUTE: Shared Page Counter
0

Shared by all users on THIS page only. Different pages have different counters.

TAB: Your Personal Message
Your message: Hello from your personal tab!

Private to this browser tab. Other tabs have their own value.

Page A

Notice: Global status is the SAME as Home, but the Route counter is DIFFERENT (this is Page A's counter).

Signals

personalMessage string tab scope initial: "Hello from your personal tab!"

Per-tab editable message. Private to each browser tab.

Actions

updateStatus

Randomizes the system status, counts the visit in GlobalState and broadcasts Scope::GLOBAL.

increment

Increments the page-specific shared counter and broadcasts the page's ROUTE scope.

reset

Resets the page-specific counter to 0 and broadcasts the page's ROUTE scope.

updateMessage

Randomizes the personal tab message. The new value goes to the tab after the action, with no broadcast.

Views

all_scopes.html.twig

Page shell with navigation between sub-pages.

Global banner

GLOBAL-scoped component showing system status shared across all pages and users.

Route counter

ROUTE-scoped component with a counter shared between all tabs on the same page.

Tab message

TAB-scoped component with a private editable message per browser tab.