CloudRendering:AnAlternativetoWebGLontheRise
This article first appeared in a slightly modified form on PAGE Online. Here is the original article.
Remember the days when we stored all our data on USB sticks, external hard drives, and even CDs, yes CDs! A lot of time was spent organizing and copying files, as well as creating endless backups. The concept of the cloud is sustainably changing this paradigm by taking over this tedious work for us. And it does so in a time-saving and cost-effective manner.
Today, the cloud is on the verge of transforming another area: real-time rendering. Compared to the "classic" method of creating computer-generated images in real-time on the GPU of a desktop PC or mobile device, cloud streaming or pixel streaming describes a technique that provides each user with a powerful remote machine and calculates photorealistic, high-quality images in the cloud. The final images are then streamed in real-time to the user's hardware. User input is sent back to the application in the cloud.
But how mature is this technology now? Can it replace real-time rendering with WebGL in the browser? It's worth taking a look behind the scenes.
Cloud Rendering Sets New Quality Standards
Let's start with the biggest advantage of cloud rendering over WebGL: quality! With WebGL, two factors limit the achievable graphical performance. On one hand, the graphics API supported by the browser is limited to a specific set of functions. Some truly amazing graphic effects, typically found in triple-A games, cannot be realized in the browser. Additionally, you usually want to make the web application accessible to a broader audience and support a variety of devices and browsers (desktop and mobile). Furthermore, the computing power of the end device limits the possible effects and the complexity of the scene.
As a digital agency in the field of Creative Technologies, we have frequently used WebGL in our web experiences in recent years. Since we have many experts in real-time graphics and shader programming in-house, we have succeeded in achieving high-quality WebGL experiences for our clients' products. A good reference for these projects are our high-end product configurators, such as for Helmade and Smart. Achieving this photorealistic look in a web environment requires a lot of research, effort, and fine-tuning.
Here is a comparison between WebGL and cloud streaming in Unity. The top example is rendered in WebGL on the graphics card, the bottom as a stream in the cloud.
The streaming player can be easily embedded into any website. The client browser establishes a connection with the streaming server via WebSocket to exchange data in both directions.
An example here could be the interface of a car configurator, which is initially implemented with web technologies and then presented in high quality in a streaming view. This creates a seamless user journey where users might not even realize that the beautiful images are generated in the cloud and not on their own hardware.
5G as a Game Changer
We now know that the quality of the WebGL experience depends on the hardware of the end device. Cloud rendering shifts this bottleneck to the available internet connection. This is particularly interesting when addressing many mobile users. Smartphones or tablets generally do not have sufficient GPUs to render beautiful WebGL images, but they do have fast internet connections via WiFi and mobile networks. This advantage will be further enhanced in the coming years with the broader availability of 5G. For an optimal user experience, hosting providers recommend a minimum download speed of 15 Mbps, an upload speed of 5 Mbps, and a latency of 70 ms (Source: Link).
Developers should try to reduce the perceptibility of latency by designing applications in a certain way. Product configurators that, for example, use a revolving camera are less affected by slightly less responsive interaction than games with a first-person camera.
The data to be transmitted can also be reduced by limiting the resolution of the render view. This can be integrated into a smaller window on the page via a so-called iframe.
Costly Streaming Luxury
Ensuring identical high computing power in the cloud for every user at the same time sounds very expensive, doesn't it? And it is! Hosting providers charge about 5 cents per minute of streaming per user.
Want a calculation example? Let's assume a microsite that is online for a month and has a total of 150,000 users, each spending three minutes on the platform. The hosting costs for a single month would amount to a whopping €22,500.
The pricing structure definitely limits the number of use cases for cloud streaming. For a short campaign website with a limited number of expected users, it might be more interesting than for a longer-term online showcase. Another exciting use case could be a personalized microsite for customers of an expensive car or interested buyers of a high-priced villa. If companies expect people to pay a lot of money for something, they might also be interested in presenting the product or a building in a realistic and engaging way. This makes customizing and configuring a fun and special experience. Even one-day virtual events, conferences, or shows with a limited number of participants could benefit from cloud streaming.
Cloud Rendering - The Beginning Has Been Made
Cloud rendering thus has enormous potential to change the possibilities of real-time rendering in the web context. A good example of a streamed experience is the video game produced by Balenciaga with a lot of media hype. Unfortunately, the website is no longer online (note the section on pricing 😉), but a video of it can be seen at this link. A gaming experience with this visual quality and level of detail would simply not be feasible in WebGL. Another good example is the Pagani car configurator. Since hypercars cost a small fortune, it is very important for potential buyers to see what quality they are getting for their money.
At this point, the price and latency aspects still limit the use cases and the design of the experiences. Increasing machine performance, reduced hosting costs, and the broader availability of 5G in the near future make cloud rendering with the Unity or Unreal Engine an even more relevant alternative to WebGL. With this outlook in mind, technology agencies and companies should already be engaging with cloud rendering today, as it will sustainably change the way we consume real-time graphics on the web.