A Billion 3D Splats Rendering in Your Browser (Open Source)
In this guide, you'll discover how HoloViewer – a new open‑source web viewer – can render up to 1 billion 3D points in your browser without requiring a powerful GPU or downloads. We'll cover the core technology, the LOD streaming system, the CLI transform tools that prepare splats for real‑time viewing, and the growing ecosystem that makes 3D Gaussian Splatting (3DGS) accessible for real estate, games, and more.
What You'll Learn
Prerequisites
- A modern web browser (Chrome, Firefox, Edge, or Safari) – the viewer runs entirely in the browser tab
- No expensive graphics card needed; the demonstration ran at 120 FPS on consumer hardware
Browser Performance
The viewer uses Level‑of‑Detail (LOD) streaming and chunked loading, so even low‑end devices (including mobiles) can handle billion‑splat scenes.
Step‑by‑Step Process
Step 1: Understand 3DGS Splats and How HoloViewer Achieves Massive Scale
3D Gaussian Splatting (3DGS) represents environments as millions of tiny dots (splats), each encoding shape, color, and location. Unlike classic 3D meshes, splats look far more realistic, but they are extremely heavy – a single scanned location can exceed 10–30 GB. Until recently, loading such datasets on consumer hardware was impossible.
HoloViewer solves this by combining Level‑of‑Detail (LOD) with streaming. The scene is split into small chunks, and only the parts of a splat that are visible in the frame and at the appropriate detail level are loaded. This approach allows rendering up to 1 billion splats in a browser tab, including on mobile phones and laptops.
The LOD Streaming System
LOD (Level of Detail) means areas farther from the camera are rendered with fewer splats. Combined with streaming, the viewer loads only what is needed at any moment, enabling massive scans to run smoothly.
Pro Tip
The viewer also includes depth filtering and a configurable budget – you can control the maximum number of splats rendered to optimize for lower‑end phones.
Step 2: Install and Run HoloViewer Locally
HoloViewer is released under the MIT license, so you can download and use it immediately. Although no specific installation commands are provided in the video, you can:
- Visit the HoloViewer GitHub repository (search "HoloViewer" – it already has nearly 500 stars in its first week).
- Follow the README instructions to clone or download the library.
- Open the viewer in your browser – either by running a local server or using the hosted demo.
- Load a splat file (supported formats include
.ply,.spz, and others). The.spzformat is the most optimized.
Sample Splat Files
The transcript mentions a berry scan by Danny Bittle (available under CC4 license) that you can download and test. The viewer loaded it at 120 FPS with extremely fast startup.
Pro Tip
For the best performance, use SPZ format splats – they are the most optimized for web streaming.
Step 3: Process Splats with the CLI Transform Tools
Before a raw scan can be streamed efficiently, you need to transform it. The splat transform tools (included with HoloViewer or available as separate utilities) allow you to:
- Convert between formats – process
ply,spz, and other common formats. - Generate LOD chunks – split the splat into small, streamable pieces with multiple detail levels.
- Create physics collision – add colliders so you can walk around the environment as if in a game.
Why Colliders Matter
The ability to add collision opens up game‑ready use cases: scanned apartments, castles, and natural scenes can now be explored with full physics interaction.
Pro Tip
Start by processing a small scan to test the pipeline. The tools are designed to be compatible with the most recent SPZ format, which already embeds optimization metadata.
Step 4: Explore Example Scenes and Interact with Colliders
Once you have the viewer running and a processed splat, you can experience the quality firsthand. The video shows several impressive examples:
- Drone‑captured outdoor scenes – stunning detail and smooth navigation.
- Berry scan – achieved over 7 million views on X, demonstrating the realism of splats.
- Castle interior – every surface captured with high fidelity.
- Apartment with collision – you can walk around and interact with the space as if inside a game.
LOD Preview
When first loading a scene, you may see a lower‑resolution version that quickly refines as chunks stream in – this is the LOD streaming system at work.
Pro Tip
Use the viewer controls to adjust the splat budget – this helps maintain high frame rates on mobiles while still showing rich detail.
Step 5: Embed HoloViewer in Your Own Website
Because HoloViewer is open source, you can embed it into any webpage. The process is straightforward:
- Include the HoloViewer library in your project (e.g., via NPM or a
<script>tag). - Create a viewer container in your HTML.
- Point the viewer to your splat files (hosted on your server or a CDN).
- Customize controls and appearance – the viewer supports configurable controls and visual styles.
Use Cases for Web Embedding
Historical landmarks, real estate walkthroughs, and scanned artifacts can now be displayed without freezing the user’s device. The LOD streaming ensures even massive scenes load quickly.
Pro Tip
If you want to generate splats from a mobile phone, the Holo app can capture objects and produce splats in minutes. Process them with the CLI tools, then embed directly.
Next Steps
Now that you understand the capabilities of HoloViewer and the 3DGS ecosystem:
- Try the berry scan (CC4 licensed) to get hands‑on experience with a high‑quality splat.
- Experiment with the splat transform tools – convert a raw scan into streamable LOD chunks and add collision.
- Consider integrating HoloViewer into a website for interactive 3D tours or game assets.
- Stay tuned for updates on Unreal Engine integration – the video mentions that game engines are adopting similar LOD/streaming approaches for splats.
You’re Ready to Explore Billion‑Splat Scenes
HoloViewer makes massive 3DGS scenes accessible to everyone – no expensive hardware required. Start by viewing the demo examples, then process your own scans to unlock the full potential of real‑time, photorealistic 3D environments in the browser.