I. The Afternoon the Browser Crashed

Last year, a Bim technical consulting company took on a web visualization project for the construction industry. The requirements sounded straightforward enough: display a client-provided Revit model in the browser, with support for walkthrough navigation, component click-through, and property inspection.

The project team thought it would be simple. Install three.js, find a tool to convert .rvt to .Glb, load it with GLTFLoader, done.

Then the client sent over the model files.

The compressed archive was 12GB.

After extraction, a single main model file alone was 8.7GB. The team bit the bullet and used a conventional tool to convert it to glTF — the conversion ran for 40 minutes and produced a 6GB .glb file. They dropped it into their Three.js project and—

The browser went straight to a white screen.

The console had one line: Out of memory.

To be honest, the team was stunned. It wasn't slow performance, it wasn't low frame rates — it didn't run at all.

II. The Rescue Attempts (And Why They All Failed)

Over the next two weeks, the team tore through every technical forum they could find.

Attempt 1: Draco Compression

They compressed the glTF with Draco and then loaded it. The file shrank from 6GB to 1.8GB — this looked promising.

But the JS main thread parsing still took over 90 seconds, during which the page was completely frozen. Users would have to wait a minute and a half after opening the webpage. Nobody could accept that.

Attempt 2: Manual LOD

They tried manually creating three precision-level versions of the model in Blender and wrote their own code to switch based on camera distance. It did improve things somewhat — but manually creating three versions of a single model took the better part of a day. The client had more than one model, so this approach was far too inefficient. Moreover, Blender itself struggled with ultra-large models and would crash without warning.

Attempt 3: Cloud Conversion

They tried a commercial cloud platform. Uploading the model took two hours, and after conversion and downloading it back — most of the component property data was gone. Users wanted to click on a wall to see material information, but all they got was a bare Mesh object. The requirements simply weren't met.

After nearly a month of struggling, the BIM consulting company reached a hard-to-swallow conclusion:

There's nothing wrong with Three.js itself. The problem is that it's facing industrial-grade 3D/BIM data, not game assets. These are two completely different worlds.

Unable to solve the problem with their own team, the BIM consulting company turned to 3D Expert Co.,Ltd.

III. 3D Expert's Technical Foundation

3D Expert Co.,Ltd., headquartered in Osaka, Japan, has accumulated years of expertise in the field of large-scale 3D/BIM model and data lightweight processing. This was no hastily assembled solution — the team has long been deeply engaged in the core aspects of industrial-grade 3D data parsing, lightweight processing, and high-performance web rendering, with an intimate understanding of the internal structures of mainstream industrial formats including Revit, IFC, SolidWorks, and Bentley.

Upon receiving the BIM consulting company's request for help, the 3D Expert team quickly identified the problem. During their analysis, they broke down the bottlenecks Three.js faces with large models into four layers:

This wasn't something a patch on top of Three.js could fix — it required structural changes from the rendering pipeline's foundation. And that was precisely the domain where the 3D Expert team's years of expertise lay.

IV. Comparison of Available Solutions

The 3D Expert team reviewed every solution they could find:

Cloud solutions have an unavoidable hurdle: data must be uploaded. For clients in the construction industry — who are extremely sensitive about data security — this was essentially a deal-breaker. Furthermore, the converted formats were black boxes, leaving front-end developers with no way to customize.

Drawing on years of technical accumulation, the 3D Expert team provided their own answer: rapid3D Loader for three.js.

V. How rapid3D Loader for three.js Solves These Problems

rapid3D Loader for three.js is not a wrapper around Three.js, nor is it a simple format conversion tool. It is a complete pipeline from model conversion to front-end rendering.

Architecture: Producer-Consumer

┌─────────────────────────────┐       ┌──────────────────────────────────┐  │  Opt file Generator (Producer)│ ────► │  rapid3D Loader JS Package        │  │                             │       │       (Consumer)                  │  │  · Runs locally, no cloud    │       │  · Published as npm package       │  │    uploads                  │       │  · Embeds into Three.js projects    │  │  · Native parsing of 20+     │       │  · Multi-Worker parallel loading   │  │    formats                  │       │  · Multi-level dynamic LOD loading │  │  · Generates .opt geometry   │       │  · Chunk rendering + instanced      │  │    files                    │       │    rendering                       │  │  · Generates .db property    │       │  · Open API interface              │  │    databases                │       │                                    │  │  · Windows version available │       │                                    │  │    for download              │       │                                    │  └─────────────────────────────┘       └──────────────────────────────────┘  

