@ifc-lite/wasm

v1.14.1

Published

2 days ago

WebAssembly bindings for IFC-Lite

0High
0Medium
0Low

louistrue

ifc bim wasm webassembly aec

Overview

IFClite parses, processes, and renders IFC files in the browser using Rust + WebAssembly and WebGPU. Smaller and faster than the alternatives.

Features

| Feature | Description | |---------|-------------| | Clean DX | Columnar data structures, TypedArrays, consistent API. Built from scratch for clarity | | STEP/IFC Parsing | Zero-copy tokenization with full IFC4X3 schema support (876 entities) | | Streaming Pipeline | Progressive geometry processing. First triangles in 300-500ms | | WebGPU Rendering | Modern GPU-accelerated 3D with depth testing and frustum culling | | Zero-Copy GPU | Direct WASM memory to GPU buffers, 60-70% less RAM |

Quick Start

Option 1: Create a New Project (Recommended)

Get started instantly without cloning the repo:

npx create-ifc-lite my-ifc-app
cd my-ifc-app
npm install && npm run parse

Or create a React viewer:

npx create-ifc-lite my-viewer --template react
cd my-viewer
npm install && npm run dev

Option 2: Install Packages Directly

Add IFClite to your existing project:

npm install @ifc-lite/parser

import { IfcParser } from '@ifc-lite/parser';

const parser = new IfcParser();
const result = parser.parse(ifcBuffer);

console.log(`Found ${result.entities.length} entities`);

For full 3D rendering, add geometry and renderer packages:

npm install @ifc-lite/parser @ifc-lite/geometry @ifc-lite/renderer

Option 3: Rust/Cargo

For Rust projects:

cargo add ifc-lite-core

use ifc_lite_core::parse_ifc;

let result = parse_ifc(&ifc_bytes)?;
println!("Parsed {} entities", result.entities.len());

Option 4: Clone the Repo (Contributors)

For contributing or running the full demo app:

git clone https://github.com/louistrue/ifc-lite.git
cd ifc-lite
pnpm install && pnpm dev

Open http://localhost:5173 and load an IFC file.

Note: Requires Node.js 18+ and pnpm 8+. No Rust toolchain needed - WASM is pre-built.
📖 Full Guide: See Installation for detailed setup options including troubleshooting.

Basic Usage

import { IfcParser } from '@ifc-lite/parser';
import { Renderer } from '@ifc-lite/renderer';

// Parse IFC file
const parser = new IfcParser();
const result = parser.parse(ifcArrayBuffer);

// Access entities
const walls = result.entities.filter(e => e.type === 'IFCWALL');
console.log(`Found ${walls.length} walls`);

// Render geometry (requires @ifc-lite/renderer)
const renderer = new Renderer(canvas);
await renderer.loadGeometry(result.geometry);
renderer.render();

Documentation

| Resource | Description | |----------|-------------| | Quick Start | Parse your first IFC file in 5 minutes | | Installation | Detailed setup for npm, Cargo, and from source | | User Guide | Complete guides: parsing, geometry, rendering, querying | | Tutorials | Build a viewer, custom queries, extend the parser | | Architecture | System design with detailed diagrams | | API Reference | TypeScript, Rust, and WASM API docs | | Contributing | Development setup and testing guide |

Architecture

flowchart LR
    IFC[IFC File] --> Tokenize
    Tokenize --> Scan --> Decode
    Decode --> Tables[Columnar Tables]
    Decode --> Graph[Relationship Graph]
    Tables --> Renderer[WebGPU Renderer]
    Graph --> Export[glTF / Parquet]
    
    style IFC fill:#6366f1,stroke:#312e81,color:#fff
    style Tokenize fill:#2563eb,stroke:#1e3a8a,color:#fff
    style Scan fill:#2563eb,stroke:#1e3a8a,color:#fff
    style Decode fill:#10b981,stroke:#064e3b,color:#fff
    style Tables fill:#f59e0b,stroke:#7c2d12,color:#fff
    style Graph fill:#f59e0b,stroke:#7c2d12,color:#fff
    style Renderer fill:#a855f7,stroke:#581c87,color:#fff
    style Export fill:#a855f7,stroke:#581c87,color:#fff

IFC files flow through three processing layers. See the Architecture Documentation for detailed diagrams including data flow, memory model, and threading.

Deep Dive: Data Flow · Parsing Pipeline · Geometry Pipeline · Rendering Pipeline

Project Structure

