0.9.0 • Published 9 months ago

@dweb-browser/svg-wasm v0.9.0

Weekly downloads
-
License
MIT
Repository
github
Last release
9 months ago

svg-wasm

SVG Wasm toolkit, including svg_to_png and svg_to_webp,detect_svg_render, capable of detecting if an SVG causes a memory overflow.

example

How to use the sample project that can be viewed, you can use this project on any platform without worrying about copyright issues.

detect_svg_render

Check whether the SVG is overflowing。

console.log("detect_svg_render=>", detect_svg_render(svg, 2));

svg_to_webp

const svg = fs.readFileSync("../test.svg");
const webp_data = svg_to_webp(svg);
fs.writeFileSync("./test.webp", webp_data);

svg_to_png

The third parameter is that the fill type contains Fill and Contain.

  • Contain: Equal proportional enlargement will not cause the image to be distorted.
  • Fill:With filling, the image may be distorted.
const svg = fs.readFileSync("../test.svg");
const webp_data = svg_to_png(svg, 996.0, 500.0, "Contain", 5242880.0);
fs.writeFileSync("./test.png", webp_data);

import wasm

how to use within vite

fetch wasm file

Vite will automatically pack the wasm file into the dist/assets folder. On the website, it will download this wasm file using network.

import init, { compress, decompress } from "@dweb-browser/svg-wasm";
import svg_wasm_url from "@dweb-browser/svg-wasm/svg_wasm_bg.wasm?url";
// Modern browsers can directly use `await init(svg_wasm_url);`
init(svg_wasm_url).then(() => {
  const svg = fs.readFileSync("../test.svg");
  const webp_data = svg_to_webp(svg);
  fs.writeFileSync("./test.webp", webp_data);
});

bundle wasm into js with base64 encoding

import { compress, decompress, initSync } from "@dweb-browser/zstd-wasm"; import get_zstd_wasm_binary from "@dweb-browser/zstd-wasm/zstd_wasm_bg_wasm"; initSync(get_zstd_wasm_binary());

/// compress or decompress

how to build

  1. rustup target add wasm32-unknown-unknown
  2. install wasm-bindgen cargo install wasm-bindgen-cli
  3. install wasm-pack cargo install wasm-pack
  4. install tsc npm install -g typescript
  5. install deno
    curl -fsSL https://deno.land/install.sh | sh # macos or linux
    irm https://deno.land/install.ps1 | iex # windows
  6. run script: deno task build

    output to pkg folder

0.9.0

9 months ago

0.8.0

9 months ago

0.7.0

9 months ago

0.6.0

9 months ago

0.5.0

9 months ago

0.4.0

9 months ago

0.3.0

9 months ago

0.2.0

9 months ago

0.1.0

9 months ago