Realtime price board

<script lang="ts">
  import { Grid, type GridApi } from 'bo-grid'
  import { createTickStream } from 'bo-grid/realtime'

  let rows = $state.raw(quotes)   // one plain object per symbol
  let api: GridApi
  // Ticks coalesce to one patch a frame; only the changed cells repaint.
  const stream = createTickStream({ apply: (batch) => api.patchRows(batch) })
  feed.subscribeQuotes(symbols, (qs) => qs.forEach((q) => stream.push(q.symbol, q)))
  stream.start()
</script>

<Grid {rows} {columns} getRowId={(r) => r.symbol} flashMotion="hold"
      onReady={(a) => (api = a)} />

● Simulated market data, generated in your browser

A realtime board for any exchange: 1,000 symbols at 30,000 ticks a second, cells that flash on change, grouping, pivot and Excel export.

Rows tick in place; sort, filter and group while the market moves.

API: bo-grid