Introducing Web3DSurvey: Tracking WebGL and WebGPU Capabilities
By Ben Houston, 2024-09-01
For those of us working in 3D web graphics, it’s always been a challenge to keep up with what features are supported across the wide range of devices and browsers users bring to the table. Whether you’re building a game, simulation, or immersive experience, knowing which WebGL and WebGPU extensions are actually usable is critical.
Back in the day, I relied heavily on WebGLStats.com, but that site went offline and left a pretty big hole. After that, there wasn't an easy way to get aggregated insights on web graphics capabilities. So a couple of years ago, I decided to fill that gap myself with Web3DSurvey.com.
What is Web3DSurvey?
Web3DSurvey is a tool for developers to track which WebGL, WebGL2, and WebGPU features are supported across real-world devices and browsers. It collects information about the capabilities and extensions your users’ hardware supports, aggregates that data, and provides insights that can help you make better decisions about which technologies are safe to rely on.
How Web3DSurvey Works
The architecture of Web3DSurvey is intentionally lightweight and cost-effective, but still handles a surprisingly large amount of traffic:
-
Data Collection: The tool uses a tiny 3K JavaScript file that you can embed on your website via an iframe for security. This script collects data about users' graphics capabilities—specifically WebGL, WebGL2, and WebGPU. Data is already being collected from several prominent 3D community websites, including Three.js, Model-Viewer, and even the Khronos Group, which ensures that the data is relevant and reflective of current technology trends.
-
Data Storage: The collected data is stored in Google BigQuery, making it available for detailed analysis later.
-
Aggregation and Caching: Every 24 hours, the site aggregates the past two weeks’ worth of data from BigQuery, averaging it out and caching the result in Google Data Store. This ensures fast load times on the front end.
-
Website: The website written using the Remix framework and is fully server side rendered using the aggregated and cached data.
-
Running Costs: All of this is hosted on Google Cloud Run, handling an average of 1 request per second. Despite this traffic, the total monthly cost remains at just $5, which shows the power of modern cloud infrastructure when combined with efficient design.
-
Written in TypeScript: The entire project is written in TypeScript, running on Node.js, which makes it easy to maintain and scale.
Web3DSurvey is about giving 3D web developers a tool to understand what works in the real world, without needing to rely on guesswork or outdated assumptions.
How to Use Web3DSurvey
If you're developing anything 3D on the web—whether it's a game, a simulation, or an art project—Web3DSurvey can help you decide which technologies to lean on. By embedding the provided JavaScript snippet on your website, you’ll start contributing to the survey, and in turn, get access to the aggregated statistics collected by others.
The more developers that participate, the more valuable and reliable the dataset becomes for everyone. Head over to Web3DSurvey.com to check out the stats or add your site to the mix.
Is the Data Representative?
It’s important to note that while Web3DSurvey collects data from a wide range of sites, it isn’t fully representative of all users on the web. The data is primarily based on visitors to tech-focused websites like Three.js and Khronos, which means it likely overestimates the prevalence of support for some 3D web features. However, this is still far better than relying on anecdotal evidence or guesswork, and it provides useful insights into trends in the 3D web development community.
Release Announcements
The release of Web3DSurvey has already sparked a lot of discussion online, particularly among 3D developers. Here were the initial announcements: