Hacker News new | ask | show | jobs
Vercel OG Image Generation: Fast, dynamic social card images at the Edge (vercel.com)
38 points by pzrsa 1346 days ago
3 comments
MaxLeiter 1346 days ago
I had the chance to work with Vercel OG / Satori a little while ago for Vercel's Next.js conference. I expected the OG cards for our word game to take hours, but it took minutes instead. Huge productivity boost.

You can try the playground with examples here: https://og-playground.vercel.app/

link
steventey 1346 days ago
this is a gamechanger! also https://github.com/vercel/satori is such a good name!
link
alvarlagerlof 1346 days ago
There's my library for generating og:images statically pretty much dead. I was always wondering why Vercel didn't do this.
link
lloydatkinson 1346 days ago
Well it won't be dead. The vercel one seems to only support running on vercel.
link
alvarlagerlof 1345 days ago
They also have satori, which will run anywhere it seems.
link
lloydatkinson 1345 days ago
That seems to generate svgs which as far as I know no site will show og embeds with svgs for some reason
link
shuding 1344 days ago
There are already a lot of choices to convert SVGs to PNGs, what Vercel uses is https://github.com/yisibl/resvg-js. And Sharp is another good option.
link
pzrsa 1345 days ago
I use svgs for my websites og images, haven't come across an issue with embeds on most platforms.
link
pzrsa 1346 days ago
Care to share it? Curious to see your approach
link
alvarlagerlof 1345 days ago
Sure. This is what I did first. https://github.com/alvarlagerlof/next-banner. Its using one puppeteer process at build, for static sites. Made for Next.js.

However I was working on another version, which just reads html files for metadata instead. Not really shareable and working, built it's using vite to build a few different frameworks. https://github.com/alvarlagerlof/ogimage

link