# r3f-webgpu-perf

> Performance monitor for React Three Fiber · 2026 · Components, WebGPU

Canonical page: https://andersonmancini.dev/projects/r3f-webgpu-perf

**r3f-webgpu-perf** is a lightweight performance panel for **React Three Fiber** — built for R3F 8+ and designed to work with both **WebGPU** and **WebGL**, including setups where `gl.info` is unavailable.

Drop `<Perf />` into any Canvas and get real-time FPS, GPU/CPU timing, draw calls, geometries, textures, and an optional VRAM estimate — with light/dark themes, a compact or expanded view, and a minimize-to-dot mode that stays out of the way.

Inspired by r3f-perf, with a modern UI for developers and technical artists who need clarity while iterating on WebGPU scenes.

## Technical details

- React Three Fiber
- WebGPU
- WebGL
- Performance Monitor
- FPS & GPU Timing
- Draw Calls
- VRAM Estimate

## Links

- [Open the live project](https://r3f-webgpu-perf.vercel.app)
- [Source code on GitHub](https://github.com/ektogamat/r3f-webgpu-perf)

## More projects

- Previous in Components: [r3f-webgpu-text](https://andersonmancini.dev/projects/r3f-webgpu-text.md)
- Next in Components: [Octahedral Impostors](https://andersonmancini.dev/projects/octahedral-impostors.md)