contentful-image-optimiser

Optimise image size and quality of assets served from Contentful.

Usage no npm install needed!

<script type="module">
  import contentfulImageOptimiser from 'https://cdn.skypack.dev/contentful-image-optimiser';
</script>

README

Contentful Image Optimiser


The Contentful Image Optimiser is a lightweight module that will improve the speed and performance of any page that serves it's images via Contenful.

  • Automatically serves appropriate image size depending on device
  • Allows you to specify specific image sizes
  • Serves images in WebP format autimatically if browser support is available. Fallsback to original format if not supported

This will return an image with it's width set to match the browser window width. It will also
automatically change it's format to WebP if supported

<img src="setAutoWidth(/imageURL.png)">

<hr>

This will return an image with a specified width

<img src="setFixedWidth(/imageURL.png, 350)">

<hr>

This will return an image with a specified height

<img src="setFixedHeight(/imageURL.png, 500)">

<hr>

This will return an image with a specified height and width

<img src="setHeightWidth(/imageURL.png, 500, 500)">

Link to repo

Download & Installation

$ npm i contentful-image-optimiser

Author

  • Daragh Cassidy

License

This project is licensed under the MIT License