把科学实验室装进浏览器Ergalics Studio 是如何做到的体验地址https://snowleopard-io.github.io/ErgalicsStudio/app/代码仓库GitHubhttps://github.com/SnowLeopard-io/ErgalicsStudioGiteehttps://gitee.com/cnt-code/ergalics-studio全部功能在浏览器中直接运行无需安装、无需注册、无需付费。一、总起一个完整的科学研究环境Ergalics Studio 是一个开源的浏览器端科学研究工作站致力于将科学计算、数值仿真、数据可视化、统计分析、实验管理与版本控制整合到同一个网页应用之中。它内置 60 个覆盖物理、化学、生物、地理、环境与人工智能等学科的科学插件19 个整页化科研工具以及一套以 Git 为存储底座的可复现性基础设施。项目的设计目标可以概括为三个消灭消灭门槛——专业科学计算软件动辄数 GB、许可昂贵、部署复杂Ergalics Studio 打开浏览器即可使用设备条件参差的教室也能统一开课消灭玩具感——网络上的科学模拟大多是无参数的预设动画本项目的每个插件背后都是可查证的真实数值内核并以四级元数据徽章明确标注其验证等级消灭断点——传统工作流中计算用 Python、画图用 Origin、记录用 Excel三者互不衔接本项目用统一内核、统一图形语言与自动提交的 Git 历史把整条研究链路焊成一个整体。以下演示视频完整展示了平台的主要工作流图 1 · 标准模式欢迎页环境自检、示例项目与插件入口集中于一个页面二、四种工作模式同一份研究的四种表达Ergalics Studio 提供四种可无缝互转的工作模式分别面向不同基础的使用者与不同形态的任务。模式面向人群形态典型场景标准模式全体使用者侧边栏选择插件参数面板即时计算单点分析、课堂演示流程模式有一定基础的学生40 余种区块拖拽连线增量执行数据清洗→分析→可视化的完整流水线积木模式编程启蒙阶段Blockly 积木生成真实代码中小学计算思维教学代码模式进阶使用者Python / R / JavaScript 三语言内核支持多语言互译自定义算法、迁移既有脚本图 2 · 流程模式区块化数据流水线支持增量执行与局部重算图 3 · 积木模式Blockly 积木直接生成可执行代码图 4 · 代码模式Python / R / JavaScript 三语言运行时模式互转依赖核心层的共享 IR中间表示中枢三种结构化模式编译后汇入同一份 IR由统一执行器增量运行mergeFlowIR与签名守卫保证互转过程中语义不变、资产不丢。这使教师可以用积木模式讲授逻辑、学生用流程模式完成实验、进阶者在代码模式中自由扩展——三者共享同一份实验资产没有人被语言门槛挡在研究之外。积木模式Blockly 13 类共享 IR 中枢签名守卫 · 增量执行流程模式40 区块代码模式Python / R / JS统一结果与实验资产代码模式值得展开说明。它的三语言运行时各有明确分工Python由浏览器内 PyodideWebAssembly 版 CPython驱动NumPy、SciPy 等科学计算栈可用——电磁本征求解器的稠密/稀疏特征值分解即运行于此R面向统计建模使用者可直接沿用课堂上教授的 R 语法做假设检验与回归JavaScript则与平台自身内核共享同一运行环境适合与插件结果做即时交互分析。三语言之间提供多语言互译帮助使用者把既有脚本迁移到团队统一的语言栈。所有代码运行都在沙箱中完成实验产物统一进入项目的版本控制体系。三、六十个插件一个按学科组织的仿真生态平台目前内置60 个科学插件按学科分组组织于侧边栏。每个插件都携带科研级元数据以四级徽章标明其可靠程度——从教学演示到文献对照验证学生可以在插件列表中直接看到每个工具的可信度边界每个插件运行后其结论、方法与局限以结构化形式写入统一的科学输出栏而非隐藏在帮助文档中。插件生态 · 60 个图表与统计箱线图 · 小提琴图QQ 图 · 误差带桑基图 · 平行坐标直方图 · 热力图物理N 体引力 · 3DLBM 格子流体波动干涉电磁谐振腔本征模光学棱镜 · 结构桁架化学与生物分子动力学反应晶胞 3D酶动力学 · 传染病模型序列比对 · 群体遗传蛋白质交互网络地理与环境空间插值 IDW/克里金地形分析 · 流域三件套FAO-56 辐射空气质量 AQI水质评价 GB 3838高斯烟羽 · 全球环境 3DAI 与数学MNIST 训练分形 · 利萨茹点云 · 体素 · 曲面 3D图 5 · N 体引力插件数千粒子在 GPU 上实时演化图 6 · 电磁本征求解器谐振腔内真实本征模式的 3D 场分布图 7 · 蛋白质交互网络图算法驱动的生物网络分析三个学科场景速览地理气候图插件按 FAO-56 与标准气候学方法从逐月气温降水序列绘制出版级气候图配合 GPX 轨迹插件可直接导入户外采集的路径数据完成里程、坡度与高程分析图 8 · 气候图逐月气温-降水复合图支持科学输出栏结论图 9 · GPX 轨迹户外采集路径的高程与坡度剖面生物传染病插件内置 SIR / SEIR / SIRS 等仓室模型可实时调整传播率与恢复率观察疫情曲线对参数的敏感性——这是流行病学教学中最直观的实验台图 10 · 传染病仓室模型SIR / SEIR 参数敏感性实验信号信号实验室将 FFT 内核与出版级绘图结合时域信号的频谱分解在 GPU 上瞬时完成相位谱、功率谱与窗函数对比一页呈现。四、WebGPU 计算管线浏览器里的并行科学计算Ergalics Studio 在计算层的核心投入是一套自研的WebGPU 计算管线。这是真仿真得以成立的技术前提——没有并行算力浏览器中的科学仿真只能停留在玩具尺度。14 个可复用的 WGSL 计算内核项目在核心层src/core/wgsl.ts实现了 14 个数据驱动的 WGSL 计算着色器模板每个内核都显式文档化其绑定位布局与 uniform 结构供全部插件按需取用内核用途采用的插件nbodyKernelN 体引力两两作用积分N 体引力particleKernel粒子平流积分粒子系统fluidCollide / Stream / CurlLBM 格子玻尔兹曼的碰撞、迁移与涡量三段求解流体模拟waveKernel波动方程显式时间步进波动干涉histogram / binningKernel并行归约直方图统计统计图表heatmapKernel场量热力图渲染热力图pointCloudKernel点云变换与着色点云 3DmatmulKernel分块矩阵乘法线性代数fftKernel快速傅里叶变换信号实验室kmeansKernel并行聚类数据画像spmvKernel稀疏矩阵-向量乘本征求解器以 LBM 流体插件为例格子玻尔兹曼求解被拆分为碰撞、迁移、涡量三个计算通道每帧在 GPU 上完成数十万格子的状态更新——这是流场真实演化而非播放水波动画的本质区别。图 11 · 波动干涉波动方程 GPU 显式时间步进的实时波场图 12 · LBM 格子玻尔兹曼流体GPU 上逐帧求解的真实流场一条计算管线的解剖以 N 体插件的一次 GPU 求解为例管线的工作方式如下插件声明内核模板nbodyKernelWGSL与数据规模后计算层依次完成存储缓冲区创建粒子状态以[x, y, vx, vy]交错布局写入STORAGE缓冲、绑定组装配storage uniform 各就其位uniform 结构严格按 16 字节对齐、按 workgroup 派发每 64 粒子一个 workgroup边界做溢出保护、结果回读WebGPU 禁止直接映射 storage 缓冲故先COPY_SRC至独立的MAP_READ | COPY_DST回读缓冲再异步取回。整个链路对插件作者只暴露三四个调用点——并行算力的工程复杂度被管线吸收插件作者只需声明算什么。工程可靠性设计计算管线在工程层面做了三项关键处理能力检测与降级——插件运行时通过统一的 GPU 能力接口探测设备无 WebGPU 环境自动回退 CPU 路径结果一致、仅性能不同绝不报错设备丢失自愈——监听 GPU 设备丢失事件自动重建设备与缓冲区长时间运行的仿真不会因驱动重置而中断可复现性绑定——GPU 随机性与种子由可复现性内核统一供给mulberry32 确定性序列同一实验在不同设备上可重放。此外平台的统计推断引擎Bootstrap 不确定性量化、贝叶斯后验采样同样运行在这条 GPU 管线上使得万次重抽样级别的计算在课堂笔记本上秒级完成。图 13 · Inference ForgeGPU 加速的贝叶斯后验采样五、数据驱动的空态设计示例是入口不是内容值得单独说明的是平台对示例数据的处理原则数据分析类插件打开即空态——不预置任何演示数据全部示例通过顶栏示例栏一键载入或直接拖入使用者自己的 CSV 文件。参数驱动的仿真类插件则按物理默认值开箱渲染。这一设计并非细节洁癖。工具的默认行为决定了使用者的第一课数据是分析的起点而不是装饰。以环境学套件为例空气质量插件依据 HJ 633-2012 与 GB 3095-2012 断点计算 IAQI 并给出健康建议水质插件按 GB 3838-2002 单因子法判定类别并输出加权 WQI——学生拖入自己城市的数据得到的是针对真实环境的结论。图 14 · 地理套件地图投影失真的 Tissot 指标线可视化六、科研闭环从一次运行到一篇报告插件产出只是起点。Ergalics Studio 将研究拆解为一条完整流水线并以 19 个整页化实验室工具覆盖全程运行 RunFigure Studio出版级矢量图形Sweep Studio参数扫描不确定性引擎GPU Bootstrap报告生成器补充材料一键打包Repro Lock 可复现锁图 15 · Figure Studio出版级图形编辑与导出图 16 · Sweep Studio参数空间批量扫描与对比图 17 · 不确定性引擎GPU 加速的 Bootstrap 重抽样每个项目都是一台 Git 机器平台最具差异化的基础设施是项目本身即 Git 仓库。浏览器端内嵌 isomorphic-git 与 LightningFSIndexedDB 承载工作区无需命令行侧边栏 Git 面板实时显示分支、领先/落后计数与提交历史每次运行完成、每张图形保存、每次手动保存、每次导出补充材料均自动生成一次 Conventional Commit——git log即完整的实验年表标准项目模板预装工程钩子pre-commit校验repro.lock锁定环境与依赖指纹pre-push执行单元测试克隆到本地后可直接对接预置的 GitHub Actions 工作流协作场景下在面板中填入仓库地址即可完成 pull / push / fetch远程同步经由可配置的 CORS 代理。图 18 · Repro Lock环境与依赖指纹锁定图 19 · 补充材料图表、数据与运行记录一键打包对研究者而言这一层回答的是那个最棘手的问题三个月后你依然可以拿出当时的每一步。七、若干工程决策1. 纯 TypeScript 手写内核 Rust WASM 混合。可视化、统计与数值方法以纯 TypeScript 实现每一行数学开放可查性能关键路径由 Rust 编译的 WASM 模块承担。不依赖黑盒也不牺牲性能。2. 双语同步。全部 60 个插件、19 个实验室页面与 3D 场景内标注的中英文在 i18n 层同步维护中文使用者为第一等公民。3. 性能可观测。FPS、GPU、内存与数据规模监控常驻状态栏——使用者从第一天起就建立我的实验跑了多大规模的量化直觉。4. 出版级输出。绘图引擎输出矢量 SVG可直接进入 LaTeX / Illustrator 工作流3D 场景导出透明底 PNG。图表不是截图凑合而是论文素材。八、常见问题没有 WebGPU 的电脑能用吗可以。计算管线在启动时探测设备能力无 WebGPU 环境自动回退 CPU 路径——结果一致仅性能不同。状态栏会实时显示当前使用的计算后端与资源占用。数据会被上传到服务器吗不会。项目文件、实验记录与 Git 仓库全部存储在浏览器本地的 IndexedDB 中只有在主动执行远程同步push / pull时数据才会经由你配置的仓库地址与 CORS 代理离开本机。我的数据格式不标准怎么办平台的导入层支持 CSV / TSV 等分隔文本的容错解析自动识别表头别名与编码并提供二进制科学格式的导入能力数据画像与清洗工具可在正式分析前完成类型推断与异常值处理。可以用于正式发表吗绘图引擎输出矢量 SVG 与透明底 PNG可直接进入 LaTeX 排版流程补充材料打包包含运行记录与可复现锁满足期刊对数据与过程可溯性的普遍要求。如何参与贡献插件契约公开且稳定一个携带 manifest 声明的纯函数模块即可接入整个平台并获得参数面板、3D 场景、科学输出栏与版本控制的全套支持。文档站附有完整的插件开发指南。九、开始使用Ergalics Studio 以 MIT 许可证完全开源欢迎用于教学、科研与二次开发体验地址https://snowleopard-io.github.io/ErgalicsStudio/app/代码仓库GitHubhttps://github.com/SnowLeopard-io/ErgalicsStudioGiteehttps://gitee.com/cnt-code/ergalics-studio插件系统的契约公开且稳定一个携带 manifest 声明的纯函数模块即可接入整个平台并获得参数面板、3D 场景、科学输出栏与版本控制的全套支持。若这个项目对你的课堂或研究有所助益欢迎 Star、提 Issue、撰写插件。科学工具不应当是奢侈品也不应当是玩具。它应当像实验室的桌凳一样——就在那里坐下即可开始工作。