Core advantages of this architecture:

• Conversion happens locally on the user's machine — core data never leaves the client's computer, passing security and compliance requirements immediately.
• The front-end receives pre-optimized .opt format files, eliminating the need for heavy re-parsing in the browser.
• Geometric data and property data are stored separately — .opt handles rendering, .db handles business data queries, each loading on demand without dragging the other down.

Four Core Technologies That Make Performance Soar

1. Multi-Worker Queue Loading

// Native Three.js loading large files: single-threaded, frozen when it's frozen  const loader = new GLTFLoader();  loader.load('model.glb', (gltf) => {      // This step can take 90 seconds, during which the page is completely unresponsive      scene.add(gltf.scene);  });    // rapid3D Loader: multi-Worker parallel processing under the hood  // The API is equally simple, but Worker threads are automatically assigned internally  rapidLoader.load('model.opt', {      onProgress: (percent) => console.log(`${percent}%`) // Progress feedback available  });  

Large file parsing is split into parallel tasks, fully leveraging multi-core CPUs. No need for developers to manually manage Worker threads.

2. Multi-Level Dynamic LOD Loading

This is the core technology behind rapid3D Loader's sub-second loading capability. Instead of loading the entire model into memory at once, it dynamically loads model data at different precision levels based on camera viewpoint and distance. What the user sees is what gets loaded; what's not visible doesn't consume resources.

This means that even when facing an 8.7GB Revit model, users don't need to wait for the entire file to load — the data required for the initial screen presentation is minimal, keeping load times under 10 seconds. From a campus-wide bird's-eye view to a close-up of a single screw, the LOD tiered loading system dynamically schedules model resources at different precision levels based on camera distance, screen footprint, and motion speed, maintaining stable frame rates throughout.

3. Chunk Rendering + Instanced Rendering

Many components in large models are repetitive — for example, an office building might have 200 identical windows. The traditional approach assigns one Draw Call per window, resulting in 200 calls. Chunk rendering splits the scene graph into manageable render units, and combined with GPU instanced rendering, the same 200 windows require only a handful of Draw Calls.

4. Frustum Culling + Dynamic Culling + Cached Drawing

Triple culling ensures the GPU doesn't waste resources rendering things outside the field of view. Combined with non-real-time rendering and cached drawing, performance is pushed to its limits.

Data Integrity: What Impresses BIM Clients Most

After most format conversion solutions are done, the model becomes a collection of "hollow meshes." You click on a component and the program doesn't even know what it is — a wall? A column? A pipe? All lost.

rapid3D Loader is different. Through dedicated export plugins (one each for Revit, Bentley, Tekla, Rhino, Navisworks, SolidWorks, Inventor, Siemens NX, and PTC Creo), it preserves component IDs, hierarchical relationships, material parameters, and professional properties alongside geometric data extraction, storing them in DB files with publicly documented table structures.

This enables you to do things like this:

// Pick a component  const mesh = pickMesh(event);  const componentId = mesh.userData.componentId;    // Query complete properties from the DB file  const properties = await dbLoader.getComponentProperties(componentId);  console.log(properties);  // {  //   id: 'wall-001',  //   type: 'Structural Wall',  //   material: 'C30 Concrete',  //   thickness: 200,  // mm  //   level: 'F2',  //   ...  // }  

This is critical for BIM applications — users can click on a column and see complete component information.

The range of supported formats is comprehensive: Revit, SolidWorks, Bentley, Tekla, IFC, FBX, STEP, 3DXML, skp, dae, stp, stl, iges, rvm, vue, obj — covering all mainstream industrial 3D formats.

VI. Integration Is Actually Simple

The entire process is just three steps:

Step 1: Download Opt file Generator

