Chris Han

svimg

2020 - present

svimg

rehype-svimg

rollup-plugin-markdown-svimg

Svimg is an image preprocessing and lazy loading component for Svelte. It will automatically resize images into multiple resolutions and generate additional optimized WebP versions during build. The component shows a blurred placeholder version of the image on the page and lazy loads the proper resolution image when scrolled into view.

rehype-svimg is a unified plugin for converting images in rehype HTML output to use the svimg component, for allowing svimg to be used in markdown content. It also has an accompanying Rollup plugin, rollup-plugin-markdown-svimg, to do the image processing as a part of the build step.