{"id":13438866,"url":"https://github.com/stackgl/glsl-transpiler","last_synced_at":"2025-05-16T01:07:05.124Z","repository":{"id":65537263,"uuid":"51807165","full_name":"stackgl/glsl-transpiler","owner":"stackgl","description":"Transpile GLSL to JS","archived":false,"fork":false,"pushed_at":"2025-01-18T20:41:18.000Z","size":724,"stargazers_count":179,"open_issues_count":19,"forks_count":23,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-04-08T12:07:20.362Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"http://stackgl.github.io/glsl-transpiler/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/stackgl.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-02-16T04:10:59.000Z","updated_at":"2025-03-25T18:24:11.000Z","dependencies_parsed_at":"2024-01-16T01:28:13.098Z","dependency_job_id":"3d928e8d-c7d0-495c-95bd-544d9234a8c5","html_url":"https://github.com/stackgl/glsl-transpiler","commit_stats":{"total_commits":271,"total_committers":5,"mean_commits":54.2,"dds":"0.029520295202952074","last_synced_commit":"95256fdf4cf7be3703b738a1bc6cb825bdcca8bb"},"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stackgl%2Fglsl-transpiler","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stackgl%2Fglsl-transpiler/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stackgl%2Fglsl-transpiler/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stackgl%2Fglsl-transpiler/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/stackgl","download_url":"https://codeload.github.com/stackgl/glsl-transpiler/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253650904,"owners_count":21942226,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-07-31T03:01:09.113Z","updated_at":"2025-05-16T01:07:00.116Z","avatar_url":"https://github.com/stackgl.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# glsl-transpiler [![test](https://github.com/stackgl/glsl-transpiler/actions/workflows/test.yml/badge.svg)](https://github.com/stackgl/glsl-transpiler/actions/workflows/test.yml)\n\nTransforms [glsl](https://www.opengl.org/documentation/glsl/) source to optimized js code. It converts vectors and matrices to arrays, expands swizzles, applies expressions optimizations and provides stdlib for environment compatibility.\n\n## Usage\n\n[![npm install glsl-transpiler](https://nodei.co/npm/glsl-transpiler.png?mini=true)](https://npmjs.org/package/glsl-transpiler/)\n\n```js\nimport GLSL from 'glsl-transpiler'\n\nvar compile = GLSL({\n\tuniform: function (name) {\n\t\treturn `uniforms.${name}`\n\t},\n\tattribute: function (name) {\n\t\treturn `attributes.${name}`\n\t}\n})\n\ncompile(`\n\tprecision mediump float\n\tattribute vec2 uv\n\tattribute vec4 color\n\tvarying vec4 fColor\n\tuniform vec2 uScreenSize\n\n\tvoid main (void) {\n\t\tfColor = color\n\t\tvec2 position = vec2(uv.x, -uv.y) * 1.0\n\t\tposition.x *= uScreenSize.y / uScreenSize.x\n\t\tgl_Position = vec4(position, 0, 1)\n\t}\n`)\n\n// result:\n\n`\nvar uv = attributes.uv\nvar color = attributes.color\nvar fColor = new Float32Array([0, 0, 0, 0])\nvar uScreenSize = uniforms.uScreenSize\n\nfunction main () {\n\tfColor = color\n\tvar position = new Float32Array([uv[0], -uv[1]])\n\tposition[0] *= uScreenSize[1] / uScreenSize[0]\n\tgl_Position = new Float32Array([position[0], position[1], 0, 1])\n}\n`\n```\n\n\n## API\n\n### glsl-transpiler\n\nTo apply compilation to glsl AST or string, require `glsl-transpiler`:\n\n```js\nimport GLSL from 'glsl-transpiler'\n\nlet compile = GLSL({\n\t// Enable expressions optimizations.\n\toptimize: true,\n\n\t// Apply preprocessing. Pass custom preprocessor function `(srcString) =\u003e resultString;` to set own preprocessing.\n\tpreprocess: true,\n\n\t// A function replacing each uniform declaration. Eg: ``(name, node) =\u003e `uniforms[\"${name}\"]`;`` will render each uniform declaration as `var \u003cname\u003e = uniforms[\"\u003cname\u003e\"]`.\n\tuniform: false,\n\n\t// Same as `uniform`, but for attribute declarations.\n\tattribute: false,\n\n\t// Same as `uniform`, but for varying declarations.\n\tvarying: false,\n\n\t// GLSL shader version, one of `'300 es'` or `'100 es'`.\n\tversion: '100 es',\n\n\t// Append stdlib includes for the result. Can be bool or an object with defined stdlib functions to include, eg. `{normalize: false, min: false}`.\n\tincludes: true,\n\n\t// 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.\n\tdebug: false\n})\n\n//compile source code\nlet result = compile('...source.glsl')\n\n//get collected info\nlet {\n\tattributes,\n\tuniforms,\n\tvaryings,\n\tstructs,\n\tfunctions,\n\tscopes\n} = compile.compiler\n\n\n//clean collected info\ncompiler.reset()\n```\n\nNote that `texture2D` function expects whether ndarray instance or defined `width` and `height` parameters on passed array.\n\n\n### glsl-transpiler/stream\n\n_glsl-transpiler_ can also be used as a stream. For each node from the [glsl-parser](http://stack.gl/packages/#stackgl/glsl-parser) it will return compiled js chunk:\n\n```js\nimport compile from 'glsl-transpiler/stream.js'\nimport parse from 'glsl-parser/stream.js'\nimport tokenize from 'glsl-tokenizer/stream.js'\n\nfs.createReadStream('./source.glsl')\n.pipe(tokenize())\n.pipe(parse())\n.pipe(compile(options?))\n.once('end', function () {\n\t//this.source contains the actual version of the compiled code\n\t//and gets updated on each input chunk of data.\n\tconsole.log(this.source)\n})\n```\n\n## Dependencies\n\n* [glsl-parser](http://stack.gl/packages/#stackgl/glsl-parser) — build glsl AST.\u003cbr/\u003e\n* [glsl-tokenizer](http://stack.gl/packages/#stackgl/glsl-tokenizer) — detect glsl tokens.\u003cbr/\u003e\n\n## Used by\n\n* [nogl-shader-output](https://github.com/dy/nogl-shader-output) — evaluate fragment shader on rectangular vertex input, gl-less.\u003cbr/\u003e\n* [GLSLRun](https://github.com/iY0Yi/GLSLRun) – debug shader via adding `print()` function.\n\n## Similar\n\n* [glsl.js](https://npmjs.org/package/glsl) — an alternative glsl to asm.js compiler by [@devongovett](https://github.com/devongovett), built with [jison](https://npmjs.org/package/jison) instead of glsl-parser. Project is abandoned :(.\u003cbr/\u003e\n* [js2glsl](https://github.com/jdavidberger/js2glsl) — transform js subset to glsl.\u003cbr/\u003e\n* [glsl-simulator](https://github.com/burg/glsl-simulator) — OpenGL1.0 simulation in js.\u003cbr/\u003e\n* [turbo/js](https://github.com/turbo/js) — webgl-based computation.\n* [shaderdsl](https://github.com/adobe-webplatform/shaderdsl)\n* [wgsl_reflect](https://github.com/brendan-duncan/wgsl_reflect)\n* [glm-js](https://github.com/humbletim/glm-js)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstackgl%2Fglsl-transpiler","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fstackgl%2Fglsl-transpiler","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstackgl%2Fglsl-transpiler/lists"}