Drawing the Real Night Sky in a Browser

Glossary

Every annotated term in one list, grouped into astronomy, graphics, web and Asterarium-specific words.

Astronomy Graphics Web and tooling Asterarium's own terms

Within each group, entries are in alphabetical order of the headword.

Astronomy

aberration of light: The small tilt of an incoming ray towards the observer's own direction of travel, caused by that motion. Earth's orbital motion displaces a star by up to about 20 arcseconds, roughly a 180th of a degree.
altitude: The angle of an object above the observer's horizon: 0 degrees at the horizon, 90 degrees straight overhead, negative when the object is below it.
analytic series: A formula that approximates where a body is as a sum of polynomials in time and trigonometric terms. The formula itself yields the answer, so no precomputed table of positions has to be loaded.
apparent radius: The apparent size of a body expressed as an angle: the angle subtended by the radius of its disc. The Sun and the Moon both measure about 0.25 degrees in radius, half a degree across, so the two are very nearly equal. The Moon-Earth distance varies, so the lunar figure drifts up and down: an eclipse with the Moon at its larger sizes is total, one with the Moon smaller leaves a ring of Sun showing and is annular.
arcminute: A unit of angle equal to one 60th of a degree, that is, 60 arcseconds.
arcsecond: A unit of angle equal to one 3600th of a degree. The full Moon is about 1800 arcseconds across.
atmospheric refraction: The bending of light by Earth's atmosphere, which makes an object appear higher than it really is. The lift is largest near the horizon, where it reaches about 34 arcminutes, or 0.57 degrees.
atmospheric scattering: Sunlight bouncing off the molecules and particles of the air and spreading in every direction. Blue light scatters most, which is why the daytime sky is blue, and a low Sun, whose light crosses far more air, turns red.
azimuth: The angle measured along the observer's horizon eastward from due north: east is 90 degrees, south 180, west 270.
B−V colour index: The difference between a star's brightness measured through a blue filter and through a yellow one. A larger value means a redder star and a smaller one a bluer star, which makes it a proxy for surface temperature.
blackbody radiation: The light a heated object gives off, its colour and intensity fixed by temperature alone. Hotter is bluer and cooler is redder, which is what lets a star colour be approximated from a temperature.
Bortle scale: A nine-step scale, widely used by amateur astronomers, for how dark a night sky is. Step 1 is the darkest sky, where the Milky Way shows in full, and step 9 is an inner-city sky.
bright limb: The lit edge of a crescent or gibbous body. On the sky it faces whichever side the Sun is on. Its position angle states that direction as a number: the bearing of the middle of the lit edge, measured from celestial north towards the east.
celestial sphere: In astronomy, an imaginary sphere centred on the observer, used to describe the direction in which something appears. It carries no distance at all: it keeps the direction to an object and discards how far away it really is. In this article the word also names the container of 3D objects standing in for it, and since one scene unit is about a metre, the stars sit on a sphere of 1000 units, a kilometre in radius.
coordinates of date: Coordinates referred to the equator and the vernal equinox — the crossing of the celestial equator and the Sun's yearly path — as those stand at the moment in question. Because Earth's rotation axis slowly changes direction, they drift away from J2000 coordinates, which are pinned to the year 2000, the further from that year one goes. Catalogues are written in J2000, while where something appears right now is worked out in coordinates of date.
culmination: The moment an object crosses the observer's meridian, the line running from due north through the zenith to due south, and reaches its highest point of the day. In the northern hemisphere it is then usually due south.
declination: The latitude-like angle on the sky, measured from the celestial equator, which is Earth's equator projected outward: positive to the north, negative to the south, up to 90 degrees.
deep-sky object: A collective name for the diffuse things beyond the solar system that are not single stars: nebulae, star clusters and galaxies. Most of them need binoculars or a telescope.
ECEF: Earth-Centered, Earth-Fixed: a rectangular coordinate system locked to the turning Earth, with its origin at Earth's centre, its Z axis along the rotation axis and its X axis towards longitude zero.
ecliptic longitude: An angle measured eastward along the ecliptic, the Sun's yearly path across the sky, starting from the vernal equinox where that path crosses the celestial equator. It is the natural longitude for the Moon and the planets.
ephemeris: A table of where a body is at each moment, or the model that computes those positions. Two different ephemerides give slightly different positions for the same moment.
equatorial coordinates: A coordinate system built by extending Earth's equator and rotation axis outward onto the sky. A position is given as two angles: right ascension, which works like longitude, and declination, which works like latitude. It does not turn with the Earth, so a star's values stay nearly fixed.
F-type star: One rung of the scheme that sorts stars by surface temperature: a little hotter than the Sun and white to the eye, at roughly 6,000 to 7,500 K.
geodetic coordinates: A place on Earth given as latitude, longitude and elevation. The elevation is measured not from a true sphere but from an ellipsoid of revolution, the slightly flattened shape used to approximate the Earth.
horizontal coordinates: A coordinate system based on the observer's own horizon, giving a position as two angles: azimuth, measured round from north, and altitude, measured up from the horizon. The same star takes different values from another place or at another time.
illuminated fraction: The fraction of a body's apparent disc that looks lit: 0 at new Moon, 0.5 at a half Moon, 1 at full.
J2000: One of the reference epochs that say when a set of astronomical coordinates applies: noon Universal Time on 1 January 2000. Most star catalogues give their positions in it.
libration: The slight rocking of the Moon as seen from Earth. Because of it, about 59 per cent of the lunar surface becomes visible over time.
magnitude: A number for how bright an object looks: smaller is brighter, and a difference of one magnitude is a factor of about 2.512 in brightness. Under a dark sky the naked eye reaches roughly 6 to 6.5.
orrery: A mechanical model that shows the planets circling the Sun. Asterarium borrows the name for a standalone page that looks down on the planetary orbits and where each planet is now.
parallax: The change in an object's apparent direction when it is viewed from a different position. Distances to the stars are measured from annual parallax, the yearly shift caused by Earth's orbit, an angle that stays under one arcsecond, a 3600th of a degree, even for the nearest star. What shifts a drawn position instead is diurnal parallax, the shift that comes of observing from a point on Earth's surface rather than from Earth's centre, which reaches about one degree for the Moon.
phase angle: The angle between the Sun and the observer as seen from the body itself. For the Moon, 0 degrees is full and 180 degrees is new. How much of the disc looks lit follows from this angle alone, so it cannot tell a waxing Moon from a waning one.
precession: The slow circling of Earth's rotation axis, one turn in about 26,000 years. It carries the vernal equinox, the zero point of sky coordinates, along with it, so every star's coordinates drift as well.
proper motion: A star's slow drift across the sky from year to year. Even Barnard's Star, the fastest of any star in the sky, moves only about 10 arcseconds a year, a 360th of a degree. Barnard's Star is itself magnitude 9.5, fainter than the 8th-magnitude cut of the catalogue this article ships, so it is not among the stars drawn.
reference epoch: The reference moment that says when a set of coordinates or orbital values applies. J2000 is the one most widely used for star positions.
right ascension: The longitude-like angle on the sky, measured eastward along the celestial equator, which is Earth's equator projected outward, starting from the vernal equinox where the Sun's yearly path crosses it. It is conventionally written in hours, where 24 hours is 360 degrees.
sidereal time: Earth's rotation angle expressed as a clock, measured against the vernal equinox, the crossing of the celestial equator and the Sun's yearly path, rather than against the Sun. Because it is an angle written in units of time, 24 hours is 360 degrees and one hour is 15 degrees. In almanac terms, where a star appears is set by this value rather than by solar time, though whether a given implementation uses it directly is another question.
topocentric: Measured from a point on Earth's surface rather than from Earth's centre. For a body as near as the Moon the two directions differ by up to about one degree.
twilight: The stretch of time when the Sun is below the horizon but the sky is still lit. It deepens as the Sun sinks, so an evening runs civil twilight, down to 6 degrees below the horizon, then nautical to 12, then astronomical to 18. A morning takes the same stages in reverse, from astronomical through nautical and civil to sunrise.
vernal equinox: The point where the Sun's yearly path crosses the celestial equator, the projection of Earth's equator onto the sky, moving from south to north. Longitude-like angles on the sky are all measured from it.

