github.com/gildesmarais/jekyll-loading-lazy

jekyll-loading-lazy

This plugin adds loading="lazy" to all img and iframe tags on your Jekyll site. No configuration needed.
If a loading attribute is already present nothing is changed.

loading="lazy" causes images and iframes to load lazily without any JavaScript. Browser support is growing.
If a browser does not support the loading attribute, it will directly (read: blockingly) load the resource.

If you like it, be awesome and buy me a coffee ☕️. Thank you!

Installation

• Add the following to your site's Gemfile:

  gem 'jekyll-loading-lazy'
  

• add the following to your site's _config.yml:

  plugins:
    - jekyll-loading-lazy
  

  Note: if jekyll --version is less than 3.5 use:

  gems:
    - jekyll-loading-lazy
  

• In your terminal, execute:

  bundle
  

• (re)start your Jekyll server with:

  jekyll serve
  

That's basically all there is. In case you want to eager load some images/iframes, add loading="eager" to their tags.

Contributing

• Fork this repository
• Create your branch (`git checkout -b feat/my-new-feature)
• Commit your changes (git commit -m 'Add cool feature')
• Push to the branch (git push origin feat/my-new-feature)
• Create a new Pull Request

Testing

rake

Credits

Thanks to @keithmifsud's jekyll-target-blank whereon this Jekyll plugin largely bases.