What’s the difference for the performance between CSS and webGL to implement 360 video?

Question

From the cobalt document of 360 video, cobalt implements it with CSS, it does not use webGL to implement it, so What’s the difference for the performance between CSS and webGL to implement 360 video? Is there any performance influence with the platform when play 360 video?

Answer 1

CSS Spherical Filter Extension for 360 is known to be better than WebGL 360 in terms of performance.

CSS implementation helps keep JavaScript out of the render thread and leave the 360 related calculations within the browser on a separate thread from the render thread.

WebGL requires JavaScript to render every single frame. It's not easy to guarantee that JavaScript runs quickly while handling other things such as inputs, XHR requests, and such. And that will bring a frame skip.