Browser rendering for a 3D browser demo: what to check
Check browser GPU acceleration, compare graphics results fairly, and find settings that can slow a 3D browser demo before you present it.
Your 3D browser demo stutters, looks less smooth than expected, or behaves differently on another computer. The cause may be the browser's graphics settings, the device's power mode, or the demo's own workload.
Use the Graphics Test to check graphics performance in the browser, then compare the result with what happens in your demo. The test helps establish a baseline, but it cannot predict the exact frame rate or compatibility of every 3D project.
Check browser graphics performance
- Open the Graphics Test in the same browser you plan to use for the demo. If the demo is meant to run on a particular computer, run the test on that computer too.
- Close demanding apps and extra browser tabs. Keep the test in the foreground, connect a laptop to power if that matches your demo setup, and wait for downloads or updates to finish.
- Run the test and note its score, shading power, and fill rate at 1080p. Those results describe different parts of browser graphics work, so keep the full set rather than recording only the score.
- Run it a second time under the same conditions. If the readings are similar, open your demo in that browser and watch for stutters, slow scene changes, or differences when you resize the window.
For a useful comparison, keep the browser, power state, screen resolution, and demo settings the same. A higher result from a different computer is not automatically proof that the demo will run better there, because the browser and demo may use graphics features differently.
What the result means
The test results are similar each time
Your browser is producing a reasonably repeatable graphics result under those conditions. If the demo still stutters, investigate its scene complexity, browser support, or other work happening while it runs. The test is a general graphics workload, not a measurement of your demo's frame rate.
The result changes a lot between runs
The computer may be busy, switching power modes, or changing performance as it warms up. Close other apps, leave the browser window active, and repeat the test after the device has settled. For more on one cause, see why a GPU benchmark drops in a background tab.
The result is low and the demo also runs poorly
Check whether the browser is using hardware graphics acceleration rather than software rendering. A browser can fall back to software rendering when graphics support is unavailable or blocked. The score alone cannot identify the cause; the browser's graphics status and settings can help narrow it down. See how to check if your browser uses GPU acceleration.
The result looks healthy but the demo is still slow
The demo may be asking for more work than the test. Large textures, many moving objects, shadows, reflections, and high-resolution rendering can all add load. The demo may also rely on a browser feature that is unavailable in your current setup.
How to improve the demo
- Keep the demo in the foreground. Browsers can limit work in background tabs, so leave the demo selected while presenting. Close video playback, large downloads, and other graphics-heavy pages.
- Turn on browser graphics acceleration. In Chrome, open Settings › System and enable Use graphics acceleration when available. In Edge, open Settings › System and performance and enable Use graphics acceleration when available. Restart the browser if it asks you to.
- Check the computer's graphics preference. In Windows 11, open Settings › System › Display › Graphics, select the browser if it is listed, and choose High performance when available. This can help on a computer with more than one graphics processor. macOS does not offer the same per-app graphics preference on every Mac.
- Use a consistent power mode. On Windows 11, open Settings › System › Power & battery and select a performance mode that suits the presentation. On a Mac laptop, open System Settings › Battery and check whether Low Power Mode is on. For a comparison, use the same power mode as the one you will use during the demo.
- Match the display settings to the demo. On Windows 11, check Settings › System › Display. On macOS, check System Settings › Displays. A high display resolution can make the graphics processor draw more pixels. If the demo allows it, try lowering its render resolution or reducing shadows and effects before changing the computer's display resolution.
- Update the browser and graphics driver. Install available browser updates and, on Windows, check for a graphics driver update through your computer maker or graphics hardware provider. Retest after changes so you can see whether performance improved.
What a browser graphics test cannot tell you
The Graphics Test measures browser graphics performance, including shading and fill rate at 1080p. It does not inspect every detail of a 3D application, confirm that a specific graphics feature works, or report your exact GPU temperature. It also cannot tell you whether a stutter comes from the demo's code, a browser limitation, or another app using the computer.
For a fair check, compare the same demo and test conditions on each device. If the test score is steady but the demo remains slow, focus on the demo's graphics options and browser compatibility rather than treating the score as a promised frame rate.