Install Opt file Generator (model format conversion tool) on Windows, select your model file, and choose .opt as the export format. Everything is done locally — nothing is uploaded.

Download at: https://www.opt3ds.com/ or https://www.3dexpert.jp/

Step 2: Install the npm package

npm install opt-rapid3d-loader  

npm package: https://www.npmjs.com/package/opt-rapid3d-loader

Step 3: Write a few lines of code

import { RapidLoader } from 'opt-rapid3d-loader';    const scene = new THREE.Scene();  // ... your Three.js initialization code ...    const loader = new RapidLoader();  loader.load('path/to/model.opt', {      onProgress: (p) => updateLoadingBar(p),      onComplete: (model) => {          scene.add(model);          // Every Mesh in the model is a standard Three.js Mesh          // Your existing interaction logic, shaders, business code — no changes needed      }  });  

The Loader produces standard Three.js Mesh objects, meaning everything you've previously written is fully compatible. No need to start over.

VII. Real-World Performance Data

Tests conducted on the same machine (i7-12700 / 32GB RAM / RTX 3060 / Chrome 120):

The native solution used GLTFLoader + Draco compression. The 8.7GB model caused an out-of-memory error — it didn't even start.

Thanks to multi-level dynamic LOD loading technology, rapid3D Loader doesn't need to wait for the entire model to load before rendering the initial screen. Both the 8.7GB Revit model and the 1.2GB IFC model load in under 10 seconds. Compared to native Three.js, model loading speed improves by 3x or more, and large model rendering frame rate improves by 10x or more. Draw Calls dropped from 12,000 to 380 — visually indistinguishable, but the frame rate stability speaks for itself.

The problem that the BIM consulting company couldn't solve was effortlessly resolved with rapid3D Loader.

VIII. Use Cases

If your project meets any of these criteria, it's worth spending half an hour to try a demo:

• Need to load professional 3D/BIM model formats such as Revit / SolidWorks / IFC
• Single model file exceeds 500MB
• Client has data security requirements (cannot upload to the cloud)
• Need component-level interaction (click to query properties, color annotation, show/hide, etc.)
• Don't want to be locked into a black-box solution and need to continue developing based on Three.js

Applicable Industries: Shipbuilding/Marine Engineering, Aerospace, Energy & Power, Petrochemical, Advanced Manufacturing, Smart Cities, Architectural Design — essentially any web visualization project using professional 3D models.

IX. About 3D Expert Co.,Ltd.

3D Expert Co.,Ltd. is headquartered in Osaka, Japan, with years of accumulated expertise in professional large-scale 3D/BIM model and data lightweight processing. The company is dedicated to bridging the technical gap between general-purpose 3D rendering engines and industrial-grade data, providing clients with a complete pipeline from model format conversion to high-performance web rendering.

rapid3D Loader for three.js is the 3D Expert team's core product — format conversion, lightweight processing, high-performance rendering, and data interaction, all in one integrated pipeline. And since the output is standard Three.js Mesh objects, you're never locked into any proprietary ecosystem.

How to Get Started

Additionally, sample demos and source code are provided for basic API usage, model data extraction, and extended development based on Three.js Mesh objects.

After downloading Opt file Generator, select .opt as the export format, and the rapid3D Loader JS package can load and render it directly.

X. Conclusion

Three.js is a great tool, but it's positioned as a general-purpose 3D rendering engine, not an industrial-grade BIM solution. When facing real industrial data, there's an entire layer of missing technology that needs to be filled — and that's exactly what the 3D Expert team has been working on for years.

rapid3D Loader for three.js fills that gap. The biggest takeaway after using it: you finally stop fighting with large models. Focus on writing business logic, focus on building interactions.

If you're also working on web 3D visualization, we'd love to hear from you. Share your experiences, the pitfalls you've hit, the solutions you've tried — let's talk.

3D Expert Co.,Ltd. 📍 Osaka, Japan 🌐 https://www.opt3ds.com/ | https://www.3dexpert.jp/ 📦 npm: https://www.npmjs.com/package/opt-rapid3d-loader

© 2010–2026 3D Expert Co.,Ltd. All rights reserved.