webGPU orillusion(一)

关于架构的理解与认识

  Orillusion 核心借鉴了 ECS 结构，遵循 组合优于继承 的开发设计原则，实现了自己的组件系统。我们将传统复杂的逻辑划分为独立的、可重复利用的部分，每个部分可以单独封装运行逻辑。然后通过灵活组合的形式，将多个简单组件合并在一起运行从而表现复杂的功能和逻辑。

       也就是说，他会声明一个物体容器或者场景容器，而这个物体不会有任何属性。所有的属性诸如threejs等中的摄像机、几何体、控制器等，都只是该物体容器的一个属性。也就是说，摄像机不再是引擎内部的一个预设对象，他只是有摄像属性的物体。从性质上讲，他与开发者创造的其他物体并无区别，这是很不同于threejs等的一方面。这是对于各类物体更底层的抽象，道家所谓缘起性空，性空缘起，大抵如此。一个物体之所以有他的意义，是在于他有不同的属性，除过不同的属性，他只是一个空的容器。比如：

• 相机 = Position + Rotation + Camera3D
• 灯泡 = Position + Rotation + PointLight + Shadow
• 盒子 = Position + Rotation + Scale + BoxGeometry + Material

       其中，所有组件都是独立且平等的，且各自只负责一个单独的功能，这样的拆分使得 Position 和 Rotation 模块可以重复利用，在使用时按需要组合即可，大大提高代码的利用效率，也能有效降低各个模块间的耦合性。

基础用法

//创建一个实体
let obj = new Object3D();
//将实体添加到场景中
scene.addChild(obj);

 添加组件

let obj = new Object3D();
let light = obj.addComponent(DirectLight)

 删除组件

let obj = new Object3D();
let light = obj.removeComponent(DirectLight)

 停用组件

let obj = new Object3D();
let light = obj.getComponent(DirectLight)
light.enable = false

 

启用组件

let obj = new Object3D();
let light = obj.getComponent(DirectLight)
light.enable = true

 LookAt（）与控制器setCamera（）

setCamrea的优先级高于LookAT（），即使你对LookAT（）函数进行了设置，也会优先使用setCamera的默认值，也就是说，挂载了控制器就会使用控制器对摄像机的位置属性。（如图）

 camera.lookAt(
        new Vector3(10, 0, 0),
        new Vector3(0, 0, 0),
        new Vector3(0, 1, 0)
      );

      controller.setCamera(new Vector3(10, 10, 10), new Vector3(0, 0, 0));
      scene.addChild(CameraObj);

运行截图：