Wonder.js NPM | npm.io

Wonder.js

Wonder.js is a Functional, High performance 3D WebGL Engine.

Showcases

Design

Functional Programming
Functional Reactive Programming
Microservice
Job Pipeline
Multi-Thread
Data Oriented Design
Data Driven
ECS

Feature

GameObject And Component
Multi-thread Render
Texture
Direction,Point Light
Model and Scene
Stream Load
IMGUI
Event
Instance

Document

Document

Getting Help

Support Environment

PC

Chrome
Firefox
360 browser(v10.0)
qq browser(v10.4)

Usage

Online Editor

Here show a cube example(more is in examples/ folder):

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>cube</title>
</head>

<body>
    <script src="https://wonder-technology.github.io/wonder-demo.github.io/examples/wd.js"></script>

    <script>
        window.onload = function () {
            return wd.loadConfig(["https://wonder-technology.github.io/wonder-demo.github.io/examples/config/setting.json", "https://wonder-technology.github.io/wonder-demo.github.io/examples/config/"]).forEach(function (state) {
                return initSample(wd.unsafeGetState());
            })

            function _createBox(state) {
                var [state, material] = wd.createLightMaterial(state);

                var state = wd.setLightMaterialDiffuseColor(material, [0.0, 0.5, 0.2], state);
                var state = wd.setLightMaterialSpecularColor(material, [0.3, 0.1, 0.6], state);

                var [state, meshRenderer] = wd.createMeshRenderer(state);

                var [state, gameObject] = wd.createGameObject(state);

                var state = wd.addGameObjectLightMaterialComponent(gameObject, material, state);
                var state = wd.addGameObjectMeshRendererComponent(gameObject, meshRenderer, state);


                var [state, geometry] = wd.createBoxGeometry(state);


                var state = wd.addGameObjectGeometryComponent(gameObject, geometry, state);

                return [state, gameObject];
            };

            function _createCamera(state) {
                var [state, basicCameraView] = wd.createBasicCameraView(state);


                var state =
                    wd.activeBasicCameraView(
                        basicCameraView, state
                    );


                var [state, perspectiveCameraProjection] = wd.createPerspectiveCameraProjection(state);


                var state = wd.setPerspectiveCameraProjectionNear(perspectiveCameraProjection, 0.1, state);
                var state = wd.setPerspectiveCameraProjectionFar(perspectiveCameraProjection, 2000, state);
                var state = wd.setPerspectiveCameraProjectionFovy(perspectiveCameraProjection, 60, state);


                var [state, gameObject] = wd.createGameObject(state);

                var state = wd.addGameObjectBasicCameraViewComponent(gameObject, basicCameraView, state);


                var state = wd.addGameObjectPerspectiveCameraProjectionComponent(gameObject, perspectiveCameraProjection, state);

                var transform = wd.unsafeGetGameObjectTransformComponent(gameObject, state);

                var state = wd.setTransformLocalPosition(transform, [0, 10, 50], state);

                return [state, gameObject];
            };


            function _createDirectionLight(state) {
                var [state, light] = wd.createDirectionLight(state);

                var state = wd.setDirectionLightColor(light, [1.0, 0.0, 0.0], state);


                var [state, gameObject] = wd.createGameObject(state);


                var transform = wd.unsafeGetGameObjectTransformComponent(gameObject, state);

                var state = wd.setTransformLocalEulerAngles(transform, [0, 180, 0], state);


                var state = wd.addGameObjectDirectionLightComponent(gameObject, light, state);

                return [state, gameObject];
            };

            function initSample(state) {
                var [state, box] = _createBox(state);


                var state = wd.setAmbientLightColor([0.2, 0.2, 0.2], state);


                var [state, directionLightGameObject] = _createDirectionLight(state);


                var [state, cameraGameObject] = _createCamera(state);


                wd.startDirector(state);
            }
        };
    </script>
</body>
</html>

How to build

sudo yarn install //execute in project root dir

for Chinese users

npm install -g cyarn --registry=https://registry.npm.taobao.org

npm config set puppeteer_download_host=https://npm.taobao.org/mirrors

cyarn install //execute in project root dir

Reason的介绍和搭建Reason开发环境

License

MIT Licence

Donate

You are welcome to donate for Wonder.js project! Thanks very much!

微信支付：下载.png-6.5kB

Donors

日期	头像	金额（元）
2020.02.13		999
2020.03.04		2000
2020.04.29		1000
2020.04.29		999

wonder webgl functional-programming high-performance 3d engine reasonml reason bucklescript

bs-fetch wonder-bs-json wonder-bs-most wonder-commonlib wonder-imgui wonder-log wonder-most-animation-frame wonder-webgl

@infinitebrahmanuniverse/nolb-won @everything-registry/sub-chunk-3159 wonder-rtx-pathtracer wonder-tool-converter wonder-editor

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago

7 years ago