Headless rendering?

As far as I remember, headless feature is added few month ago.

I just wonder headless feature allows rendering on serverside without actual web browser.

If it does, is there any live example?

Hi @sooyong_Kim,

I think the work that has been done in the engine was to allow it to execute as a Node.js process, with a mock canvas. @will @yaustar may be able to offer more insight.

For rendering actual webpages on a server and extracting data (canvas output, client side JavaScript) etc. I think you can use a framework like this. They support execution of WebGL, so server side rendering should be possible:

Headless rendering is possible. Not sure if we have a project or example kicking around for this.

@slimbuck would have more info on what headless browser we had used before. What @Leonidas linked above might be it

What are you looking to do with headless rendering?

1 Like

I want to render it on the server side and stream out via socket or webrtc.

It should be possible using WebRTC to stream a video track, using the screen share option.

Just make sure you have a capable server and load balancer in place to handle both the resources and the bandwidth required. The networking side can become tricky quickly.

What’s the reason for that? The benefits of PlayCanvas come from being able to render high quality client side. If streaming graphic content like this, arguably you would be better off with Unity or Unreal and take advantage of native engines.

2 Likes

We are making a product configurator whose size is about 150mb or little higher.
Basically, the loading speed is very fine with PC on normal wired network and mobile on 5G network.
The problem is the loading speed on LTE model isn’t quite unreasonable.

So, I’m thinking any access via LTE network will be initially offered streaming result which is already ready on the server side. Meanwhile, the mobile device will download asset in background. Once the download is completed, it will switch to the downloaded assets.

That’s an interesting solution to the loading time problem. Though especially complex to implement.

How much time does loading the assets take on LTE? 30-40 seconds?

Usually informative loading screens, welcome intro, or even a low sized video can help entertain the user while assets are loading. But that may not be a good solution in your case.

1 Like

Yeah, I was wondering how much of the 150 MB you can load ‘just in time’ or on demand as the user needs it so that the user doesn’t have to wait to load it all at once?

Having a streaming server can be pretty expensive too as not only would you need servers that can render the 3D well but also encode the video fast enough and also scales.

1 Like

I would agree on the streaming server costs can go high pretty quickly. I would try to explore the option of delivering resources that are currently required for rendering, instead of pushing the whole thing at once to the client. You could keep pulling resources while idling (e.g. while model is viewed around). Also, unless you target a specific group, 150 Mb can be pretty expensive for some users on a metered data plan.

2 Likes

The loading screen is disappeared once after all the necessary parts, which is marked as “preload”, loaded. So, technically, it doesn’t load all of 150 mb at once. The initial load is about 90mb.

Server cost for other pixel stream platform such as unreal or unity may be quite expensive, but WebGL rendering is a lot lighter than them…so I guess the cost would be relatively cheaper…

If we can use headless chromium engine, then I think multiple accesses can be handled by one chromium instance.

Can anyone share about the live example???

I’m afraid we don’t have an example of this or know of someone that has done this exact use case.

The closest I’ve seen people use PlayCanvas is for a server side rendering of a still/photo.

They used either headless-gl - npm (WebGL 1 support only) or headless Chrome package along side with: Capturing a screenshot | Learn PlayCanvas