GPU 与 WebGL 能力检测
读出浏览器眼里的显卡身份、WebGL 版本和各项硬上限。想知道为什么某个网页特效跑不动，从这里开始查。
设备身份 检测中
能力上限
没有读到纹理尺寸上限。
这些数字是驱动声明的硬上限，不是当前页面的实际用量。纹理尺寸决定单张图能不能直接上传；顶点属性数决定一个网格能挂多少组数据；uniform 数量决定着色器能写多复杂。做跨设备兼容时，以这些下限里最低的一档为准。
这些数字怎么来的
WebGL 的上下文由浏览器创建，创建时驱动会报出一组「我最多能做什么」。页面读的就是这组上限：最大纹理尺寸、顶点属性数量、uniform 向量数量等等。它们是硬上限而不是当前用量，所以数字大不代表页面跑得快——真正影响帧率的是填充率、绘制调用次数和着色器复杂度，这些在 WebGL 里没有接口能直接读。
渲染器字符串有两套。默认的 VENDOR / RENDERER 是脱敏后的通用值，通常只说「WebKit WebGL」；真实型号藏在 WEBGL_debug_renderer_info 扩展里，而且浏览器可以随时关掉它。这就是为什么同一个页面在不同浏览器里，一个能显示 RTX 3060，另一个只显示「读不到」。这不是检测逻辑的问题，是隐私策略的差异。
软件渲染是最值得注意的信号。看到 SwiftShader、llvmpipe、Basic Render 这类名字，说明图形计算全压在 CPU 上：网页能显示，但滚动、Canvas 动画、视频解码都会明显变慢，风扇也会转起来。常见原因是浏览器关闭了硬件加速、显卡驱动崩溃后被系统禁用，或者运行在虚拟机、远程桌面里。重新打开硬件加速并重启浏览器，通常能恢复。
浮点纹理的检测要连着看两件事：扩展存不存在，以及创建纹理时有没有报错。扩展声明支持只说明「这个格式可能可用」，真正能不能拿它当渲染目标还要看 framebuffer 组合。页面只做了第一步验证，够用来判断基础可用性；如果你的项目依赖 HDR 后处理，还需要在目标设备上跑一遍完整的渲染管线测试。
想测浏览器整体的计算性能，用浏览器性能跑分；想确认屏幕本身有没有坏点、色彩是否准确，用屏幕测试；怀疑是字体渲染问题，可以先用本机字体检测看字体有没有装全。
常见问题
为什么显卡型号显示成「WebKit WebGL」或「读不到」？
浏览器默认隐藏真实渲染器字符串，因为它能用来给设备打指纹。Chrome 系需要启用 WEBGL_debug_renderer_info 扩展才拿得到，部分版本还要求站点是 https；Safari 和 Firefox 的隐藏策略更严格，有时干脆给一个通用名字。读不到不影响使用，只是无法告诉你是哪块卡。
怎么判断浏览器有没有开启硬件加速？
看渲染器字符串里有没有 SwiftShader、llvmpipe、Basic Render 这类软件渲染的名字，或者页面直接给出「软件渲染」的提示。软件渲染意味着所有图形计算都压给 CPU，滚动和动画会明显变慢。Chrome 可以在设置里搜「硬件加速」重新打开，改完要重启浏览器。
最大纹理尺寸越大越好吗？
对网页开发来说，够用就行。4096 是十多年前的老基线，8192 是近十年的常见水平，16384 属于比较新的显卡。它影响的是单张图能不能直接上传成纹理：超过上限就必须切块，或者先降采样。日常网页里很少需要 16K 的纹理。
扩展数量多说明显卡好吗？
不能直接这么看。扩展数量主要反映驱动和 API 版本，同一块卡在不同浏览器、不同驱动版本下扩展列表都不一样。真正影响能力的是几个关键扩展，比如浮点纹理、深度纹理、各向异性过滤，其余大量扩展是历史遗留和厂商私有项。
WebGL 2 和 WebGL 1 有什么区别？
WebGL 2 基于 OpenGL ES 3.0，多了实例化渲染、多重渲染目标、3D 纹理、统一的整数运算等能力，很多现代图形效果在 WebGL 1 里要靠扩展拼出来。它向下兼容 WebGL 1 的着色器语法，但写新项目时优先用 WebGL 2，不支持再降级。
WebGPU 显示不可用，是显卡太老吗？
不一定。WebGPU 需要浏览器版本、操作系统和显卡驱动三者同时支持：Chrome 在 Windows 上要求较新的驱动，Linux 上通常要手动开启，Safari 从 18 开始才默认启用。显卡本身支持但驱动太旧，也会拿不到适配器。
为什么同一台机器在 Chrome 和 Firefox 里的上限不一样？
两家的图形后端不同。Chrome 在 Windows 上走 ANGLE 转 Direct3D，Firefox 可能走 OpenGL 或原生 D3D，中间层的实现差异会体现在纹理上限、扩展列表和着色器版本上。比较设备性能时应该固定用同一个浏览器。