Skip to content
master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

no.lol

Netlify Status Build Status

Lauren's personal blog. master is automatically deployed to Netlify.

Image Pre-optimization

Gatsby already optimizes using sharp, but recommends pre-optimizing images to improve build perf. Images in this repo tend to be stored at their highest relative quality so that sharp has the best quality image to generate multiple sizes with. However, this means that we tend to store large images which does increase build times quite heavily.

Prerequisites

  • convert
  • mozjpeg (you will need to compile your own binaries. If you use MacOS, you can install with brew install mozjpeg)

Running the script

Run the yarn preoptimize:images command whenever you add a new image. This will recursively look for jpgs in the specified folder, excluding images with the -optimized.jpg suffix.

The script will first convert the jpg into the pnm format (required by mozjpeg), then pipe the output into cjpeg. See usage here. We run cjpeg with the -optimize flag, then output the file to the same directory with the -optimized.jpg suffix.

Finally, reference the optimized jpg in your blog post.

About

🍩 Lauren's personal blog

Topics

Resources

License

Releases

No releases published

Packages

No packages published