175 simulations live
All simulations indexed in simulations.json with metadata, tags, difficulty and status fields.
Roadmap 2026
Public development plan for 3D Browser Simulations. Features are grouped by quarter — status updates as work progresses.
Completed
Service Worker + PWA
Cache-first CDN strategy, offline fallback page, stale-while-revalidate HTML. PWA installable.
ARIA on all canvases + sliders
aria-label/role=img on every canvas, aria-valuemin/max/now on all 164 range sliders, aria-describedby on labels.
HiDPI / Retina scaling
devicePixelRatio canvas scaling across all 175 simulations — both Three.js setPixelRatio and Canvas 2D property descriptor.
Full SEO meta + JSON-LD
og:image, Twitter card, canonical, BreadcrumbList, SoftwareApplication / Article / CollectionPage structured data on all pages.
Global search with index
Client-side fuzzy search over 88 entries (sims + articles + categories). URL-shareable queries, recent searches, filter by type.
In Progress
23 algorithm articles
In-depth articles for SPH, N-body, Boids, Lorenz, Conway's Life, wave equations and more with math formulas and code examples.
Changelog + RSS feed
Public version history page with coloured badges and timeline. RSS feed at /changelog/feed.xml.
Rolled to Q2
Procedural sand texture
Canvas-based procedural texture for the sand simulation with grain and colour variation.
Simulation thumbnail previews
1200×630 WebP screenshots for og:image, 400×300 thumbnails for cards. Puppeteer auto-capture script.
In Progress
Roadmap, About & Contribute pages
Public roadmap (this page), about page with project overview, contribution guide for new simulations.
WCAG colour contrast audit
Verify all text meets ≥ 4.5:1 contrast ratio in both dark and light themes using axe DevTools.
Planned
Playground editor
In-browser WebGL code editor (CodeMirror 6) with live preview, syntax highlighting and shareable URLs.
30 additional articles
Expand content library with tutorials (WebGL shaders, physics engines) and reference pages (formulas, glossary).
Web Workers for SPH + N-body
Move O(N²) physics computations off the main thread to keep UI at 60 FPS with large particle counts.
Simulation thumbnail screenshots
Puppeteer script to auto-capture 1200×630 WebP previews for og:image and card thumbnails on all 55 sims.
Ideas
Embed iframe API
Minimal embed versions of each simulation for third-party sites. URL parameter configuration (particle count, theme, etc.).
10 new simulations
Candidates: quantum harmonic oscillator, double slit, electric field lines, heat diffusion, Voronoi diagram, perlin noise terrain.
Showcase gallery
Masonry grid of best-looking simulation frames with lightbox viewer and "take screenshot" button on each sim.
Planned
Lighthouse CI automation
GitHub Action to run Lighthouse on every push — gate merges on Performance ≥ 90, Accessibility ≥ 90, SEO ≥ 95.
Kids category simulations
6 age-appropriate simulation categories (kids-magic, animals, math-art, space-kids, colors-light, build-play) with simplified UI and explanations.
Barnes-Hut for N-body
O(N log N) tree algorithm to replace O(N²) brute force — enables N > 2000 at 60 FPS on integrated GPU.
Ideas
WebGPU compute shaders
Migrate fluid SPH and N-body to WebGPU Compute for 10× speed-up on supported browsers (Chrome 113+).
HDRI skybox for car physics
Equirectangular environment map for reflections on car body and motion blur post-processing.
Physics challenges
Coding exercises with pre-filled Playground snippets, hints and solutions. Progress saved in localStorage.
Future
OffscreenCanvas rendering
Run Three.js WebGLRenderer in a Web Worker via OffscreenCanvas for zero main thread jank.
Reduced-motion static screenshots
When prefers-reduced-motion is set, show a static canvas screenshot with textual description instead of live animation.