image_generator

Dependency

Satori

  • Satori convert HTML to SVG, automatically wrap text and using Yoga Layout under the hood.
  • Satori-html convert HTML to React Node, this is because Satori only support React node object at least on Node.js.
  • Resvg-js convert SVG to PNG, Rust-Node binding for github.com/RazrFalcon/resvg.
  • Victor mono is font that we will use because Satori need at least 1 font as default font.

Puppeteer

Flow

Satori

HTML -> Satori -> Resvg -> PNG

Puppeteer

HTML -> Screenshot (Puppeteer) -> PNG

How to use

node satori/main.mjs
node puppeteer/main.mjs