lazyload-transform
v0.1.0
Published
transform html to support the lazy loading of images clientside
Downloads
1
Maintainers
thenickot2Readme
go-lazyload-transform
IN DEVELOPMENT
Node package written in Go to transform html to support the lazy loading of images clientside
To install:
npm install --save lazyload-transform
yarn add lazyload-transformTo use:
const { Render } = require('lazyload-transform');
const html = '<html><head></head><body><img src="my-image.jpg"></body></html>';
const transformedHtml = Render(html);
console.log(transformedHtml);
// -> <html><head></head><body><img src="" data-src="my-image.jpg" class="lazyload-transform"><script>/*ClientSide JS Here...*/</script></body></html>Transformation
By default, lazyload-transform will do 2 things:
- For all
imgtags, move the value ofsrctodata-src - For all html tags with an inline
styleattribute, move the first url todata-background-imageand replace with a single pixel
Options to control behavior will be in the next release.
Benchmark
To compare to cheerio, run node ./benchmark/cheerio. This benchmark's cheerio implementation is a direct implementation of the functionality written in Go, following best practices from the cheerio documentation.
On a Intel(R) Core(TM) i5-8257U CPU @ 1.40GHz this library is roughly 9-10x faster at parsing and manipulating 1494 lines of html.
LazyLoad Completed In: 7ms
Cheerio Completed In: 70msDevelopment
Requires libxml2.
To test the go library run go test lazyload.go lazyload_test.go.
To test the node wrapper run npm test. Node wrapper should always be tested after updating go library.
To generate lazyload.h and lazyload.a required for the node binding, run go build -buildmode=c-archive -o lazyload.a lazyload.go followed by node-gyp build to update the bindings.