The Orillusion engine is a lightweight rendering engine that fully supports the WebGPU standard. Based on the latest Web graphics API standard, a lot of explorations and attempts have been made, and many technologies and functions that were difficult or impossible to realize in the Web were realized.

WebGPU support​

The bottom layer of the engine does not take into account compatibility with existing WebGL standard, but fully to the latest WebGPU The standard is on par.along withWebGPU API and WGSL Continuous development, the development team will also quickly update the bottom layer of the iterative engine WebGPU Computing and rendering capabilities to improve engine performance.

ECS Component System​

Since the development of the engine framework, the industry has generally begun to adopt 组合优于继承 development and design principles.Therefore, the development team abandoned the inheritance architecture and opted for the latest ECS Component architecture is the overall design idea of ​​the engine. Eliminates the problems of complex inheritance chains and intertwined functions in the inheritance model. Through decoupling, encapsulation and modular redesign, developers can more flexibly combine and expand functions.

Data Oriented (DO) Design​

strict ECS architecture requirements, requirements Entity, Component and System to be completely independent. Under this design paradigm, data optimization and performance can be greatly improved. But at the same time, it will also bring a big negative problem, that is, the development cost and difficulty are very high. Therefore, the difficulty of use by developers and the development habits of Web developers are considered.Adopted ECS Core Data Oritented (面向数据开发) concept, on-demand DO Structure.Currently used in the GPU Create contiguous memory in the CPU and GPU Through the way of memory mapping, the continuous and efficient transmission of data is realized, reducing CPU and GPU The waiting time and times of data exchange between. It can not only improve the cache hit rate and achieve performance improvement, but also ensure the ease of use of the overall engine development and use.

Cluster Light Culling​

here is Clustered Forward Rendering The lighting culling scheme in .in two dimensions (Tile) and 3D (Cluster) At the same time, the space is divided into blocks, and finally only the light sources that contribute to the light of this block space are calculated, and the process of eliminating invalid light sources is completed to improve the calculation efficiency.based on WebGL of Uniform Buffer There are many restrictions, and the number of light sources supported is relatively small, generally within 10.WebGPU have it Storage Bufferwhich is basically a direct benchmark GPU Memory limitations. As long as you do a good job in memory management and optimization, you can make full use of the capabilities of the GPU to achieve multi-light source rendering scenes.

Physical Simulation System​

connected first ammo.js, as the basic physical simulation function on the CPU side.At the same time is building based onCompute Shader of GPU Terminal physics simulation engine, including particles, fluids, soft bodies, rigid bodies, cloth, etc.existWebGL During the period, the corresponding calculation process can only be performed by relying on the data structure of vertices and textures, which is complicated and inefficient.passWebGPU of Compute Shader, memory and data structures are more flexible, giving a lot of room for imagination. At present, many excellent physical simulation cases have been realized, and more and stronger physical simulation functions are in the process of rapid iteration.

Physically Based Material Rendering​

achieved the most basic Blinn-phong Model material rendering.In order to add a better photorealistic rendering effect, rely on HDR Light also implemented based on PBR (Physically-based rendering) material rendering. It is also the standard configuration of mainstream engines at present, and it is a relatively popular basic engine requirement.

Rich post-processing special effects​

后处理特效 It is an important processing method to improve the atmosphere of the rendered content.based on WebGPU of compute shadercurrently implemented HDR 泛光,屏幕空间反射, 环境光屏蔽 and other commonly used post-processing effects.rely on WebGPU general-purpose computing power can be utilized more efficiently GPU Computational advantages to achieve very good results.

For example,Screen Space Reflection (SSR) It is based on the size of the screen space to achieve the reflection effect.Compared with plane reflection, any surface reflection of the scene can be realized without additional DrawCall, is a very popular real-time reflection technique. First, each pixel of the screen-space object needs to calculate its reflection vector.Then, you need to determine the screen space Ray Marching Whether the coordinate depth intersects with the object depth stored in the depth buffer. Finally, adjust the roughness appropriately, and use the color of the intersection point as the reflection color to complete the coloring.The calculation process in this process is all through WebGPU of Compute Shader to achieve, to avoid CPU consumption. The end result is very nice reflections in the browser.

More extended post-processing special effects reference PostEffects.