A collection of awesome things regarding image optimisations and utility
-
Articles
-
Libraries
- Gallery
- PhotoSwipe JavaScript image gallery for mobile and desktop, modular, framework independent
- Lazy Loading
- LazySizes High performance and SEO friendly lazy loader for images (responsive and normal), iframes and more, that detects any visibility changes triggered through user interaction, CSS or JavaScript without configuration
- Lozad.js Highly performant, light and configurable lazy loader in pure JS with no dependencies for responsive images, iframes and more
- Resizing or Cropping
- Sharp High performance Node.js image processing, the fastest module to resize JPEG, PNG, WebP and TIFF images. Uses the libvips library
- SmartCrop.js Content aware image cropping
- Utility
- Color Thief Grabs the dominant color or a representative color palette from an image. Uses javascript and canvas
- Jimp An image processing library written entirely in JavaScript for Node, with zero external or native dependencies
- DropZone Dropzone is an easy to use drag'n'drop library. It supports image previews and shows nice progress bars.
- Intense Images A simple library to view large images up close using simple mouse interaction, and the full screen
- Gallery
-
Automation Tasks
- Grunt
- Compression
- Spriting
- Prescaling (normalization) to avoid excessive image resize/decode work:
- Responsive image generation/handling:
- Inline images as data URIs:
- Grunt
-
Individual tools