Graphics

additive blending: A blending mode that adds the new colour onto what is already on screen. Real light also adds up where it overlaps, which suits stars and atmospheric glow.
AgX: One of the curves used to fit brightness into what a display can show. It lets highlights lose their colour gradually, giving a roll-off closer to photographic film than the curves used before it.
alpha: The opacity value carried alongside a colour: 0 is fully transparent, 1 fully opaque.
basis: The set of mutually perpendicular unit-length vectors that fix the axes of a coordinate system. Laying them out as the columns of a matrix gives the transform into that coordinate system.
billboard: A four-cornered flat mesh turned so that it always faces the camera. Because it sets its own size it can spread wider than a point drawn by the GPU, which is what a broad glow needs.
bounding sphere: A sphere that encloses a 3D object entirely, kept as nothing more than a centre and a radius. It stands in for the detailed shape in cheap tests, such as whether the object is off screen or how far it sits from the camera.
depth: In rendering, the distance from the camera to whatever is seen at a given pixel. Comparing these values is how a renderer works out what hides what.
depth buffer: GPU memory that records, for every pixel, the distance to whatever is currently drawn there. It is what lets a near object hide a far one. What it holds is not the distance itself but a normalised depth, mapped onto 0 to 1, with 1.0 meaning nothing nearer than the far limit.
depth test: The comparison that throws away a new pixel when what is already drawn there is nearer, so objects sort correctly whatever order they are drawn in. By default in three.js, the standard 3D library, a pixel at exactly the same distance still passes.
discard: An instruction in a shader, the small program running on the GPU, that throws the current pixel away so nothing is written for it. It writes neither a colour nor the per-pixel distance a renderer keeps to work out what hides what, so a pixel that would have contributed nothing leaves whatever is behind it visible.
dot product: A calculation that turns two vectors into a single number. When both have length 1 it measures how nearly they point the same way: 1 for the same direction, 0 at a right angle, −1 for opposite directions.
draw range: The span of the already-prepared vertices that a given draw actually uses. It lets the number of things drawn change without rebuilding the data.
EffectComposer: The three.js object that chains the full-screen passes applied after a scene is drawn: the scene goes into an offscreen image, runs through each pass in turn, and only then reaches the display.
EXR: An image format that stores brightness as real ratios instead of squeezing it into a 0-to-1 range. Its full name is OpenEXR, and it is the standard interchange format in film and CG work.
far plane: The far clipping distance of a camera: nothing beyond it is drawn. Its ratio to the near clipping distance decides how finely distant objects can be told apart in depth, so it is set as tight as the scene allows.
fragment: One pixel-sized candidate produced while the GPU breaks a shape into pixels. Only those that survive the checks for whether something nearer is already there end up as colour on screen.
fragment shader: The GPU program that computes the colour of each individual pixel. Its cost grows with the screen area a shape covers, so large shapes are expensive.
frame: One image of a moving picture. Smooth motion needs roughly 60 of them a second, which leaves about 16 milliseconds to build each one. A coordinate frame is a different use of the same word.
glare: The spill of brightness around a very bright source, caused by light scattering inside an eye or a lens. It spreads wider than the source itself.
GLSL: The language in which WebGL shaders, the small programs that run on the GPU, are written. It has C-like syntax and built-in vector arithmetic.
HDR: High dynamic range: keeping brightness as real ratios instead of clamping it into a 0-to-1 range, so values many powers of ten apart can coexist in one image.
KTX2: A container format holding textures already compressed into a form the GPU, the chip built for rendering, can use directly. What it carries can be turned into whichever compression a given device supports, so one file serves them all.
linear RGB: A way of holding colour in which the number is proportional to the amount of light. The sRGB values a display takes are bent to suit the eye, so light is added and multiplied in linear form and converted back at the very end.
lookup table: A precomputed array of values that is read instead of recomputed. On the GPU it is held as an image, turning an expensive calculation into a single fetch.
matrix: A rectangular array of numbers. In 3D it holds a coordinate transform, a rotation or a displacement, as one object, and multiplying transforms together collapses a whole chain of them into a single matrix.
MSAA: Multisample anti-aliasing: each pixel is sampled at several positions and the results averaged, so edges stop looking like stairsteps. The distance value used to decide what hides what is kept per sample as well, so that memory grows with the sample count.
near plane: The near clipping distance of a camera: nothing closer is drawn. The nearer it is placed, the less precision is left for distant objects, so its position decides how reliably far things sort.
normalised depth: The camera distance mapped onto the range 0 to 1, which is what a depth buffer, the GPU memory holding a distance per pixel, actually stores. The near clipping plane sits at 0 and the far limit at 1.0.
orthogonal matrix: A matrix whose axes are mutually at right angles and all of length 1. Its inverse is simply its transpose, the same numbers with rows and columns swapped, so the reverse transform costs nothing to obtain.
pixel: One of the small squares a screen is divided into; a picture is the whole array of them. Colour is decided one pixel at a time, so the cost of drawing follows roughly from how many of them have to be filled.
point spread function: The function describing how a point source of light is smeared out by an optical system. It is why a star looks like a small blur rather than a mathematical point.
post-processing: A full-screen pass applied to the image after the scene has been drawn. Fitting brightness to what a display can show, and adjusting colour, both happen at this stage. In this article the sky itself is drawn as one of these passes.
power law: A shape in which a quantity falls off as some power of distance. It does not vanish as abruptly as an exponential, so it keeps a long tail, which is how the spill of light around a bright source behaves.
quad: A single four-cornered flat surface, two triangles at its simplest. It is what a texture is pasted onto, or what covers the screen for a full-screen pass.
quantisation: Rounding a continuous value onto a ladder of fixed steps. Anything finer than one step is lost, so two values that differed can come out equal, or even swap order, once rounded.
radiance: The physical measure of how much light leaves a surface in a given direction. It is what a camera or an eye actually receives, so physically based rendering computes it. It has no ceiling: a daytime sky runs far above the 0-to-1 range a display is given.
React Three Fiber: A library that lets a three.js scene be written as React components, so React reconciles 3D objects rather than HTML elements.
Rec.709: The colour standard set for high-definition television, sharing its primaries and white point with sRGB, the standard for computer displays. The weights for collapsing a colour into a single brightness figure, 0.2126 red, 0.7152 green and 0.0722 blue, come from it.
renderOrder: The three.js number that fixes the order in which objects are drawn. Transparent objects do not sort correctly by distance alone, so their order is set by hand.
shader: A small program that runs on the GPU, the chip built for rendering, to compute where a vertex goes or what colour a pixel takes. It runs once for every vertex or every pixel it is handed.
significand: The part of a floating-point number that carries its significant digits. Its width is fixed, so the spacing between representable values grows in proportion to the size of the number; a 32-bit float has 24 bits of it.
spherical linear interpolation: Interpolation that walks from one point on a sphere to another along the circle a plane through the sphere's centre traces, at a constant rate. It is the standard way to blend two orientations smoothly.
sprite: A point that the GPU, the chip built for rendering, draws as a square of a size given in pixels. Throwing away everything outside a circle turns it into a round star, which is the cheap way to draw a whole sky of point-like objects. This article uses the word in three senses: that point, the three.js panel that carries an image and always faces the camera (used for labels), and a sprite sheet, an image packing many small pictures into one (used for the deep-field galaxies).
three.js: The standard JavaScript library layered over WebGL, the browser 3D interface. It expresses a picture as scenes, cameras, geometries and materials instead of raw draw calls.
tone mapping: The step that maps the wide range of brightness held in real ratios into the narrow range a display can actually show. The shape of the curve decides how colour and highlights read.
uniform: A value handed into a shader, the small program running on the GPU, that stays constant for the whole draw. The current time or the direction of the Sun are typical.
unit vector: A vector whose length is exactly 1, so that it carries a direction and nothing else. It is the natural way to hold a quantity like where a star appears, which is a direction without a distance.
vertex shader: The GPU program that decides where each vertex of a shape lands on screen. It runs once per vertex.
WebGL: The web standard that lets a page draw 3D graphics with the GPU, the chip built for rendering, straight from the browser. No plugin is involved.
z-fighting: The flicker seen where two surfaces sit at almost the same distance and the judgement of which one is in front swaps from pixel to pixel, or from frame to frame. The cause is a difference in distance that cannot be represented: it happens when depth, the distance from the camera, is stored in coarse steps, and also when vertex coordinates are so large that rounding error grows.

