阿喵前言
以前搞建筑建模或者室内设计，第一步永远是安装几 GB 大小的专业软件，还得祈祷显卡驱动别出问题。虽然现在 Web 技术很强，但能在浏览器里流畅跑完“建模、排布、渲染”全流程的工具依然不多见。
今天分享的这个开源项目 Pascal，打破了“专业建模必装软件”的刻板印象。它利用现代前端架构，在网页里实现了一套极其丝滑的 3D 建筑编辑体验。无论是想快速拉个户型图，还是想展示复杂的楼层叠拼，打开浏览器就能开工。
项目介绍
Pascal 是一款基于 Next.js 开发的开源 3D 建筑编辑器。它并不是简单的 3D 模型预览器，而是一个拥有完整“建筑 -> 楼层 -> 墙体 -> 区域”层级体系的专业级工具。它底层采用了高性能的 ECS（实体组件系统）架构，配合 GPU 驱动的更新系统，确保了即便在处理复杂建筑场景时，浏览器依然能保持高帧率运行。
网站截图
技术亮点
- 高性能渲染引擎：基于 GPU 驱动的更新系统和 脏节点追踪技术（Dirty Node Tracking）。这意味着当你修改一堵墙时，系统只会重新计算受影响的部分，而不是刷新整个 100 层的场景，资源利用率非常精准。
- 云原生开发架构：采用 Next.js 构建，本质上就是一个网页。开发者可以轻松将其部署为 SaaS 服务，用户无需下载任何桌面安装包。
- 可靠的状态管理：内置 Zustand 管理全局状态，原生支持完整的 撤销（Undo）与重做（Redo） 操作。这对于复杂的建模任务来说，是保证容错率的刚需。
- 深度的 3D 可视化交互：你可以直接在 3D 视图下通过鼠标拖拽来改变墙体位置、调整楼板形状，甚至可以一键拆解、堆叠任意楼层，方便查看内部的细节构造。
核心功能
- 层级化编辑：严格遵循建筑逻辑，从整体建筑到单个房间区域（Zone）都有清晰的层级映射。
- 实时几何计算：墙体与楼板的交接、形状的闭合都由底层算法实时计算，确保 3D 模型在视觉上是严丝合缝的。
- 灵活的视图控制：支持自由视角切换，配合流畅的 UI 交互，让非专业用户也能快速上手进行空间布局。
- 代码简洁可扩展：项目采用 TypeScript 编写，对于想要二次开发建筑类软件或者数字孪生平台的开发者来说，这是一个极佳的脚手架。
使用说明
如果你是开发者想本地部署，或者只是想去 Demo 页面体验：
- 访问 Demo：直接进入官网 editor.pascal.app。
- 创建楼层：在左侧面板添加新楼层，你会看到 3D 空间中立即出现了对应的楼板层级。
- 绘制与拖拽：在平面或 3D 视图下选定墙体，直接拖动即可实时看到建筑轮廓的变化。
- 拆解查看：利用楼层堆叠功能，可以像玩抽屉一样把不同层级拉出来单独审视。
项目地址
- 在线体验：https://editor.pascal.app/
- GitHub 源码：https://github.com/pascalorg/editor
这种把复杂 CAD 逻辑搬进 Web 端并保持高性能的项目，非常适合用在智能家居展示、房产可视化或者简单的室内设计场景中。