Package Exports

@thi.ng/shader-ast-js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@thi.ng/shader-ast-js) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@thi.ng/shader-ast-js

npm downloads

This project is part of the @thi.ng/umbrella monorepo.

About
Installation
Dependencies
Usage examples
API
Authors
License

About

Customizable JS code generator, compiler & runtime for @thi.ng/shader-ast.

Due to the lack of native vector operations in JS, this compile target is much more involved than the @thi.ng/shader-ast-glsl code gen and uses a pluggable backend to perform all math ops. The default backend delegates all ops to @thi.ng/vectors and @thi.ng/matrices, which altogether provide ~750 optimized vector/matrix functions.

Unsupported features

texture lookups (see texture tunnel demo for a monkey-patched solution)
derivatives (dFdx, dFdy, fwidth) - probably never supported in this env
out / inout function args (see #96 for discussion)

Status

STABLE - used in production

@thi.ng/shader-ast-glsl - Customizable GLSL code generator for @thi.ng/shader-ast
@thi.ng/shader-ast-stdlib - Function collection for modular GPGPU / shader programming with @thi.ng/shader-ast

Installation

yarn add @thi.ng/shader-ast-js

Package sizes (gzipped): ESM: 4.9KB / CJS: 4.4KB / UMD: 4.4KB

Dependencies

Usage examples

Several demos in this repo's /examples directory are using this package.

A selection:

shader-ast-canvas2d

screenshot

Live demo | Source

shader-ast-noise

Live demo | Source

shader-ast-raymarch

screenshot

Live demo | Source

shader-ast-sdf2

Live demo | Source

shader-ast-tunnel

Live demo | Source

shader-ast-workers

screenshot

Live demo | Source

API

Generated API docs

// AST node functions from main shader-ast pkg
import {
    mul,
    defn,
    float,
    ret,
    vec3
} from "@thi.ng/shader-ast";

// codegen / compiler
import { targetJS } from "@thi.ng/shader-ast-js";

const js = targetJS();

const hello = defn("vec4", "hello", ["float"], (n) => [
    ret(vec4(mul(vec3(1, 2, 3), n), -1))
]);

js(hello)

const Module = js.compile(hello);
Module.hello(10);
// [10, 20, 30, -1]

Authors

Karsten Schmidt