SQIP - CLI utility that generates a lighweight preview for a given image in SVG format.

Have you ever seen how Google, Pinterest or Facebook preload their pictures? Say, you open Google and search for a picture, the results appear in grid and each image has its own colored placeholder and only then the real image is loaded replacing the placeholder. It is very nice practice from UX point of view.

The use case of SQIP is pretty simple. Firsly you need to generate the SVG preview:

sqip -o output.svg ../myImage.jpg

then, you calculate base64 from it:

cat output.svg | base64

and now you can use it in your HTML code, something like this:

<img width="600" height="400" src="myImage.jpg" style="background-size: cover; background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWx....0iMjciLz48L2c+PC9zdmc+);">

And here you go!

#js #images #svg

https://github.com/technopagan/sqip

​​termtosvg - (★ 2,770) a Linux terminal recorder written in Python which renders your command line sessions as standalone SVG animations.

Animated SVG are significantly smaller, more efficient, and crisper than equivalent GIF animations, produced by such services as asciinema (★ 5,901).

You can find examples here.

#terminal #cli #svg #ascii #python