ifc-lite/
├── rust/                      # Rust/WASM backend
│   ├── core/                  # IFC/STEP parsing (~2,000 LOC)
│   ├── geometry/              # Geometry processing (~2,500 LOC)
│   └── wasm-bindings/         # JavaScript API (~800 LOC)
│
├── packages/                  # TypeScript packages
│   ├── parser/                # High-level IFC parser
│   ├── geometry/              # Geometry bridge (WASM)
│   ├── renderer/              # WebGPU rendering
│   ├── cache/                 # Binary cache format
│   ├── query/                 # Query system
│   ├── data/                  # Columnar data structures
│   ├── spatial/               # Spatial indexing
│   ├── export/                # Export formats
│   └── codegen/               # Schema generator
│
├── apps/
│   └── viewer/                # React web application
│
└── docs/                      # Documentation (MkDocs)

Performance

Bundle Size Comparison

| Library | WASM Size | Gzipped | |---------|-----------|---------| | IFClite | 0.65 MB | 0.26 MB | | web-ifc | 1.1 MB | 0.4 MB | | IfcOpenShell | 15 MB | - |

Parse Performance

| Model Size | IFClite | Notes | |------------|----------|-------| | 10 MB | ~100-200ms | Small models | | 50 MB | ~600-700ms | Typical models | | 100+ MB | ~1.5-2s | Complex geometry |

Based on benchmark results across 67 IFC files.

Zero-Copy GPU Pipeline

Zero-copy WASM to WebGPU: Direct memory access from WASM linear memory to GPU buffers
60-70% reduction in peak RAM usage
74% faster parse time with optimized data flow
40-50% faster geometry-to-GPU pipeline

Geometry Processing

5x faster overall than web-ifc (median 2.18x, up to 104x on some files)
Streaming pipeline with batched processing (100 meshes/batch)
First triangles visible in 300-500ms

See full benchmark data for per-file comparisons.

Browser Requirements

| Browser | Minimum Version | WebGPU | |---------|----------------|--------| | Chrome | 113+ | ✅ | | Edge | 113+ | ✅ | | Firefox | 127+ | ✅ | | Safari | 18+ | ✅ |

More Info: See Browser Requirements for WebGPU feature detection and fallbacks.

Development (Contributors)

For contributing to IFClite itself:

git clone https://github.com/louistrue/ifc-lite.git
cd ifc-lite
pnpm install

pnpm dev          # Start viewer in dev mode
pnpm build        # Build all packages
pnpm test         # Run tests

# Add a changeset when making changes
pnpm changeset    # Describe your changes (required for releases)

# Rust/WASM development (optional - WASM is pre-built)
cd rust && cargo build --release --target wasm32-unknown-unknown
bash scripts/build-wasm.sh  # Rebuild WASM after Rust changes

Packages

| Package | Description | Status | Docs | |---------|-------------|--------|------| | create-ifc-lite | Project scaffolding CLI | ✅ Stable | API | | @ifc-lite/parser | STEP tokenizer & entity extraction | ✅ Stable | API | | @ifc-lite/geometry | Geometry processing bridge | ✅ Stable | API | | @ifc-lite/renderer | WebGPU rendering pipeline | ✅ Stable | API | | @ifc-lite/cache | Binary cache for instant loading | ✅ Stable | API | | @ifc-lite/query | Fluent & SQL query system | 🚧 Beta | API | | @ifc-lite/data | Columnar data structures | ✅ Stable | API | | @ifc-lite/spatial | Spatial indexing & culling | 🚧 Beta | API | | @ifc-lite/export | Export (glTF, Parquet, etc.) | 🚧 Beta | API |

Rust Crates

| Crate | Description | Status | Docs | |-------|-------------|--------|------| | ifc-lite-core | STEP/IFC parsing | ✅ Stable | docs.rs | | ifc-lite-geometry | Mesh triangulation | ✅ Stable | docs.rs | | ifc-lite-wasm | WASM bindings | ✅ Stable | docs.rs |

Community Projects

Projects built by the community using IFClite (not officially maintained):

| Project | Author | Description | |---------|--------|-------------| | bimifc.de | @holg | Pure Rust/Bevy IFC viewer, no TypeScript needed |

Built something with IFClite? Open a PR to add it here!

Contributing

We welcome contributions!

| Resource | Description | |----------|-------------| | Development Setup | Prerequisites, installation, and project structure | | Testing Guide | Running tests, writing tests, CI | | Release Process | Versioning and publishing workflow |

# Fork and clone
git clone https://github.com/YOUR_USERNAME/ifc-lite.git

# Create a branch
git checkout -b feature/my-feature

# Make changes and test
pnpm test

# Add a changeset to describe your changes
pnpm changeset

# Submit a pull request (include the changeset file)

License

This project is licensed under the Mozilla Public License 2.0.

Acknowledgments

Built with nom for parsing
earcutr for polygon triangulation
nalgebra for linear algebra
wasm-bindgen for Rust/JS interop