Web and tooling

catalogue tier: One level of something divided into graded levels. In this article it names the brightness bands the star catalogue is cut into, and the band holding the brighter stars alone sits unchanged at the head of the band that goes down to the fainter ones. That banding of the catalogue is a separate idea from the quality tiers, the presets that change how heavy the rendering is.
Cloudflare Pages: A hosting service that serves static files from edge locations worldwide, building and publishing from a connected Git repository.
fail closed: A design stance of refusing rather than allowing whenever the outcome is uncertain. For a test it means never writing an assertion loose enough to pass on a blank screen.
fast-check: A JavaScript library for tests that generate their inputs and check a property over all of them.
minification: The step that shrinks JavaScript for release, rewriting long names into short ones and stripping whitespace. What ships therefore carries short invented names in place of the ones the source was written with. It does not touch the inside of a string literal, a piece of text in quotes, so a word written there survives intact.
property-based testing: Testing that generates many inputs automatically and checks a property that should hold for all of them, instead of listing cases one by one. A failing input is shrunk down to its smallest form.
R2: Cloudflare's object storage, the place for large files such as textures and binaries. Unlike most comparable services it charges nothing for data leaving the bucket.
server component: A React component rendered at build time or on a server rather than in the browser. When the whole site is written out ahead of time, it runs exactly once, during the build.
static export: Building the whole site into HTML and JavaScript files ahead of time, so nothing is assembled per request; delivery is only the handing out of files that already exist.
Zustand: A small state-management library for React: it builds the store, the single place where shared state lives. Each part of the interface declares which slice of that state it uses, so it is redrawn only when that slice changes.

