Skip to content

Instantly share code, notes, and snippets.

@thebiltheory
Created June 12, 2019 15:13
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save thebiltheory/f43a80d911f6dce69714bba18c310536 to your computer and use it in GitHub Desktop.
Save thebiltheory/f43a80d911f6dce69714bba18c310536 to your computer and use it in GitHub Desktop.
Image Optimization

Optimize Images

  • Status: [proposed]
  • Deciders: [Hakim, Omar, Felix, Bil]
  • Date: [2019-06-13]

Technical Story: [description | ticket/issue URL]

Context and Problem Statement

Currently our loading performances are being affected by unprocessed raw images. Unoptimised imaged takes a huge cost on the loading speed. We can save up to 95% of every image on every page load by using proper image optimization techniques. Use correct image format & size, remove unnecessary image metadata and adjust quality settings to deliver optimum performances.

Decision Drivers

  • Slow loading speed
  • Heavy images

Considered Options

Decision Outcome

Yet to decide

Positive Consequences

  • Improvement of image distribution
  • More control over image quality
  • Delivery of latest image format -> WebP

Negative Consequences

  • Cached images if they are being updated.

Pros and Cons of the Options

Imgix

Good because:

  • Image processing on demand
  • Easy setup
  • Reduce Development Costs
  • Smart Cropping
  • Efficient
  • Insanely Fast
  • Filters, resizing, blur and more as url parameters
  • Easy to understand pricing
  • Professional Features and Options
  • Excellent Face Detection
  • Lightyears better than ImageMagick
  • S3 as source
  • Great for Dynamic Compositing
  • Scalable

Fastly

Good because:

  • Real-time updates
  • Speed & functionality
  • HTTP/2 Support
  • Powerful API
  • Fastest CDN
  • Great support
  • Great customer support
  • Tag-based Purging
  • Instant Purging
  • Image processing on demande (Fastly IO)
  • Good pricing
  • Best CDN
  • Has server in Dubai

Cloudinary

Good Because:

  • Easy setup
  • Fast image delivery
  • Vast array of image manipulation capabilities
  • Cheap
  • Free tier
  • Good support
  • Heroku plugin
  • Great libraries for all languages
  • Scalable
  • Best in the market and includes free plan

Image Engine

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment