Orillusion开放公测来啦~
大家期待的新一代完全开源的轻量级的基于 WebGPU 标准的渲染引擎终于要闪亮登场啦!
Orillusion是基于浏览器的Web渲染引擎,采用了最新的WebGPU标准来提供底层的图形能力。引擎的整体框架采用了现代引擎遵循的ECS组件式架构,以更为严谨的TypeScript作为开发语言。通过集群前向渲染和动态全局光照,使得整体的3D场景计算效率和渲染效果得到了质的提升。目前,Orillusion引擎还处于快速迭代升级阶段,很多桌面级的图形能力,都将因为WebGPU标准的出现而迁移到Web端。同时,基于浏览器的Web环境,天然地赋予了我们很多应用层面的优势,比如易分享、易协作、易上手、跨平台等等。因此,Web3D领域孕育着巨大的想象空间。
现在是不是摩拳擦掌想试试啦,简单三步教你轻松上手~
温馨Tips
针对浏览器版本:Chrome Canay 113
此次更新面对广大开发者,非开发者用户不建议申请。
Orillusion 0.5 版本仅是一个公测版本,尚不稳定,不建议进行商业应用开发。
此次仅开放NPM安装包,源代码会在后续优化过程中,择日开放。
希望大家遇到问题和Bug,积极反馈,我们会全力第一时间修复。
步骤一:构建Web3D应用
配合Vite 或 Webpack 等前端生态框架,来构建前端项目。(如果在现有的项目中使用,可以跳过此步骤)
步骤二:安装Orillusion引擎
通过 NPM 安装(更多的安装方式请参考教程文档)
我们可以通过任何熟悉的IDE来完成Orillusion引擎的安装,我们推荐小白用户直接无脑安装VScode。后续我们也会在VScode环境中开发插件,来辅助大家更灵活便捷的使用Orillusion引擎。
a. 在构建好的项目中使用 npm 命令,在提示行中安装引擎依赖:
npm install @orillusion/core --save
b. 可以按需求引入指定模块,或引入全局模块:
import { Engine3D, Camera3D } from '@orillusion/core'
import * as Orillusion from '@orillusion/core'
步骤三:使用Orillusion引擎
创建 Engine3D 实例
在使用引擎前,必须通过 Engine3D.init() 方法进行初始化,引擎会自动创建一个 Engine3D实例
import { Engine3D } from '@orillusion/core';
Engine3D.init().then(()=>{
// 进行后续操作
})
创建 Canvas画布
默认参数下,Engine3D.init() 实例会自动生成一个以屏幕大小为宽高的 canvas 画布。如果不想使用引擎自动创建的画布,用户也可以手动创建画布。
import { Engine3D } from '@orillusion/core';
let canvas = document.getElementById('canvas')//需要在HTML内自行创建ID为canvas的元素
await Engine3D.init({
canvasConfig: { canvas }
});
附上保姆级教程
遇到问题怎么办?别急,你可以通过以下三个方式联系我们,我们会及时给予大家解答和帮助!
方式1:Github
由于引擎还未开源,我们会提前建立一个Github的空Repo,用来给大家提Issue和反馈问题。后续开源,我们也会把源代码全部推送到这个Repo当中,一直延续使用。
https://github.com/Orillusion/orillusion
方式2:加入开发者社群
长按或扫描下方二维码添加小鸥微信加入Orillusion开发者群
引擎的云端能力,并没有包含在这次的发布版本中,后续我们也会针对于相应的云服务提供详细的介绍和使用教程。
最近AI引爆全网,我们从第一天就确定Orillusion是端云协同+AI的策略。但是没有意料到ChatGPT会让AI引爆的如此之快,Orillusion的AI能力也正在全面加速,会在第一时间跟大家公布进展。
我们也将计划正式开源,敬请期待哦~
Orillusion致力于打造全世界第一款完全开源基于WebGPU标准的一种轻量级渲染引擎,目标是在浏览器中实现桌面级的渲染效果,支持超大复杂场景的3D呈现。易上手,易分享,易迭代,易协作、成本低,跨平台是我们的核心优势,我们将为3D场景爆发时代提供引擎基础工具。
未来我们将会持续把最干货最前沿的WebGPU技术分享给每一位社区成员,也欢迎大家为Orillusion开源社区做出自己的贡献。我们一直坚信,开源社区的技术留痕是每一位技术人员最崇高的追求!因此,我们尊重,我们认可,我们更期待,加入Orillusion,让我们共同进步!
——Link uncharted, 链接未来世界