la-watch/source/scripts/assets/space-scene.js

export class space_scene {
    #renderer;
    #canvas;
    #camera;
    #scene;
    #working;
    #framerate;

    constructor(canvas, context) {
        this.#framerate = 30;
        this.#canvas = canvas;
        this.#renderer = new THREE.WebGLRenderer({canvas, context: context});
        this.#camera = new THREE.PerspectiveCamera(75, 1);
        this.#scene = new THREE.Scene();
        
        this.update_size();
    }

    update_size(width, height) {
        this.#canvas.width = width;
        this.#canvas.height = height;
        this.#camera.aspect = width / height;

        this.#camera.updateProjectionMatrix();
        this.#renderer.setSize(width, height);
    }

    get scene() {
        return this.#scene;
    }

    start() {
        this.#working = true;

        setTimeout(() => { this.#rendering(); }, 1);
    }

    stop() {
        this.#working = false;
    }

    #rendering() {
        const before = performance.now();

        this.#renderer.render(this.#scene, this.#camera);
        
        if (!this.#working) {
            return;
        }

        const after = performance.now();
        const delta = after - before;
        const next = 1000 / 30 - ((delta >= 0) ? delta : 0);

        setTimeout(() => {
            requestAnimationFrame(() => { this.#rendering(); });
        }, (next > 0) ? next : 1);
    }
}