resvg-js
satori-html
resvg-js | satori-html | |
---|---|---|
3 | 2 | |
1,414 | 252 | |
- | - | |
8.3 | 0.0 | |
21 days ago | 4 months ago | |
TypeScript | TypeScript | |
Mozilla Public License 2.0 | - |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
resvg-js
-
Dynamic OG image with SvelteKit and Satori
Note: SVG are not suppose to be served for OG Images (we use png format in OG Images) where we use SVG to PNG coverter Resvg.
-
Vercel OG Image Generation: Fast, dynamic social card images at the Edge
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.
- resvg-js 2.0: A High-Performance SVG Renderer and Toolkit
satori-html
-
Generate OpenGraph Images Dynamically
We'll use Satori & ReSVG to recreate the exact same functionality, but we will add one more thing. Satori-HTML is a library by Nate Moore to convert raw HTML into JSX suitable for Satori. This will allow us to use HTML to generate our images.
-
Dynamic OG image with SvelteKit and Satori
@vercel/og is dependent on Satori. Satori is a new libray that convert HTML and CSS to SVG. Satori only accepts two params those are ReactElement (like JSX) and options. In SvelteKit, we don't have a ReactElement type syntax. Here, we need a html to ReactElement converter and Satori-html is what we need to do that.
What are some alternatives?
nodejs-snowflake - Generate time sortable 64 bits unique ids for distributed systems (inspired from twitter snowflake)
sveltekit-og - Generate Open Graph Images dynamically from HTML/CSS without a browser in SvelteKit
rust-wasm-on-lambda-edge - Rust/WASM on AWS Lambda@Edge (CloudFront)
vtracer - Raster to Vector Graphics Converter
satori - Enlightened library to convert HTML and CSS to SVG
wasm-learning - Building Rust functions for Node.js to take advantage of Rust's performance, WebAssembly's security and portability, and JavaScript's ease-of-use. Demo code and recipes.
ogimage
extism - The framework for building with WebAssembly (wasm). Easily load wasm modules, move data, call functions, and build extensible apps.
svgcleaner - svgcleaner could help you to clean up your SVG files from the unnecessary data.
puppeteer - Node.js API for Chrome
rustwasmc - Tool for building Rust functions for Node.js. Combine the performance of Rust, safety and portability of WebAssembly, and ease of use of JavaScript.