Exécutez n'importe quel Skill dans Manus
en un clic

Exécutez n'importe quel Skill dans Manus en un clic

cpu-physics-3d-room

Étoiles0

Forks0

Mis à jour30 mai 2026 à 17:48

Build a mathwave room that runs CPU physics/simulation each frame and renders real Three.js 3D geometry — N-body, boids, cloth (Verlet), spiking neural nets, Kohonen SOM, L-systems, RL cartpole, double pendulum. PerspectiveCamera + OrbitControls. Template — src/nbody.js.

Installation

Installer avec Codex ou Claude Copiez ce prompt, collez-le dans Codex, Claude ou un autre assistant, puis laissez-le vérifier la page du skill et l'installer pour vous.

Exécuter dans Manus

Source

vanities

vanities/mathwave

Ouvrir le dépôt GitHub Voir les dépôts du créateur

Téléchargement

Exécuter dans Manus

Métiers associésSOC

Basé sur la classification professionnelle SOC

Développeurs de logicielsProfessions informatiques et mathématiques·SOC 15-1252

SKILL.md

readonly

name	cpu-physics-3d-room
description	Build a mathwave room that runs CPU physics/simulation each frame and renders real Three.js 3D geometry — N-body, boids, cloth (Verlet), spiking neural nets, Kohonen SOM, L-systems, RL cartpole, double pendulum. PerspectiveCamera + OrbitControls. Template — src/nbody.js.

CPU-physics 3D room

Canonical template: src/nbody.js. Working siblings: boids.js, cloth.js, spiking.js, som.js, lsystem.js, rl.js, pendulum.js.

Shape

A real 3D scene with a perspective camera you can orbit:

const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(55, innerWidth/innerHeight, 0.1, 2000);
const controls = new OrbitControls(camera, canvas);   // from three/addons
controls.enableDamping = true;
controls.autoRotate = !reducedMotion;
// lights so form reads; addGrid(scene, {...}) for a ground plane

Each frame: (1) advance the simulation on the CPU, (2) push results into geometry, (3) controls.update() + render.

Updating geometry cheaply

Allocate the geometry once; mutate its buffers in place — never rebuild per frame:

Points / lines (particles, neurons, SOM sheet, L-system segments): write into geometry.attributes.position.array and set .needsUpdate = true. For per-element color, use a color BufferAttribute (+ vertexColors: true).
InstancedMesh (N spheres/cubes — boids, spiking neurons): setMatrixAt(i, m) with a shared dummy Object3D (dummy.position.set(...); dummy.updateMatrix()), then instanceMatrix.needsUpdate = true. Per-instance color via setColorAt + instanceColor.needsUpdate. Set frustumCulled = false if instances spread beyond the base geometry's bounding sphere.
Deforming mesh (cloth): rewrite the position attribute, then geometry.computeVertexNormals() so lighting follows the folds; render DoubleSide.

Footguns

THREE.Object3D.position / .scale / .quaternion are read-only references — use .set() / .copy(), never obj.position = v.
Integrate with a small fixed dt (clamp dt ≤ 1/30); sub-step stiff systems (Izhikevich neurons, cloth constraints) to avoid blow-up.
Cap work per frame (particle/synapse/constraint counts, iterations) so the tab holds 60fps.
No temporal-dead-zone: don't reference a const/let inside a bindRange callback that runs (synchronously, on bind) before the declaration.

Learning/agent rooms

For "it learns in front of you" (RL), run many fast training steps headless in the background and render the current best policy at real-time speed — don't render every training rollout. (CartPole: Cross-Entropy Method over a linear policy is stable and solves in seconds.)

Wire-up

setVariantCycler for ↑/↓ presets (topology, target distribution, species). window.__err handler + window.__diag. onResize(renderer, camera). Then verify-on-screen.

Plus depuis ce dépôt

même dépôt

gpu-pingpong-sim-room

vanities/mathwave

Build a mathwave room that is a GPU field simulation on swapped float render targets (ping-pong) — reaction-diffusion, wave/ripple equations, Schrödinger wavefunctions, Lattice-Boltzmann fluids, Lenia/neural cellular automata, Physarum. Template — src/reaction.js.

