JSPM

Fast · Lightweight · Columnar · Browser-native

Features · Quick Start · Documentation · Architecture · Performance · Contributing

Overview

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

~650 KB WASM (~260 KB gzipped)  •  2.6x faster  •  100% IFC4X3 schema (876 entities)

Features

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_LFS_SKIP_SMUDGE=1 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.

Git LFS: Large benchmark fixtures are intentionally not downloaded during clone. Pull only the files you need, for example git lfs pull --include="tests/models/ara3d/AC20-FZK-Haus.ifc".

📖 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

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

Parse Performance

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

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

Development (Contributors)

For contributing to IFClite itself:

GIT_LFS_SKIP_SMUDGE=1 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

Rust Crates

Community Projects

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

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

Contributing

We welcome contributions!

# Fork and clone
GIT_LFS_SKIP_SMUDGE=1 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

Made with ❤️ for the AEC industry