
Security News
npm ‘is’ Package Hijacked in Expanding Supply Chain Attack
The ongoing npm phishing campaign escalates as attackers hijack the popular 'is' package, embedding malware in multiple versions.
glsl-transpiler
Advanced tools
Transforms glsl source to optimized js code. It converts vectors and matrices to arrays, expands swizzles, applies expressions optimizations and provides stdlib for environment compatibility.
var Compiler = require('glsl-transpiler')
var compile = Compiler({
uniform: function (name) {
return `uniforms.${name}`
},
attribute: function (name) {
return `attributes.${name}`
}
})
compile(`
precision mediump float
attribute vec2 uv
attribute vec4 color
varying vec4 fColor
uniform vec2 uScreenSize
void main (void) {
fColor = color
vec2 position = vec2(uv.x, -uv.y) * 1.0
position.x *= uScreenSize.y / uScreenSize.x
gl_Position = vec4(position, 0, 1)
}
`)
// result:
`
var uv = attributes.uv
var color = attributes.color
var fColor = [0, 0, 0, 0]
var uScreenSize = uniforms.uScreenSize
function main () {
fColor = color
var position = [uv[0], -uv[1]]
position[0] *= uScreenSize[1] / uScreenSize[0]
gl_Position = [position[0], position[1], 0, 1]
}
`
To apply compilation to glsl AST or string, require glsl-transpiler
:
var GLSL = require('glsl-transpiler')
var source = glslify('./source.glsl')
var compile = GLSL(options?)
//compile source code
var result = compile(source)
//get collected info
var compiler = compile.compiler
compiler.attributes
compiler.uniforms
compiler.varyings
compiler.structs
compiler.functions
compiler.scopes
//clean collected info
compiler.reset()
Property | Default | Description |
---|---|---|
optimize | true | Enable expressions optimizations, eg. TODO |
preprocess | true | Apply preprocessing. Pass custom preprocessor function function (srcString) { return resultString; } to set own preprocessing. |
uniform | false | A function replacing each uniform declaration. Eg: function (name, node) { return 'uniforms["' + name + '"]' } will render each uniform declaration as var <name> = uniforms["<name>"] . |
attribute | false | Same as uniform , but for attribute declarations. |
varying | false | Same as uniform , but for varying declarations. |
version | '100 es' | GLSL shader version, one of '300 es' or '100 es' . |
comments | false | TODO: preserve comments in source code. |
sourceMap | false | TODO: include source map for the transpiled code. |
includes | true | Append stdlib includes for the result. Can be bool or an object with defined stdlib functions to include, eg. {normalize: false, min: false} . |
debug | false | Enable debugging facilities: print(anything) will log to console a string of transpiled code with it’s type separated by colon, show(anything) will print the rendered descriptor of passed fragment of code. Note also that you can safely use console.log(value) to debug shader runtime. |
Note that texture2D
function expects whether ndarray instance or defined width
and height
parameters on passed array.
glsl-transpiler can also be used as a stream. For each node from the glsl-parser it will return compiled js chunk:
var compile = require('glsl-transpiler/stream')
var parse = require('glsl-parser/stream')
var tokenize = require('glsl-tokenizer/stream')
fs.createReadStream('./source.glsl')
.pipe(tokenize())
.pipe(parse())
.pipe(compile(options?))
.once('end', function () {
//this.source contains the actual version of the compiled code
//and gets updated on each input chunk of data.
console.log(this.source)
})
FAQs
Transpile GLSL to JS
The npm package glsl-transpiler receives a total of 7,190 weekly downloads. As such, glsl-transpiler popularity was classified as popular.
We found that glsl-transpiler demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
The ongoing npm phishing campaign escalates as attackers hijack the popular 'is' package, embedding malware in multiple versions.
Security News
A critical flaw in the popular npm form-data package could allow HTTP parameter pollution, affecting millions of projects until patched versions are adopted.
Security News
Bun 1.2.19 introduces isolated installs for smoother monorepo workflows, along with performance boosts, new tooling, and key compatibility fixes.