Asterarium's own terms

celestial group: In Asterarium's 3D scene, the three.js Group, a container that moves its children as one, standing in for the celestial sphere. The stars, the constellation lines, the Milky Way and the deep-sky markers are its children, so overwriting the matrix that holds its orientation turns all of them together.
night factor: In Asterarium, a number from 0 to 1 saying how far into night the sky has gone: 0 with the Sun on the horizon, 1 once it is 18 degrees below and the sky is fully dark. It fades the stars, the constellation lines, the Milky Way and the deep-sky markers together. The Moon stays an opaque disc, but its brightness follows this number squeezed into the range 0.25 to 1, so it shows faintly by day, while the planets come out on a separate threshold in solar altitude of their own.
NUE: The name of the axis convention Asterarium's 3D scene uses. With the observer at the origin, the X axis points true north, the Y axis to the zenith and the Z axis true east. The name is the initials of North, Up and East.
pure computation layer: In Asterarium, the modules that reference neither three.js, nor React, nor any state store: the astronomy maths and the code around it. They run without a browser, so testing them is a matter of handing in an input and checking the value that comes back.
quality tier: In Asterarium, a preset that changes the rendering load as a group. There are four, low, medium, high and ultra: low draws the 6,000 brightest stars, medium the 8,037 of the brighter catalogue, high and ultra all 38,168, and the tier also sets the pixel-density ceiling and whether stars twinkle. The level moves up or down on its own with the measured frame rate.
screening mode: In Asterarium, a full-screen state that hides every control and shows nothing but the sky. The interface fades out after a few seconds without input and comes back when the viewer moves.
sky tour: In Asterarium, a saved sequence of scenes that plays back on its own, each scene recording a place, a moment, a camera direction and the display settings. One scene is called a step, and every step carries its own transition and dwell time.
standalone 3D page: In Asterarium, a 3D page that shares no scene code with the main sky or with the other such pages, and there are eight of them: the Moon globe, the moonwalk, the Mars globe, the deep field, the orrery, the interstellar flight, the eclipse viewer and the projector. Each one ships as its own bundle of code, so a visitor downloads only the page they opened.
the main sky: In this article, the name for the night-sky scene that opens on the site's front page. It draws the stars, constellation lines, the Milky Way, the Sun, Moon and planets through atmospheric scattering, seen from an observer standing on the ground. The name is there to tell it apart from the eight standalone 3D pages, separate pages such as the Moon globe and the projector which share no 3D code with it or with each other.
throttled subscription: In Asterarium, a way of carrying a value that changes every frame into the interface at a fixed low rate. To subscribe is to ask to be told whenever a value changes; here the interface side, the one being told, names the rate it wants, such as twice a second. The clock readout re-reads twice a second by default, so it is not rebuilt once per frame.
world coordinates: The coordinate system that places objects in Asterarium's 3D scene: one unit is about a metre, the origin is the observer, and the axis convention is called NUE, for North, Up and East. Distances here are drawing conveniences, not real ones: stars go on a sphere of radius 1000 (about 1 km), and the Sun, Moon and planets sit outside it at two million (about 2,000 km). The layer of air the sky model draws is some 60,000 units, or 60 km, thick.