2026-05-300

grid-cells-room

vanities/mathwave

Build a mathwave room that simulates a CPU integer/cell grid and displays it via a DataTexture + fullscreen display shader — Wolfram CA, Abelian sandpile, Hopfield network, Conway-style automata. Template — src/wolfram.js (+ the fullscreen-quad display pattern from src/fractal.js).

2026-05-300

mathwave-overview

vanities/mathwave

Conventions for adding a room to the mathwave Three.js gallery — file layout, the buildless ES-module/import-map setup, kiosk navigation, the shared common.js engine, and the ROOMS registry. Use this first whenever creating or modifying any mathwave room.

2026-05-300

ps1-pipeline

vanities/mathwave

Apply the PlayStation-1 rendering aesthetic to a mathwave room — low-res framebuffer + nearest upscale + 4x4 Bayer ordered dither + 15-bit color crunch, plus optional vertex snapping. Reusable module src/ps1.js. Best on rooms with real 3D FORM (fractals), not abstract data clouds.

2026-05-300

raymarched-shader-room

vanities/mathwave

Build a mathwave room that is a GPU fragment-shader raymarcher/SDF — fractals (mandelbulb, mandelbox, menger, quaternion Julia), volumetrics (nebula), Truchet/metaballs. Single fullscreen quad, all geometry in the fragment shader, custom uCamPos orbit. Template — src/fractal.js.

2026-05-300

verify-on-screen

vanities/mathwave

The verification discipline for mathwave rooms — how to confirm a room ACTUALLY renders before claiming it works, using agent-browser plus window.__err / window.__diag canaries. Critically, node --check and a green fps reading are NOT sufficient. Use before committing any room.

2026-05-300

name	cpu-physics-3d-room
description	Build a mathwave room that runs CPU physics/simulation each frame and renders real Three.js 3D geometry — N-body, boids, cloth (Verlet), spiking neural nets, Kohonen SOM, L-systems, RL cartpole, double pendulum. PerspectiveCamera + OrbitControls. Template — src/nbody.js.

CPU-physics 3D room

Canonical template: src/nbody.js. Working siblings: boids.js, cloth.js, spiking.js, som.js, lsystem.js, rl.js, pendulum.js.

Shape

A real 3D scene with a perspective camera you can orbit:

const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(55, innerWidth/innerHeight, 0.1, 2000);
const controls = new OrbitControls(camera, canvas);   // from three/addons
controls.enableDamping = true;
controls.autoRotate = !reducedMotion;
// lights so form reads; addGrid(scene, {...}) for a ground plane

Each frame: (1) advance the simulation on the CPU, (2) push results into geometry, (3) controls.update() + render.

Updating geometry cheaply

Allocate the geometry once; mutate its buffers in place — never rebuild per frame:

Points / lines (particles, neurons, SOM sheet, L-system segments): write into geometry.attributes.position.array and set .needsUpdate = true. For per-element color, use a color BufferAttribute (+ vertexColors: true).
InstancedMesh (N spheres/cubes — boids, spiking neurons): setMatrixAt(i, m) with a shared dummy Object3D (dummy.position.set(...); dummy.updateMatrix()), then instanceMatrix.needsUpdate = true. Per-instance color via setColorAt + instanceColor.needsUpdate. Set frustumCulled = false if instances spread beyond the base geometry's bounding sphere.
Deforming mesh (cloth): rewrite the position attribute, then geometry.computeVertexNormals() so lighting follows the folds; render DoubleSide.

Footguns

THREE.Object3D.position / .scale / .quaternion are read-only references — use .set() / .copy(), never obj.position = v.
Integrate with a small fixed dt (clamp dt ≤ 1/30); sub-step stiff systems (Izhikevich neurons, cloth constraints) to avoid blow-up.
Cap work per frame (particle/synapse/constraint counts, iterations) so the tab holds 60fps.
No temporal-dead-zone: don't reference a const/let inside a bindRange callback that runs (synchronously, on bind) before the declaration.

Learning/agent rooms

Wire-up

setVariantCycler for ↑/↓ presets (topology, target distribution, species). window.__err handler + window.__diag. onResize(renderer, camera). Then verify-on-screen.