ember-cli-lazysizes

Ember.js integration of lazysizes loader for images (responsive and regular), iframes and more without any required configuration. See the demo app from the original repository.

Compatibility

• Ember.js v3.16 or above
• Ember CLI v2.13 or above
• Node.js v10 or above

Installation

ember install ember-cli-lazysizes

Usage

Usage is simple, all you have to do is to assign the class (default: 'lazyload') to any image tag in your template, and use data-src or data-srcset attributes instead of src or srcset:

<img data-src="tomster.png" alt="tomster" class="lazyload">

See the lazysizes' markup API for all the supported loading patterns.

Configuration

All defaults can be overwritten in ember-cli-build.js file:

'ember-cli-lazysizes': {
  lazyClass: 'lazy',
  loadedClass: 'loaded'
}

Find more about lazysizes' configuration options on its original repo.

Plugins

Lazysizes provides a number of plugins. You can easily include the plugins you need through the plugins option.

'ember-cli-lazysizes': {
  plugins: [
    'bgset',
    'aspectratio'
  ]
}

See the list of available plugin-names

Contributing

See the Contributing guide for details.

License

This project is licensed under the MIT License.