TypeScript on the GPU – Bridging the Gap Between Realms

TypeGPU is a TypeScript toolkit for WebGPU, started by Ivo Plaza around two years ago. It allows developers to write shaders in either JavaScript or TypeScript.

The Jelly Slider example is rendered in real time, responding to user interaction. It can be customized through its API by changing colors and using JavaScript callbacks to adjust visual effects.

No, TypeGPU has a limited JavaScript syntax and functionality to ensure that only relevant shader logic runs on the GPU, providing a closer connection to the platform.

WebGPU is a new web standard that allows browsers to access the user's graphics card, enabling advanced graphics and computations.

No, TypeScript is not required. TypeGPU works with JavaScript as well, although it utilizes TypeScript for end-to-end type safety.

TypeGPU is compatible with various bundlers, including Vite, Rollup, Webpack, ESBuild, and others.

TypeGPU allows console logging on the GPU, which helps in debugging by offering insights into the runtime logic of shaders.

TypeGPU is more low-level than 3JS but can be used to write shader functions in TypeScript that integrate with 3JS objects and scenes. It doesn't directly integrate with React 3 Fiber, which primarily uses WebGL.

While there is no automated tool currently, it is possible to convert GLSL shaders from ShaderToy to TypeGPU manually or with the help of AI tools.

Software Mansion is a software agency that builds React Native apps for businesses and creates and maintains open source libraries in the ecosystem.