WebGL.md

• [Google Chrome Help] why is webGL not working!?

• WebGL in Chrome - How to Enable, Disable and Troubleshoot | oTechWorld

• Detect WebGL - Web APIs | MDN

• [GitHub] add-qwq/WebGL-GPU-Detector - Check if the browser is enabled/supports WebGL GPU acceleration (JS component)

  • gpu-detector.js - line 36

    No browser GPU acceleration support detected 😥, which may cause page lag
    
    Please go to browser settings to enable options like
    
    "Use graphics acceleration when available" or "Hardware acceleration"
    
    After enabling, please restart the browser

webgl.utils.ts

/*
  based on:
  https://github.com/add-qwq/WebGL-GPU-Detector/blob/main/gpu-detector.js

  https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/By_example/Detect_WebGL
 */

export const hasWebGLSupport = () => {
  if (!window.WebGLRenderingContext) {
    return false
  }

  let canvas = null

  try {
    canvas = document.createElement('canvas')

    // Get WebGLRenderingContext from canvas element.
    const gl = canvas.getContext('webgl')

    if (!gl) return false

    return gl instanceof WebGLRenderingContext
  } catch (_e) {
    console.error('GPU acceleration detection exception')

    return false
  } finally {
    if (canvas && canvas.parentNode) {
      canvas.parentNode.removeChild(canvas)
    }
  }
}

export default hasWebGLSupport