Examples menu

Stock Ticker multiplayer

Watch simulated prices change every two seconds, and open a stock for its chart. A server timer moves the prices and broadcasts the ROUTE scope, and one shared render serves every viewer.

Simulated market data updates every 2 seconds from a $app->setInterval() timer. Prices drift randomly and history is tracked for each symbol.
ROUTE scope on the dashboard, with shareRender: true: one render per tick serves every viewer. Each detail page declares its signals in a custom scope per symbol, so each symbol updates independently.
Idle when unwatched: the timer skips its work while countClients() finds no open dashboard or detail page on any worker.
Deep linking: each stock has its own URL (/stock/{symbol}). Navigate directly to a ticker or click through from the dashboard.
Signal-driven charts on detail pages. The timer writes the price history into the symbol's signals, and each write broadcasts to its viewers, so the chart updates without rendering the page again.
Apache ECharts draws the chart on detail pages. Datastar writes the history signals into the chart element's attributes, and the element redraws when they change.
One worker: this demo keeps the prices in PHP statics, which each worker holds on its own. See What stays per worker before you run it with withWorkerNum().
Source View handler .php View dashboard template .twig View detail template .twig

Signals

price string custom scope

Current formatted price for a stock symbol. Custom scope per symbol.

times array custom scope

Timestamp array for the price history chart.

prices array custom scope

Price array for the chart. Updated every 2 seconds by the server timer.

Views

stock_dashboard.html.twig

ROUTE-scoped dashboard with the price of all 8 stocks. One shared render per tick for all viewers.

stock_detail.html.twig

Per-symbol detail page with the ECharts chart. Rendered once; the signals carry every later price.

stock_not_found.html.twig

Fallback for unknown stock symbols.