HoverFit: Gamifying Fitness in WebXR
- Part 1: Technology
Discover how The Fitness Resort leveraged Wonderland Engine to create HoverFit, overcoming Unity’s web performance limitations.
Technical Challenges with Unity Web
WebXR applications demand high-performance rendering, low latency, and seamless interactivity, but existing web engines were not built with these priorities in mind.
Unity Web Performance
When The Fitness Resort team started developing their VR skiing trainer with Unity HTML5 (web) export, they quickly ran into major performance and workflow bottlenecks:
Long iteration times – To test in the browser, they had to wait excruciating 15 minutes or more, making the development workflow incredibly inefficient, as the preview can not run JavaScript code for the Unity HTML5 platform.
Slow WebGL performance – Even with lots of manual optimizations, their Unity WebGL build suffered from insufficient performance to achieve all the critical game features. Due to the low performance, they could not enable anti-aliasing which heavily impacted the visual quality in VR, where small head movements make crawling aliased lines very apparent. Unity simply could not deliver enough processing power to deliver even the minimal prototype of the Ski experience.
Limited shader and lighting capabilities – High-quality visuals required real-time lighting and complex shaders, but Unity’s web export could not handle them efficiently.
Massive file sizes and long load times – The Unity web build led to excessively large file sizes, with even an empty starter project requiring a 25+ MB download. Unity is designed for native platforms like Steam, Consoles or the App Stores, where users are accustomed to fully preloading the apps during installation. On the web, users expect the app to be streamed on demand.
From Idea to Reality: Building a Web-Based VR Fitness Platform
Hoverfit founder Tim Dudgeon.
VR fitness is evolving fast, but building a VR fitness platform that runs entirely on the web? That was uncharted territory.
In 2020, The Fitness Resort founders Yin-Chien “Yinch” Yeap and Tim Dudgeon, a former Olympic skier, set out to explore the possibilities of WebXR. Their vision was ambitious: to develop a VR skiing trainer that would run entirely in a web browser – while delivering the same performance and visual fidelity as a native XR application.
After successfully developing Ski Fit 365 using Wonderland Engine, they saw the potential to go beyond skiing. For Tim, this vision was deeply personal - as a professional athlete, he knew how tedious traditional gym workouts could be. They decided to take it to the next level and to develop HoverFit, a next-generation WebXR fitness platform. With multiplayer support, diverse virtual worlds, and integrated health tracking, HoverFit gamifies fitness, transforming workouts into an experience people genuinely enjoy.
Why the Web? Freedom, Flexibility, and Future-Proofing.
Hoverfit founder Yin-Chien “Yinch” Yeap.
I consider myself a big-picture developer. From that perspective, I strongly believe that the web with its open standards and open platforms drives the true growth of XR as an emerging ecosystem.
— Yin-Chien Yeap
In a space like XR, where best practices are still taking shape, developers need the freedom to iterate quickly and experiment without restrictions. Closed platforms introduce high costs and artificial barriers, making innovation harder. The web allowed Yinch and his team to deploy instantly, update freely, and stay in full creative control - without being restricted by a large company’s approval process.
Future-proofing was another key factor. New VR hardware is constantly being released. With a native application, every new headset means another SDK to integrate and maintain compatibility with. In contrast, WebXR applications are immediately accessible on new devices as long as they support a browser.
A great example of this is Android XR. When Meta and Google announced Android XR support, many native developers immediately faced the question:
How do we port our apps to this new ecosystem?
For WebXR developers, the response was much simpler:
Just give us a browser, and we are ready to go!
That kind of freedom, flexibility, and future-proofing is why Yinch and Tim chose WebXR over a native approach.
Overcoming Performance Bottlenecks: Switching From Unity to Wonderland Engine
As a Unity developer, Yinch naturally chose Unity for Ski Fit 365. However, they quickly encountered critical performance bottlenecks, as Unity’s web export pipeline struggled to meet their performance requirements. Despite extensive optimization efforts, they hit a ceiling before reaching their design goals, leaving them with no choice but to explore alternative solutions.
While searching for solutions and discussing the challenges on the WebXR Discord server, Jonathan Hale from Wonderland Engine suggested trying Wonderland Engine, which was designed to solve exactly these problems.
Initially, Yinch was hesitant - Unity was familiar, and switching engines meant starting over from scratch. But as performance issues persisted, it became clear that Unity simply could not meet their needs.
They made the switch. Rebuilding SkiFit 365 with Wonderland Engine resulted in a dramatic performance boost, allowing them to deliver a high-quality WebXR experience without the technical bottlenecks they faced before.
The Only 3D Engine Optimized for Web.
Beyond Unity, Yinch also experimented with A-Frame and PlayCanvas. While he thinks that PlayCanvas is a solid WebGL framework for certain use cases, he sees it fundamentally as a WebGL editor rather than a WebXR-first engine. That distinction grew increasingly important as they refined their project’s requirements:
WebXR frameworks are built on top of WebGL, and WebXR functionality is often added as an afterthought rather than being a priority of the engine. Rather than optimizing for WebGL, WebGL is seen as a limitation. Wonderland Engine is different - it is built from the ground up for browser-based 3D rendering. This approach makes Wonderland Engine the only game engine truly optimized for large-scale 3D Web and WebXR projects with high rendering demands.
Rapid iteration times – When the engine packages directly into the browser in less than a second, the packaged application becomes the preview and all code is directly run in the browser. That eliminates performance, visual and JavaScript runtime differences.
Optimized WebGL performance – Wonderland Engine’s WebGL renderer is tailored to the performance characteristics of the web. It batches even thousands of dynamic objects into a single draw call per shader type, resulting in a handful of draw calls per scene.
Dynamic Lighting – Due to its radical draw-call optimizations, Wonderland Engine can render many dynamic lights even with real-time shadows in WebXR.
Fast Loading Times – With its custom designed binary file format that can be streamed over the web, similar to how you wouldn’t pre-load an entire video library to watch a video on your favorite streaming platform. Wonderland Engine loads even complex scenes in seconds as it maps its files directly into WebAssembly memory, instead of parsing a text-based format like JSON or XML. Resources like animations, textures and meshes are compressed for web transmission by default.
Wonderland Engine was the only development tool with which they could meet all the requirements of HoverFit:
- Rendering a million+ triangles in real-time on Meta Quest
- Dynamic real-time lighting
- At least 60 fps on Quest 2 and 72 fps on Quest 3/Quest 3s
- High-quality shaders
- Fully skinned and customizable avatars
- Multiplayer support
- Voice chat integration