01

Key Insights

TypeGPU is a type-safe layer built on top of WebGPU, and the two deliver exactly the same GPU execution performance — because TypeGPU compiles TypeScript to WGSL at build time and calls the native WebGPU API directly at runtime. The real differences show up in development efficiency, type safety, and memory layout management. Every demo on this page runs live in the browser; drag the sliders and switch modes to verify it yourself.

Key insight: GPU execution performance is exactly the same for both; the differences lie in development efficiency, type safety, and memory layout management.
50,000
5x
Demo mode
Live Rendering Comparison LIVE GPU
Native WebGPU Hand-written WGSL + manual layout
60
FPS
0.8
GPU time
ms / frame
2.1
CPU cost
ms / frame
12
VRAM usage
MB
TypeGPU TypeScript + automatic layout
60
FPS
0.8
GPU time
ms / frame
0.4
CPU cost
ms / frame
12
VRAM usage
MB

Memory Layout Comparison INTERACTIVE

Click the buttons to change the struct field order and see how error-prone manual layout is. A vec3f actually occupies 16 bytes (including 4 bytes of padding)!

WebGPU: offsets computed by hand
position (vec3f)
color (vec3f)
velocity (vec2f)
padding (wasted)
TypeGPU: declarative automatic layout
position (vec3f)
color (vec3f)
velocity (vec2f)
padding (auto-optimized)
The layout is always correct! TypeGPU's typed-binary computes every offset, stride, and piece of padding automatically, and the WGSL struct definition is generated in sync. Change the Schema in one place and the whole project updates automatically.

Live Code Complexity Comparison INTERACTIVE

Same functionality: native WebGPU takes about 142 lines of effective code, TypeGPU about 48. Switch tabs to compare how the shader, pipeline setup, and memory layout are written.

WebGPU implementation ~142 lines of effective code
TypeGPU implementation ~48 lines of effective code

GPU Execution Performance History (proving both perform identically) LIVE

As the particle count grows, the GPU execution time curves of WebGPU and TypeGPU overlap perfectly, proving that TypeGPU's runtime performance is identical to native WebGPU's. The only difference shows up in CPU-side development efficiency.


Core Conclusions

GPU performance: exactly identical

TypeGPU compiles TypeScript to WGSL at build time and calls the native WebGPU API directly at runtime. GPU execution performance is exactly the same as native WebGPU, with zero extra overhead. The two overlapping curves in the chart above prove it.

Type safety: caught at compile time

TypeGPU eliminates the type gap between JS and WGSL. Buffer types, shader parameters, and memory layout are validated at compile time, so errors are caught while you write code — instead of surfacing at runtime as strange visual glitches.

Development efficiency: 3x faster

For the same functionality, TypeGPU cuts the amount of code by over 60%. No offsets to compute by hand, no WGSL strings to maintain, no memory-alignment traps to worry about. Any TypeScript developer on the team can take part in GPU programming.