Lessons 1-4 used a viewer helper. Now we peel that away and use the data stream
directly for lists, maps, games, and custom renderers.
Learning goal
This notebook follows the provider-only pattern: create a provider, stream star cells,
listen for deltas, and turn those star cells into rows. The required attributes are
position, magAbs, teffLog8, and
objectRef.
In this lesson, star cells are octree data chunks streamed by the
provider. Notebook steps are the editable code blocks you run in
order. Rows are app-owned interpretation: the provider does not decide what your app
is trying to show.
The rows from this lesson are plain JavaScript objects. You can draw them with
Canvas, PixiJS, Phaser, SVG, or your own renderer. SkyKit is not required once you
choose to own rendering yourself.
How to read the notebook
Each notebook step runs in the same notebook state. That is why step 1 begins with
provider?.dispose?.(): if you rerun the step, the old provider may
still be alive. Optional chaining makes the cleanup safe when no provider exists
yet, or when a provider implementation has no dispose method.
Step 2 does not download "all stars." It asks for the star cells needed around one
observer view, using a demand strategy and a short attribute list. The stream
reports progress with deltas, and stars/current marks the first
complete answer for that view.
Step 3 is where provider data becomes application data. The helper
rowsFromCells() reads packed arrays from each star cell and returns
ordinary row objects that the lesson can filter, sort, slice, and render.
Live notebook
Stream stars into a table
Run the notebook steps in order, or edit one step and rerun from there.
Ready.
Run the notebook to render rows.
Things to try
Change limitingMagnitude in step 2.
Move observerPc to another location in parsecs.
Change the sort in step 3 from brightest stars to coolest stars.
Add a local filter before slice(0, 40).
What changed in the code
There is no Three.js renderer here. The provider emits deltas such as
stars/cells-upsert, stars/cells-remove, and
stars/current. The notebook keeps a local cells array
of provider star cells, then creates rows by reading coordinate arrays and public
star refs.
The comments in the notebook steps are deliberately detailed because this lesson
exposes the data lifecycle that the viewer normally hides: open a provider, choose a
demand strategy, request attributes, consume async deltas, and dispose of long-lived
resources when a run is replaced.
The rendered table intentionally shows a semantic cell key from each
star cell, ordinal, x/y/z parsec positions, absolute magnitude, decoded
temperature, and whether a StarObjectRef is available. It does not
expose provider storage offsets.
Source and next steps
Use the provider examples for deeper diagnostics.
The SkyKit repository includes a minimal stream example with the same provider,
star-cell delta, and table-rendering structure.