sqipify
CLI
npm i -g sqipify-cli
sqipify --help
Demo
Generate SVG Placeholders for Images using SQIP based on Primitive.
Reference Image
700x882, 24 bit, 58.3 KB
Parameters
blur | numberOfPrimitives = 10 | numberOfPrimitives = 50 | numberOfPrimitives = 100 | numberOfPrimitives = 500 |
---|---|---|---|---|
0 | 859 B | 3.50 KB | 6.59 KB | 37.52 KB |
5 | 913 B | 3.90 KB | 6.48 KB | 37.93 KB |
10 | 1019 B | 3.58 KB | 6.61 KB | 38.13 KB |
25 | 995 B | 3.48 KB | 6.42 KB | 37.88 KB |
100 | 1010 B | 3.72 KB | 6.73 KB | 38.01 KB |
Only Triangles
blur | numberOfPrimitives = 10 | numberOfPrimitives = 50 | numberOfPrimitives = 100 | numberOfPrimitives = 500 |
---|---|---|---|---|
0 | 714 B | 3.04 KB | 5.83 KB | 28.32 KB |
5 | 797 B | 3.09 KB | 5.98 KB | 28.17 KB |
10 | 783 B | 3.07 KB | 5.92 KB | 28.21 KB |
Only Rectangles
blur | numberOfPrimitives = 10 | numberOfPrimitives = 50 | numberOfPrimitives = 100 | numberOfPrimitives = 500 |
---|---|---|---|---|
0 | 647 B | 2.72 KB | 5.30 KB | 25.95 KB |
5 | 719 B | 2.77 KB | 5.38 KB | 26.06 KB |
10 | 719 B | 2.80 KB | 5.41 KB | 26.02 KB |
Use
Setup (in ./)
Install NodeJS
Fetch dependencies
npm install
Dev (in ./)
Typescript builds are automatic and watch for file changes:
npm run build
or run this to build only once:
npm run buildOnce
Building, Linting, Formatting, Testing:
npm test
Contribution
- use
git pull --rebase
in favor of regular pull, i recommend configuring it globally via:git config --global pull.rebase true