Streams Demo

Streams efficiently send only changed items over the websocket.

Messages Stream

Welcome to streams!
Click buttons to see stream operations
Watch the diff panel below

How Streams Work

Streams allow efficient rendering of large lists. Instead of re-sending the entire list on each change, only the operations (insert, delete) are sent over the websocket.

The "stream" key in the diff contains: [stream_ref, [[dom_id, at, limit], ...], [deletes], reset?]

  • stream_ref: Stream name/reference
  • inserts: Array of [dom_id, at, limit] tuples (-1=append, 0=prepend)
  • deletes: Array of DOM IDs to remove
  • reset: When true, clears all items before applying inserts