{"id":24830401,"url":"https://github.com/gnlow/lilgpu","last_synced_at":"2026-03-10T02:04:33.742Z","repository":{"id":273284428,"uuid":"919204091","full_name":"gnlow/lilgpu","owner":"gnlow","description":"Lil wrapper to toy with WebGPU, powered by TypeGPU","archived":false,"fork":false,"pushed_at":"2025-05-29T10:57:02.000Z","size":43,"stargazers_count":4,"open_issues_count":1,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-07-15T22:14:34.693Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"TypeScript","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/gnlow.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,"zenodo":null}},"created_at":"2025-01-20T00:18:43.000Z","updated_at":"2025-05-29T10:57:06.000Z","dependencies_parsed_at":"2025-01-20T01:28:23.932Z","dependency_job_id":"e9f056f9-6405-4c40-aec5-2724b20b9664","html_url":"https://github.com/gnlow/lilgpu","commit_stats":null,"previous_names":["gnlow/lilgpu"],"tags_count":6,"template":false,"template_full_name":null,"purl":"pkg:github/gnlow/lilgpu","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gnlow%2Flilgpu","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gnlow%2Flilgpu/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gnlow%2Flilgpu/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gnlow%2Flilgpu/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/gnlow","download_url":"https://codeload.github.com/gnlow/lilgpu/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gnlow%2Flilgpu/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30322638,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-10T01:36:58.598Z","status":"online","status_checked_at":"2026-03-10T02:00:06.579Z","response_time":106,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":"2025-01-30T23:50:05.745Z","updated_at":"2026-03-10T02:04:28.732Z","avatar_url":"https://github.com/gnlow.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# lilgpu\nLil wrapper to toy with WebGPU\n```ts\nimport { d, Lil, uniform } from \"https://esm.sh/gh/gnlow/lilgpu/browser.ts\"\n\nclass MyProgram extends Lil {\n    vertShader = `... GLSL code ...`\n    fragShader = `... GLSL code ...`\n\n    @uniform(d.struct({\n        x: d.u32,\n        y: d.u32,\n    }))\n    accessor span = { x: 10, y: 20 }\n\n    @uniform(d.f32)\n    accessor blue = 0.5\n}\nconst app = new MyProgram()\nconst g = await app.init(document.querySelector(\"canvas\")!)\ng.draw(4 /* The number of vertices */)\n\nconst tick = () =\u003e new Promise(requestAnimationFrame)\n\nwhile (true) {\n    await tick()\n    basic.blue = Math.sin(Date.now()/1000)/2+0.5\n    g.draw(4)\n}\n```\n- Tested on Chromium and Deno (+ Jupyter)\n- Not production-ready\n- Currently type checking is limited due to TypeScript not supporting decorator mutation ([microsoft/TypeScript#4881](https://github.com/microsoft/TypeScript/issues/4881))\n\n## Usage\nSee [more examples](./example).  \nBelow is from [./example/browser/Basic.ts](./example/browser/Basic.ts).  \nRun [this](https://esm.sh/gh/gnlow/lilgpu@bd48c76/example/browser/Basic.html) on your browser.\n\n### Import\n\n#### Browser\n```js\nimport { d, Lil, uniform } from \"https://esm.sh/gh/gnlow/lilgpu/browser.ts\"\n```\n\n#### Deno\n```js\nimport { d, Lil, uniform } from \"https://denopkg.com/gnlow/lilgpu/deno.ts\"\n```\n\n### Define\n\n#### Shader\n```js\nconst vertShader = ` ... `\nconst fragShader = ` ... `\n```\n\n\u003cdetails\u003e\n\u003csummary\u003eActual Shader code\u003c/summary\u003e\n\n```js\nconst vertShader = `\nstruct Output {\n    @builtin(position) pos: vec4f,\n    @location(0) uv: vec2f,\n}\n\n@vertex\nfn main(\n    @builtin(vertex_index) vertexIndex: u32,\n) -\u003e Output {\n    var pos = array\u003cvec2f, 4\u003e(\n        vec2(1, 1), // top-right\n        vec2(-1, 1), // top-left\n        vec2(1, -1), // bottom-right\n        vec2(-1, -1) // bottom-left\n    );\n    var uv = array\u003cvec2f, 4\u003e(\n        vec2(1., 1.), // top-right\n        vec2(0., 1.), // top-left\n        vec2(1., 0.), // bottom-right\n        vec2(0., 0.) // bottom-left\n    );\n    var out: Output;\n    out.pos = vec4f(pos[vertexIndex], 0.0, 1.0);\n    out.uv = uv[vertexIndex];\n    return out;\n}\n`\nconst fragShader = `\n@fragment\nfn main(\n    @location(0) uv: vec2f,\n) -\u003e @location(0) vec4f {\n    let red = floor(uv.x * f32(span.x)) / f32(span.x);\n    let green = floor(uv.y * f32(span.y)) / f32(span.y);\n    return vec4(red, green, blue, 1.0);\n}\n`\n```\n\n\u003c/details\u003e\n\n#### Uniform Buffer\n```ts\nclass Basic extends Lil {\n    vertShader = vertShader\n    fragShader = fragShader\n\n    @uniform(d.struct({\n        x: d.u32,\n        y: d.u32,\n    }))\n    accessor span = { x: 10, y: 20 }\n\n    @uniform(d.f32)\n    accessor blue = 0.5\n}\n```\n\n### Draw\n\n#### Browser\n```ts\nconst basic = new Basic()\nconst g = await basic.init(document.querySelector(\"canvas\")!)\n\ng.draw(4)\n```\n\n##### Browser - Animate\n```ts\nconst tick = () =\u003e new Promise(requestAnimationFrame)\n\nwhile (true) {\n    await tick()\n    basic.blue = Math.sin(Date.now()/1000)/2+0.5\n    g.draw(4)\n}\n```\n\n\n#### Deno\n```ts\nconst basic = new Basic()\nconst g = await basic.init(500, 300)\n\ng.draw(4)\n\nconst image = await g.getImage() // Uint8Array\nawait Deno.writeFile(\"./Basic.png\", image)\n```\n\n##### Deno - Jupyter\n```ts\nimage\n```\n![](./example/deno/Basic.png)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgnlow%2Flilgpu","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgnlow%2Flilgpu","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgnlow%2Flilgpu/lists"}