Pascal Editor: Trình soạn thảo 3D kiến trúc chạy ngay trên trình duyệt, miễn phí

TL;DR

Pascal Editor là trình soạn thảo 3D kiến trúc mã nguồn mở chạy hoàn toàn trên trình duyệt - không cần cài đặt, không mất tiền bản quyền. Xây trên React Three Fiber và WebGPU, tool này cho phép bạn vẽ tường, sàn, mái, cửa sổ và nội thất trong không gian 3D ngay trong một tab Chrome.

Vấn đề quen thuộc

AutoCAD bản quyền khoảng $2,000/năm. Revit khoảng $3,500/năm. SketchUp Pro $299/năm. Và tất cả đều yêu cầu cài đặt, cấu hình máy mạnh, thậm chí tối ưu cho Windows trong nhiều workflow chuyên nghiệp.

Với kiến trúc sư tự do, sinh viên, hay developer muốn tích hợp 3D vào web app - đây là rào cản quá lớn. Pascal Editor xuất hiện đúng lúc để phá vỡ điều đó.

Pascal Editor là gì

Pascal Editor (pascalorg/editor) là trình soạn thảo 3D kiến trúc mã nguồn mở, MIT license. Bạn truy cập editor.pascal.app, không cần đăng nhập, và bắt đầu vẽ ngay.

Sau 7 tháng ra mắt, dự án đã đạt 15.2k sao GitHub, 2k forks, 23 contributors và 9 releases (mới nhất: v0.6.0). Codebase 99.3% TypeScript, đang được phát triển tích cực với commit gần nhất chỉ 1 ngày trước.

Dưới nắp capô

Pascal Editor không phải demo đơn giản. Kiến trúc kỹ thuật bên trong đáng chú ý:

• WebGPU rendering: Thay vì WebGL cũ, Pascal dùng WebGPU qua Three.js - hiệu năng tốt hơn, tiếp cận GPU features hiện đại hơn, pipeline future-proof hơn.
• Flat dictionary store với O(1) access: Scene data được lưu trong flat dictionary thay vì nested tree. Truy cập node theo ID trong O(1) thay vì phải duyệt cây - lý do editor mượt hơn nhiều so với các tool browser-based khác.
• Dirty-node system: Chỉ regenerate geometry của những node bị thay đổi trong mỗi render frame. Khi bạn kéo một bức tường, chỉ tường đó được tính lại - không phải toàn bộ scene.
• CSG (Constructive Solid Geometry) qua three-bvh-csg: Tự động tạo lỗ cắt cho cửa đi và cửa sổ trong tường - không cần thao tác thủ công.
• 50-step undo/redo qua Zundo middleware, lưu vào IndexedDB - hoạt động offline, tự động khôi phục session khi reload.

Stack đầy đủ: React 19, Next.js 16, React Three Fiber, Zustand, Zod, Zundo, Turborepo monorepo.

Tính năng chính

Pascal Editor hỗ trợ đầy đủ các thành phần kiến trúc:

• Tường (Wall): Vẽ bằng click và drag, tự động miter tại góc, hỗ trợ độ dày và chiều cao tùy chỉnh
• Sàn & trần (Slab/Ceiling): Định nghĩa bằng polygon, xử lý hình dạng phức tạp và lỗ hổng
• Mái (Roof): Hip, gable, mansard, flat - rewrite hoàn toàn trong v0.2.0
• Zone: Định nghĩa phòng, tính diện tích và chu vi tự động
• Nội thất (Items): Đặt nội thất, đèn, thiết bị với collision detection
• Multi-story: Quản lý nhiều tầng với 3 chế độ xem - Stacked, Exploded (tách dọc để xem nội thất), Solo
• GuideSystem: Import ảnh 2D làm reference để trace over bản vẽ sẵn có
• ScanSystem: Overlay point cloud từ reality capture cho as-built documentation

Pascal vs. các tool trả phí

Giới hạn cần biết

• Yêu cầu Chrome 113+ hoặc Edge 113+ để dùng WebGPU - Firefox chưa hỗ trợ đầy đủ.
• Performance giảm khi có quá nhiều tầng hiển thị cùng lúc - dùng Solo mode khi edit nhiều tầng.
• Chưa có BIM/IFC export, structural analysis, hay construction documentation workflow.
• Dự án mới 7 tháng - một số tính năng vẫn đang được tích cực phát triển.

Ai nên dùng ngay?

• Kiến trúc sư tự do: Concept design, floor planning nhanh mà không cần license đắt tiền
• Sinh viên kiến trúc: Học tool miễn phí, codebase mã nguồn mở 99.3% TypeScript để đọc hiểu
• Developer web: Build custom 3D spatial app bằng @pascal-app/core và @pascal-app/viewer trên npm
• Smart home enthusiast: Vẽ floor plan nhà để tích hợp với Home Assistant hoặc automation platform
• Interior designer: Quick visualization với furniture placement và zone definition

Bắt đầu ngay

Truy cập editor.pascal.app - không cần đăng nhập, không cần cài đặt. Hoặc tự host từ GitHub với Bun:

bun install
bun dev
# Mở http://localhost:3000

Nguồn: GitHub - pascalorg/editor, PyShine, ProgressiveRobot.