Skia as a Renderer?

[wcandillon]

Maintainer of React Native Skia here 🙋🏼‍♂️
We expose the Skia API via a neat declarative React renderer.
Think of it as SVG with some features on top of it: shaders, blend modes, and advanced text layouts.

Skia is used in Google Chrome, in fact we sometimes look at blink's source code to get a sense of how some of the CSS features are implemented using Skia.

We've experimented with headless GPU rendering on and it works great. Our use-case was to renderer a Video using React Native Skia but we think that Satori could benefit from such a renderer.

Curious to read your thoughts on this.

[Brooooooklyn]

I'm afraid the size of Skia is too large for edge runtime

[shuding]

React Native Skia looks great, technically Satori can use it as the renderer under the hood to output rasterized results. However, the core idea of Satori is to be a translator between HTML/CSS and SVG as we believe SVG is the ideal output format for Satori's use cases. It's still text, can be displayed in most places, and can be easily converted to other formats. You can think of Satori as a layout system for SVG, and it doesn't involve much image rendering actually.

[wcandillon]

thanks for your answer and sharing the vision. This is very sensible indeed. I was very much focused on all the unsupported capabilities in SVG (blend modes, shaders, advanced gradients) but I understand that you're covering a lot of ground already just with SVG 💯

[wcandillon]

Hope you'll indulge me for still thinking about this.
We now have React Native Skia running without React Native Web as a dependency, and we are building a CanvasKit polyfill to native browser APIs: https://github.com/wcandillon/canvaskit-lite

I am mentioning this because on Node the canvas API has a complete SVG backend, meaning that you can output SVG from React Native Skia but without installing React Native nor Skia.