Posts
Wiki

Optimization

The following are links to ways to optimize and compress your files.

A huge resource of optimization and performance tools can be found here:

Text Based Files

HTML

CSS

JS

Image Files

CLI stands for Command Line Interface and means the program will require you to have command prompt or terminal experience to be able to use it as it is entirely text based. GUI stands for Graphical User Interface and means you can interact with it using a mouse. "Library" means this isn't a program you can run, but source files you can use in your own programs. "X" Script means you need to have "X" installed first and an understanding of using "X" before you can run the provided script.

APNG

NameInterfaceDescriptionSourceCost
APNG OptimizerGUIOpenFree

GIF

NameInterfaceDescriptionSourceCost
GifsicleCLIOpenFree
Gif ReducerGUIWeb BasedClosedFree

SVG

NameInterfaceDescriptionSourceCostLanguage
svgoCLINodejs-based tool for optimizing SVG files.OpenFreeJavaScript
svgo-guiGUICross platform drag and drop SVG optimizerOpenFreeJavaScript

JPEG

NameInterfaceDescriptionSourceCost
DownJPEGWebRequires signing up for an API keyClosedFree
JPEGminiGUIClosed$20-$150
JpegoptimCLIOpenFree
JPEG ReducerGUIWeb BasedClosedFree
JPEGrescanPerl ScriptOpenFree
jpegtranCLIOpenFree
mozjpegLibraryMozilla source code project, no CLI or GUI yetOpenFree
ScriptJPGCLIBatch file that combines several algorithmsOpenFree

Multiple Filetypes

NameInterfaceDescriptionSourceCost
Adobe PhotoshopGUI"Save for Web" is acceptable in most casesClosed$30-$50/month
CaesiumGUIOpenFree
FileOptimizerGUIOpenFree
GraphicsMagickGUIOpenFree
grunt-contrib-imageminCLIRequires the usage of Grunt (open source/free automation system)OpenFree
ImageMagickCLI & GUIHas many libraries for languagesOpenFree
ImageOptimGUIMac only, combines PNGOUT, Zopfli, Pngcrush, AdvPNG, OptiPNG, JpegOptim, jpegrescan, jpegtran, and GifsicleOpenFree
Irfanview with PluginsGUIWith plugins installed, you can use features of jpegtranClosedFree
RIOTGUIClosedFree
The GIMPGUIOpenFree

PNG

NameInterfaceDescriptionSourceCostLanguage
AdvPNGCLIOpenFree
DeflOptCLIReorganizes the structure of png files to save a few bytes, best ran lastClosedFree
defluffCLISame as DeflOpt. If running both, do defluff lastClosedFree
ImageOptimGUIMac only, combines PNGOUT, Zopfli, Pngcrush, AdvPNG, OptiPNGOpenFree
PNGCrushCLIOpenFreeC
PNGGauntletGUICombines PNGOut, OptiPNG, & DeflOptClosedFree
PngOptimizerGUI & CLIOpenFreeC++
PNGOUTCLIClosedFree
PNGOUTWinGUIGUI for PNGOutClosed$15-$30
pngquantGUI & CLIOpenFree
pngwolfLibraryOpenFreeC++
PngyuGUIMac and Windows GUI for pngquantOpenFreeC++
PngZopfliCLIA command line executable for the Zopfli libraryClosedFree
OptiPNGCLIOpenFree
ScriptPNGCLIBatch file that combines several algorithmsOpenFree
TinyPNGGUILimited web based versionClosedFree
TinyPNGGUIPhotoshop PluginClosed$35
TruePNG
ZopfliLibraryBrute-force randomized attempts at compressing each line. This seems to be the most powerful of any single algorithm and by far the slowest.OpenFree
zopflipngCLIA more detailed command line for Zopfli than PngZopfli. More complex, but capable of producing better compression.OpenFree

PNG Compression Instructions

/u/Jaredcheeda compiled this list of image optimization resources. He has spent years crafting the following recipe for maximum png compression without loss of quality, he recommends the following:

  1. Use TruePNG first to convert to the correct type of PNG format using:TruePNG /o4 0.png /out 0.t.png

  2. Run your png(s) through PngOptimizer, it's pretty fast and does a good job. My settings.

  3. Then run it in zopflipng with it set to test all modes. This will by far take the longest amount of time. Settings: zopflipng --iterations=1000 --splitting=3 --filters=01234mepb --lossy_transparent 0.png 0.zopfli.png

  4. Run them through PNGOUTWin, it does a good job of finding ways to compress PNGs other algorithms won't. My settings.

  5. Now Run them through PNGGauntlet. Since it's using DeflOpt, PNGGauntlet can't be ran before PngOptimizer or PNGOUTWin, or it will prevent them from doing the maximum compression they could otherwise do. My Settings.

  6. Finally running defluff after DeflOpt can scrape off a few bytes.

  7. ... But also sometimes running DeflOpt after defluff can shave off a few bytes. Soooo run it again (via PNGGauntlet).

I really wish there was a method that could get the same level of compression without having to manually run these different programs. The order you run these in matters if you want maximum compression.