{"id":"multiple-window-3d-scene","name":"multipleWindow3dScene","url":"https://wunderlust.xyz/r/multiple-window-3d-scene","category":"three","category_label":"3D & WebGL","tags":["open-source","free","webgl"],"short":"A three.js scene synced across several browser windows with only localStorage","what":"A demo by Bjørn Staal in which a WindowManager stores each window's position and size in localStorage, and each window draws its part of the same 3D scene. To use it, clone the repo and open index.html; the project bundles a three.js r124 build.","uses":"For someone making interactive art with Three.js who wants a scene that spans several windows, like two windows showing parts of the same field.","benefits":["Only localStorage and static files, no server","WindowManager.js creates, syncs and removes windows","Three files: index.html, main.js and WindowManager.js"],"caveats":["The license is MIT; the bundled three.js build is r124, which is old."],"links":{"official":"https://github.com/bgstaal/multipleWindow3dScene"},"image":"https://wunderlust.xyz/media/multiple-window-3d-scene-poster.jpg","video":"https://wunderlust.xyz/media/multiple-window-3d-scene.webm","share_image":"https://wunderlust.xyz/og/r/multiple-window-3d-scene.jpg","similar":["three-js","react-three-fiber","react-postprocessing","react-three-rapier","liquid-logo","liquid-glass-js"],"added_on":"2026-11-12","steal":"Use localStorage as a bus of window positions and sizes to split one scene across them","patterns":[],"why":"Each window draws its own slice of one shared scene from its position alone, so dragging a window feels like moving a camera across one world.","avoid":"Treat it as a desktop showpiece. Phones and tablets cannot tile browser windows, so give them a single-window version.","pt":{"name":"multipleWindow3dScene","short":"Cena three.js sincronizada entre várias janelas do navegador, só com localStorage","steal":"Use o localStorage como barramento com posição e tamanho das janelas para dividir uma cena entre elas","what":"Demo de Bjørn Staal em que um WindowManager guarda a posição e o tamanho de cada janela no localStorage, e cada janela desenha sua parte da mesma cena 3D. Para usar, clone o repositório e abra o index.html; o projeto traz um build do three.js r124.","uses":"Para quem faz arte interativa com Three.js e quer uma cena que atravessa várias janelas, como duas janelas mostrando partes do mesmo campo.","benefits":["Só localStorage e arquivos estáticos, sem servidor","WindowManager.js cria, sincroniza e remove janelas","Três arquivos: index.html, main.js e WindowManager.js"],"caveats":["A licença é MIT; o build do three.js incluído é o r124, antigo."],"why":"Cada janela desenha a sua fatia de uma cena compartilhada só pela posição, e arrastar uma janela parece mover uma câmera por um mundo só.","avoid":"Trate como vitrine para desktop. Celulares e tablets não organizam janelas do navegador lado a lado, então ofereça uma versão de janela única."},"schema_version":1}
