Device: Lenovo 300e Chromebook Gen3
GPU: ARM Mali-G72 (MediaTek MT8183)
OS: ChromeOS
Browser: Chrome (latest)
Problem
Every Shapespark scene shows a completely black screen on this device. No matter how simple the scene is, it never renders.
Other WebGL viewers (such as a simple VRM / three.js-based viewer) work fine on the same device, so WebGL itself is functional.
chrome://gpu shows:
- WebGL: Hardware accelerated
- WebGPU: Hardware accelerated
Errors in Console
Opening DevTools (F12) while the black screen is shown reveals the following errors:
Error 1 (appears first):
Failed to bind uniform block: CameraObjectBlock for material: <unnamed material>
setProgramBindings @ walk.min.js:9330
Error 2 (repeated multiple times after Error 1):
[.WebGL-0x31b4001aba00] GL_INVALID_OPERATION: glDrawElements:
It is undefined behaviour to use a uniform buffer that is too small.
Analysis
The root cause appears to be in setProgramBindings (walk.min.js:9330): the CameraObjectBlock uniform buffer object (UBO) is failing to bind, likely because the buffer allocated is smaller than what the Mali GPU driver strictly requires.
Desktop GPUs (NVIDIA, Intel, AMD) silently tolerate undersized UBOs, so this issue only surfaces on ARM Mali hardware where the driver strictly enforces the WebGL2/GLSL ES 3.0 specification.
Possible causes:
- The
CameraObjectBlockUBO size is not padded to the requiredMIN_PROGRAM_TEXEL_OFFSET/ std140 alignment boundary on Mali - The binding index for
CameraObjectBlockis not being found/matched correctly on Mali’s GLSL compiler
Request
Could you check the setProgramBindings function and the allocation size of CameraObjectBlock? Ensuring the UBO is sized and aligned to std140 layout rules strictly should resolve the issue on Mali GPUs.
A fix here would benefit all users on ARM Chromebooks and Mali-based Android devices.
Thank you!