[{"data":1,"prerenderedAt":432},["ShallowReactive",2],{"navigation":3,"/experiments/brownian-distribution":122,"authors":315},[4],{"title":5,"path":6,"stem":7,"children":8,"page":121},"Experiments","/experiments","experiments",[9,13,17,21,25,29,33,37,41,45,49,53,57,61,65,69,73,77,81,85,89,93,97,101,105,109,113,117],{"title":10,"path":11,"stem":12},"Array of cameras","/experiments/array-cameras","experiments/array-cameras",{"title":14,"path":15,"stem":16},"Brickelangelo David","/experiments/brickelangelo-david","experiments/brickelangelo-david",{"title":18,"path":19,"stem":20},"Basic Brownian distribution","/experiments/brownian-distribution","experiments/brownian-distribution",{"title":22,"path":23,"stem":24},"Porsche 911 Car Showcase","/experiments/car-showcase","experiments/car-showcase",{"title":26,"path":27,"stem":28},"Coffee Smoke","/experiments/coffee-smoke","experiments/coffee-smoke",{"title":30,"path":31,"stem":32},"Cube Boy Dancefloor","/experiments/cube-boy-dancefloor","experiments/cube-boy-dancefloor",{"title":34,"path":35,"stem":36},"Cult of the lamb 🐑","/experiments/cult-of-the-lamb","experiments/cult-of-the-lamb",{"title":38,"path":39,"stem":40},"Dancing blob","/experiments/dancing-blob","experiments/dancing-blob",{"title":42,"path":43,"stem":44},"Fireworks Shader","/experiments/fireworks-shader","experiments/fireworks-shader",{"title":46,"path":47,"stem":48},"Galaxy Generator 🪐","/experiments/galaxy-generator","experiments/galaxy-generator",{"title":50,"path":51,"stem":52},"Glass/Plastic Material","/experiments/glass-material","experiments/glass-material",{"title":54,"path":55,"stem":56},"Grainy Liquid Blobs","/experiments/grainy-liquid","experiments/grainy-liquid",{"title":58,"path":59,"stem":60},"Haunted House","/experiments/haunted-house","experiments/haunted-house",{"title":62,"path":63,"stem":64},"Phone with HTML inside","/experiments/html-phone","experiments/html-phone",{"title":66,"path":67,"stem":68},"Low Poly Planet","/experiments/lowpoly-planet","experiments/lowpoly-planet",{"title":70,"path":71,"stem":72},"Magical Marbles","/experiments/magical-marbles","experiments/magical-marbles",{"title":74,"path":75,"stem":76},"Nuxt Stones","/experiments/nuxt-stones","experiments/nuxt-stones",{"title":78,"path":79,"stem":80},"Particle Pumpkin Shader","/experiments/particle-pumpkin","experiments/particle-pumpkin",{"title":82,"path":83,"stem":84},"Particles Morphing","/experiments/particles-morphing","experiments/particles-morphing",{"title":86,"path":87,"stem":88},"Portal Journey","/experiments/portal-journey","experiments/portal-journey",{"title":90,"path":91,"stem":92},"Wizard's Potion Classroom","/experiments/potions-classroom","experiments/potions-classroom",{"title":94,"path":95,"stem":96},"Repulsion Effect","/experiments/repulsion-effect","experiments/repulsion-effect",{"title":98,"path":99,"stem":100},"Shadertoy Museum","/experiments/shadertoy-museum","experiments/shadertoy-museum",{"title":102,"path":103,"stem":104},"Space Game","/experiments/space-game","experiments/space-game",{"title":106,"path":107,"stem":108},"Halloween Spooky-saur 🎃","/experiments/spooky-saur","experiments/spooky-saur",{"title":110,"path":111,"stem":112},"Synthwave Landscape","/experiments/synthwave-landscape","experiments/synthwave-landscape",{"title":114,"path":115,"stem":116},"Texture Particle Cursor","/experiments/texture-particle-cursor","experiments/texture-particle-cursor",{"title":118,"path":119,"stem":120},"WebGPU","/experiments/webgpu","experiments/webgpu",false,{"id":123,"title":18,"author":124,"body":127,"date":306,"description":307,"extension":308,"featured":309,"lastUpdated":306,"meta":310,"navigation":309,"path":19,"seo":311,"stem":20,"tags":312,"thumbnail":313,"__hash__":314},"experiments/experiments/brownian-distribution.md",[125,126],"andretchen0","alvarosabu",{"type":128,"value":129,"toc":297},"minimark",[130,147,152,159,187,191,194,214,218,221,264,268,294],[131,132,133,134,138,139,146],"p",{},"This experiment demonstrates ",[135,136,137],"strong",{},"spatial object distribution"," using a random walk algorithm inspired by ",[140,141,145],"a",{"href":142,"rel":143},"https://en.wikipedia.org/wiki/Brownian_motion",[144],"nofollow","Brownian motion principles",". Rather than animating particles in motion, this visualization shows how objects can be positioned in 3D space using statistical patterns derived from random walk algorithms.",[148,149,151],"h3",{"id":150},"what-youll-see","What You'll See",[131,153,154,155,158],{},"The scene features ",[135,156,157],{},"2000 geometric objects"," (spheres, cubes, and pyramids) distributed throughout 3D space following a Brownian distribution pattern. Each object:",[160,161,162,169,175,181],"ul",{},[163,164,165,168],"li",{},[135,166,167],{},"Is positioned"," using a random walk algorithm that simulates particle displacement patterns",[163,170,171,174],{},[135,172,173],{},"Changes color on hover"," from the theme color to bright yellow",[163,176,177,180],{},[135,178,179],{},"Resets position"," when moving outside the boundary constraints",[163,182,183,186],{},[135,184,185],{},"Adapts to dark/light mode"," with appropriate color schemes",[148,188,190],{"id":189},"central-animation","Central Animation",[131,192,193],{},"At the center of the chaos, three geometric shapes (pyramid, cube, sphere) perform a synchronized dance:",[160,195,196,202,208],{},[163,197,198,201],{},[135,199,200],{},"Vertical oscillation"," using trigonometric functions",[163,203,204,207],{},[135,205,206],{},"Dynamic scaling"," that pulses with the animation",[163,209,210,213],{},[135,211,212],{},"Phase-shifted timing"," creating a wave-like effect",[148,215,217],{"id":216},"technical-implementation","Technical Implementation",[131,219,220],{},"The experiment showcases several advanced TresJS concepts:",[160,222,223,233,239,245,255],{},[163,224,225,228,229],{},[135,226,227],{},"Instanced Rendering",": Efficiently renders 2000 objects using ",[230,231,232],"code",{},"TresInstancedMesh",[163,234,235,238],{},[135,236,237],{},"Random Walk Distribution",": Implements spatial distribution using random walk patterns with boundary constraints",[163,240,241,244],{},[135,242,243],{},"Interactive Materials",": Hover effects using pointer events",[163,246,247,250,251,254],{},[135,248,249],{},"Loop Integration",": Smooth animations using ",[230,252,253],{},"useLoop"," composable",[163,256,257,260,261],{},[135,258,259],{},"Dark Mode Support",": Reactive color schemes using ",[230,262,263],{},"useDark",[148,265,267],{"id":266},"key-features","Key Features",[160,269,270,276,282,288],{},[163,271,272,275],{},[135,273,274],{},"Performance Optimized",": Uses Three.js instancing for smooth 60fps rendering",[163,277,278,281],{},[135,279,280],{},"Interactive",": Hover over any particle to see it highlight",[163,283,284,287],{},[135,285,286],{},"Responsive",": Adapts to different screen sizes and themes",[163,289,290,293],{},[135,291,292],{},"Statistically Accurate",": Implements random walk distribution patterns based on Brownian motion statistics",[131,295,296],{},"This visualization serves as both an educational tool for understanding random distributions and a performance benchmark for TresJS's capability to handle large numbers of interactive objects.",{"title":298,"searchDepth":299,"depth":299,"links":300},"",2,[301,303,304,305],{"id":150,"depth":302,"text":151},3,{"id":189,"depth":302,"text":190},{"id":216,"depth":302,"text":217},{"id":266,"depth":302,"text":267},"2025-01-01","Basic scene with grouping/parenting and Brownian distribution of instances","md",true,{},{"title":18,"description":307},[253],"/experiments/brownian-distribution.png","52gQw8ybdvNH-BDgOTQB8pVpx70MCEBOzOFXOOTjA_g",[316,332,346,363,379,397,414],{"id":317,"title":318,"avatar":319,"body":320,"description":298,"email":324,"extension":308,"github":126,"meta":325,"name":326,"navigation":309,"path":327,"seo":328,"slug":126,"stem":329,"twitter":126,"website":330,"__hash__":331},"authors/authors/alvarosabu.md","Alvarosabu","/avatars/alvarosabu.jpg",{"type":128,"value":321,"toc":322},[],{"title":298,"searchDepth":299,"depth":299,"links":323},[],"hola@alvarosaburido.dev",{},"Alvaro Saburido","/authors/alvarosabu",{"description":298},"authors/alvarosabu","https://alvarosaburido.dev","FWpr6-OcVRzMvvsjRaD8icRidgpKVLCtrKy9-l_5GZM",{"id":333,"title":334,"avatar":335,"body":336,"description":298,"email":340,"extension":308,"github":125,"meta":341,"name":125,"navigation":309,"path":342,"seo":343,"slug":125,"stem":344,"twitter":340,"website":340,"__hash__":345},"authors/authors/andretchen0.md","Andretchen0","/avatars/andretchen0.jpg",{"type":128,"value":337,"toc":338},[],{"title":298,"searchDepth":299,"depth":299,"links":339},[],null,{},"/authors/andretchen0",{"description":298},"authors/andretchen0","rztGS5YNlU7jYv1laE9f863gZy-WUFK5r3uuycyiMLY",{"id":347,"title":348,"avatar":349,"body":350,"description":298,"email":354,"extension":308,"github":355,"meta":356,"name":357,"navigation":309,"path":358,"seo":359,"slug":355,"stem":360,"twitter":361,"website":340,"__hash__":362},"authors/authors/damienmontastier.md","Damienmontastier","/avatars/damienmontastier.jpg",{"type":128,"value":351,"toc":352},[],{"title":298,"searchDepth":299,"depth":299,"links":353},[],"montastier.damien@gmail.com","damienmontastier",{},"Damien Montastier","/authors/damienmontastier",{"description":298},"authors/damienmontastier","dammontastier","FqtKh6r8pBEM29DE6GhT098-LIpM3BL7RXSxFjrcwwY",{"id":364,"title":365,"avatar":366,"body":367,"description":298,"email":340,"extension":308,"github":371,"meta":372,"name":373,"navigation":309,"path":374,"seo":375,"slug":371,"stem":376,"twitter":377,"website":340,"__hash__":378},"authors/authors/franciscohermida.md","Franciscohermida","/avatars/franciscohermida.jpg",{"type":128,"value":368,"toc":369},[],{"title":298,"searchDepth":299,"depth":299,"links":370},[],"franciscohermida",{},"Francisco Hermida","/authors/franciscohermida",{"description":298},"authors/franciscohermida","chicohermida","2dGmaA2uS0w2CaErMR8BexRzx0pCgoEowV5tZcITkus",{"id":380,"title":381,"avatar":382,"body":383,"description":298,"email":387,"extension":308,"github":388,"meta":389,"name":381,"navigation":309,"path":390,"seo":391,"slug":392,"stem":393,"twitter":394,"website":395,"__hash__":396},"authors/authors/jaime-torrealba.md","Jaime Torrealba","/avatars/jaime-torrealba.jpg",{"type":128,"value":384,"toc":385},[],{"title":298,"searchDepth":299,"depth":299,"links":386},[],"solucionesinformaticasjtc@gmail.com","JaimeTorrealba",{},"/authors/jaime-torrealba",{"description":298},"jaime-bboyjt","authors/jaime-torrealba","jaimebboyjt","https://jaimetorrealba.com/","WhkdXnej1NkT__thyZfYEil3qYn8wi7qVoQSMzyfrs4",{"id":398,"title":399,"avatar":400,"body":401,"description":298,"email":405,"extension":308,"github":406,"meta":407,"name":408,"navigation":309,"path":409,"seo":410,"slug":408,"stem":411,"twitter":405,"website":412,"__hash__":413},"authors/authors/luckystriike.md","Luckystriike","/avatars/luckystriike.jpg",{"type":128,"value":402,"toc":403},[],{"title":298,"searchDepth":299,"depth":299,"links":404},[],"none","luckystriike22",{},"luckystriike","/authors/luckystriike",{"description":298},"authors/luckystriike","https://github.com/luckystriike22","vmVaU8HAY_jbVnlvpUQiwh3uPcKxGGr6B5PF9xo17X8",{"id":415,"title":416,"avatar":417,"body":418,"description":298,"email":422,"extension":308,"github":423,"meta":424,"name":425,"navigation":309,"path":426,"seo":427,"slug":423,"stem":428,"twitter":429,"website":430,"__hash__":431},"authors/authors/neoprint3d.md","Neoprint3d","/avatars/neoprint3d.jpg",{"type":128,"value":419,"toc":420},[],{"title":298,"searchDepth":299,"depth":299,"links":421},[],"drew@neoprint3d.dev","neoprint3d",{},"Drew Ronsman","/authors/neoprint3d",{"description":298},"authors/neoprint3d","drew_ronsman","https://dronsman.com","w-8rauWEJDRmX_QOi4s2PI7n9EABybGURQ-R_ss9tzo",1768600262097]