{"id":28708390,"url":"https://github.com/software-mansion/typegpu","last_synced_at":"2025-06-14T18:11:26.458Z","repository":{"id":256175041,"uuid":"758923102","full_name":"software-mansion/TypeGPU","owner":"software-mansion","description":"TypeScript library that enhances the WebGPU API, allowing resource management in a type-safe, declarative way.","archived":false,"fork":false,"pushed_at":"2025-06-10T09:34:59.000Z","size":89167,"stargazers_count":445,"open_issues_count":79,"forks_count":11,"subscribers_count":7,"default_branch":"main","last_synced_at":"2025-06-10T10:37:51.666Z","etag":null,"topics":["gpgpu","gpu","gpu-computing","gpu-programming","graphics","javascript","typesafe","typescript","webgpu","webgpu-api","wgsl","wgsl-shader"],"latest_commit_sha":null,"homepage":"http://typegpu.com","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/software-mansion.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE.md","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},"funding":{"github":"software-mansion"}},"created_at":"2024-02-17T13:29:14.000Z","updated_at":"2025-06-10T06:17:26.000Z","dependencies_parsed_at":"2024-10-02T06:54:21.352Z","dependency_job_id":"36f3366e-b5e7-4204-8c3c-14d6db68a2da","html_url":"https://github.com/software-mansion/TypeGPU","commit_stats":null,"previous_names":["software-mansion/typegpu","iwoplaza/wigsill"],"tags_count":33,"template":false,"template_full_name":null,"purl":"pkg:github/software-mansion/TypeGPU","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/software-mansion%2FTypeGPU","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/software-mansion%2FTypeGPU/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/software-mansion%2FTypeGPU/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/software-mansion%2FTypeGPU/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/software-mansion","download_url":"https://codeload.github.com/software-mansion/TypeGPU/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/software-mansion%2FTypeGPU/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259860438,"owners_count":22922990,"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":["gpgpu","gpu","gpu-computing","gpu-programming","graphics","javascript","typesafe","typescript","webgpu","webgpu-api","wgsl","wgsl-shader"],"created_at":"2025-06-14T18:11:24.031Z","updated_at":"2025-06-14T18:11:26.401Z","avatar_url":"https://github.com/software-mansion.png","language":"TypeScript","readme":"\u003cdiv align=\"center\"\u003e\n\n![TypeGPU (light mode)](./apps/typegpu-docs/public/typegpu-logo-light.svg#gh-light-mode-only)\n![TypeGPU (dark mode)](./apps/typegpu-docs/public/typegpu-logo-dark.svg#gh-dark-mode-only)\n\n[Website](https://docs.swmansion.com/TypeGPU) —\n[Documentation](https://docs.swmansion.com/TypeGPU/getting-started)\n\n\u003c/div\u003e\n\n**TypeGPU** is a TypeScript library that enhances the WebGPU API, allowing\nresource management in a type-safe, declarative way.\n\n\u003cdiv align=\"center\"\u003e\n\u003cvideo width=\"512\" autoplay muted loop playsinline src=\"https://github.com/user-attachments/assets/5bca716d-477d-44a1-a839-5df0c8d9044c\"\u003e\u003c/video\u003e\n\n\u003c!-- automd:badges color=\"plum\" license name=\"typegpu\" bundlephobia no-npmDownloads --\u003e\n\n[![npm version](https://img.shields.io/npm/v/typegpu?color=plum)](https://npmjs.com/package/typegpu)\n[![bundle size](https://img.shields.io/bundlephobia/minzip/typegpu?color=plum)](https://bundlephobia.com/package/typegpu)\n[![license](https://img.shields.io/github/license/software-mansion/TypeGPU?color=plum)](https://github.com/software-mansion/TypeGPU/blob/main/LICENSE)\n\n\u003c!-- /automd --\u003e\n\n\u003c/div\u003e\n\n\u003cbr\u003e\n\u003cbr\u003e\n\n**Table of contents:**\n\n- [⚙️ TypeGPU as a foundation](#⚙️-typegpu-as-a-foundation)\n- [🧩 TypeGPU as a piece of the puzzle](#🧩-typegpu-as-a-piece-of-the-puzzle)\n- [📚 TypeGPU for libraries](#📚-typegpu-for-libraries)\n- [Documentation](#documentation)\n- [What's next?](#whats-next)\n- [Projects using TypeGPU](#projects-using-typegpu)\n- [Repository structure](#repository-structure)\n\n## ⚙️ TypeGPU as a foundation\n\nWe provide an abstraction that solves the most common WebGPU hurdles, yet does\nnot restrict you in capability. You can granularly eject into vanilla WebGPU at\nany point. This means that, when building your app with TypeGPU, lock-in is not\na concern!\n\nThe low-level nature of TypeGPU and it's mirroring of WGSL (WebGPU Shading\nLanguage) syntax in TypeScript means that learning TypeGPU helps to learn WebGPU\nitself, with fewer frustrations.\n\n[The Getting Started and Fundamentals guides are a great starting point for new projects!](https://docs.swmansion.com/TypeGPU/getting-started/)\n\n## 🧩 TypeGPU as a piece of the puzzle\n\nOur type-safe APIs can be used together, or in isolation. This makes partial\napplication into existing apps just a few lines of code away, no matter the\ncomplexity of your app!\n\n[We wrote a comprehensive resource on ways TypeGPU can improve your existing codebase.](https://docs.swmansion.com/TypeGPU/integration/webgpu-interoperability/)\n\nPick and choose which parts of TypeGPU you'd like to incorporate into your\nexisting app!\n\n## 📚 TypeGPU for libraries\n\nWhen creating a type-safe WebGPU library, one can expect to encounter at least\none of the following problems:\n\n- Serializing/deserializing data.\n- Dynamically generating parts of the WGSL shader.\n- Complex type inference.\n\nIf implemented from scratch, interoperability with other libraries (ones that\nhave a different focus, solve different problems) can be near impossible without\ngoing down to _untyped WebGPU land_, or copying data back to JS. Moreover, to\nkeep up with demand from users, they can be tempted to go out of scope of their\ninitial use-case, even though another library already solves that problem.\n\n\u003e TypeGPU can be used as an interoperability layer between use-case specific\n\u003e libraries!\n\nLet's imagine `@xyz/gen` is a library for procedural generation using WebGPU\ncompute shaders, and `@abc/plot` is a library for plots and visualization using\nWebGPU.\n\n```ts\nimport tgpu from 'typegpu';\nimport gen from '@xyz/gen';\nimport plot from '@abc/plot';\n\n// common root for allocating resources\nconst root = await tgpu.init();\n\nconst terrainBuffer = await gen.generateHeightMap(root, { ... });\n//    ^? TgpuBuffer\u003cWgslArray\u003cWgslArray\u003cF32\u003e\u003e\u003e \u0026 StorageFlag\n\n// ERROR: Argument of type 'TgpuBuffer\u003cWgslArray\u003cWgslArray\u003cF32\u003e\u003e\u003e' is\n// not assignable to parameter of type 'TgpuBuffer\u003cWgslArray\u003cF32\u003e\u003e\u003e'\nplot.array1d(root, terrainBuffer);\n\n// SUCCESS!\nplot.array2d(root, terrainBuffer);\n```\n\nWe can pass typed values around without the need to copy anything back to\nCPU-accessible memory! Let's see an example of how we can construct a type-safe\nAPI:\n\n```ts\nimport type { StorageFlag, TgpuBuffer, TgpuRoot } from 'typegpu';\nimport * as d from 'typegpu/data';\n\n// We can define schemas, or functions that return schemas...\nconst HeightMap = (width: number, height: number) =\u003e\n  d.arrayOf(d.arrayOf(d.f32, height), width);\n\n// ...then infer types from them\ntype HeightMap = ReturnType\u003ctypeof HeightMap\u003e;\n\nexport async function generateHeightMap(\n  root: TgpuRoot,\n  opts: { width: number; height: number },\n): Promise\u003cTgpuBuffer\u003cHeightMap\u003e \u0026 StorageFlag\u003e {\n  const buffer = root\n    .createBuffer(HeightMap(opts.width, opts.height))\n    .$usage('storage');\n\n  const rawBuffer = root.unwrap(buffer); // =\u003e GPUBuffer\n\n  // Here we can do anything we would usually do with a\n  // WebGPU buffer, like populating it in a compute shader.\n  // `rawBuffer` is the WebGPU resource that is backing the\n  // typed `buffer` object, meaning any changes to it will\n  // be visible in both.\n\n  return buffer;\n}\n```\n\n[Planning to create a WebGPU library? Reach out to us!](https://discord.gg/8jpfgDqPcM)\nWe'd love to work with you to enrich the ecosystem with type-safe WebGPU\nutilities!\n\n## Documentation\n\nWe created a set of guides and tutorials to get you up and running fast. Check\nout our [Official Docs](https://docs.swmansion.com/TypeGPU/getting-started)!\n\n## What's next?\n\n- [Join the Software Mansion Community Discord](https://discord.gg/8jpfgDqPcM)\n  to chat about TypeGPU or other Software Mansion libraries.\n\n## Projects using TypeGPU\n\n\u003c!-- automd:file src=\"./projects-using-typegpu.md\" --\u003e\n\n- [Chaos Master](https://chaos-master.vercel.app) by deluksic \u0026 Komediruzecki\n- [Apollonian Circles](https://deluksic.github.io/apollonian-circles/) by\n  deluksic\n- [Strange Forms](https://github.com/loganzartman/strangeforms) by Logan Zartman\n- [WebGPU Stable Fluids](https://github.com/loganzartman/webgpu-stable-fluids)\n  by Logan Zartman\n- [Visual timer: Calm Jar](https://apps.apple.com/us/app/visual-timer-calm-jar/id6741375962)\n  by Nathan Schmidt\n\n\u003c!-- /automd --\u003e\n\n## Repository structure\n\n**Packages:**\n\n- [packages/typegpu](/packages/typegpu) - The core library.\n- [packages/typegpu-color](/packages/typegpu-color) - A set of color helper\n  functions for use in WebGPU/TypeGPU apps.\n- [packages/typegpu-noise](/packages/typegpu-noise) - A set of\n  noise/pseudo-random functions for use in WebGPU/TypeGPU apps.\n\n**Tooling:**\n\n- [packages/unplugin-typegpu](/packages/unplugin-typegpu) - Plugin for your\n  favorite bundler, enabling TypeGPU shader functions to be written in JS.\n- [packages/tgpu-jit](/packages/tgpu-jit) - Just-In-Time transpiler for TypeGPU.\n- [packages/tgpu-gen](/packages/tgpu-gen) - CLI tool for automatic TypeGPU code\n  generation.\n\n**Internals:**\n\n- [packages/tinyest](/packages/tinyest) - Type definitions for a JS embeddable\n  syntax tree.\n- [packages/tinyest-for-wgsl](/packages/tinyest-for-wgsl) - Transforms\n  JavaScript into its _tinyest_ form, to be used in generating equivalent (or\n  close to) WGSL code.\n- [packages/tgpu-wgsl-parser](/packages/tgpu-wgsl-parser) - WGSL code parser.\n- [packages/tgpu-dev-cli](/packages/tgpu-dev-cli) - Development tools for\n  packages in the monorepo.\n\n**Apps**:\n\n- [apps/typegpu-docs](/apps/typegpu-docs) - The documentation, examples and\n  benchmarks webpage.\n- [apps/infra-benchmarks](/apps/infra-benchmarks) - Headless benchmarks.\n\n## TypeGPU is created by Software Mansion\n\n[![swm](https://logo.swmansion.com/logo?color=white\u0026variant=desktop\u0026width=150\u0026tag=typegpu-github 'Software Mansion')](https://swmansion.com)\n\nSince 2012 [Software Mansion](https://swmansion.com) is a software agency with\nexperience in building web and mobile apps. We are Core React Native\nContributors and experts in dealing with all kinds of React Native issues. We\ncan help you build your next dream product –\n[Hire us](https://swmansion.com/contact/projects?utm_source=typegpu\u0026utm_medium=readme).\n\n\u003c!-- automd:contributors author=\"software-mansion\" --\u003e\n\nMade by [@software-mansion](https://github.com/software-mansion) and\n[community](https://github.com/software-mansion/TypeGPU/graphs/contributors) 💛\n\u003cbr\u003e\u003cbr\u003e\n\u003ca href=\"https://github.com/software-mansion/TypeGPU/graphs/contributors\"\u003e\n\u003cimg src=\"https://contrib.rocks/image?repo=software-mansion/TypeGPU\" /\u003e\n\u003c/a\u003e\n\n\u003c!-- /automd --\u003e\n","funding_links":["https://github.com/sponsors/software-mansion"],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsoftware-mansion%2Ftypegpu","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsoftware-mansion%2Ftypegpu","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsoftware-mansion%2Ftypegpu/lists"}