Skip to content

feat: add WebGPU support detection with fallback UI#3

Open
ziluroxyhe wants to merge 1 commit into
cortiz2894:mainfrom
ziluroxyhe:feat/webgpu-detection
Open

feat: add WebGPU support detection with fallback UI#3
ziluroxyhe wants to merge 1 commit into
cortiz2894:mainfrom
ziluroxyhe:feat/webgpu-detection

Conversation

@ziluroxyhe
Copy link
Copy Markdown

Problem

When WebGPU is not available, the canvas initialisation fails silently
and the user sees a completely blank screen with no explanation.

Solution

Detect navigator.gpu via a useState initialiser (runs synchronously,
no flash). If unsupported, render a styled fallback that:

  • Tells the user what's missing
  • Recommends Chrome 113+ / Edge 113+
  • Links to webgpureport.org

The early return is placed after all hooks to comply with React's
Rules of Hooks.

Show a friendly error screen instead of a blank canvas when the
browser does not support WebGPU. Checked via navigator.gpu before
attempting renderer initialisation.

- Unsupported browsers see a centred message with browser recommendations
- Links to webgpureport.org for the user to verify their setup
- useState initialiser runs synchronously so no flash of blank content
- Early return is placed after all hooks to comply with Rules of Hooks
@vercel
Copy link
Copy Markdown

vercel Bot commented May 26, 2026

@ziiiiiiilu0907-ai is attempting to deploy a commit to the cortiz2894's projects Team on Vercel.

A member of the Team first needs to authorize it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants