谷歌 PageSpeed 和ImageMagick JPG 压缩
给定用户上传的图像,我需要创建它的各种缩略图以在网站上显示。我正在使用 ImageMagick 并试图让 Google PageSpeed 满意。不幸的是,无论我在 convert
命令中指定什么 quality
值,PageSpeed 仍然能够建议进一步压缩图像。
对于 JPEG ...图像格式, 质量为 1 [提供]最低 图像质量和最高压缩率 ....
实际上,我什至测试了使用 1 压缩图像(尽管它产生了无法使用的图像),并且 PageSpeed 仍然建议我仍然可以通过“无损压缩”图像来优化此类图像。我不知道如何使用 ImageMagick 压缩图像。 有什么建议吗?
以下是测试我所说内容的快速方法:
assert_options(ASSERT_BAIL, TRUE);
// TODO: specify valid image here
$input_filename = 'Dock.jpg';
assert(file_exists($input_filename));
$qualities = array('100', '75', '50', '25', '1');
$geometries = array('100x100', '250x250', '400x400');
foreach($qualities as $quality)
{
echo("<h1>$quality</h1>");
foreach ($geometries as $geometry)
{
$output_filename = "$geometry-$quality.jpg";
$command = "convert -units PixelsPerInch -density 72x72 -quality $quality -resize $geometry $input_filename $output_filename";
$output = array();
$return = 0;
exec($command, $output, $return);
echo('<img src="' . $output_filename . '" />');
assert(file_exists($output_filename));
assert($output === array());
assert($return === 0);
}
echo ('<br/>');
}
Given a user uploaded image, I need to create various thumbnails of it for display on a website. I'm using ImageMagick and trying to make Google PageSpeed happy. Unfortunately, no matter what quality
value I specify in the convert
command, PageSpeed is still able to suggest compressing the image even further.
Note that http://www.imagemagick.org/script/command-line-options.php?ImageMagick=2khj9jcl1gd12mmiu4lbo9p365#quality mentions:
For the JPEG ... image formats,
quality is 1 [provides the] lowest
image quality and highest compression
....
I actually even tested compressing the image using 1 (it produced an unusable image, though) and PageSpeed still suggests that I can still optimize such image by "losslessly compressing" the image. I don't know how to compress an image any more using ImageMagick. Any suggestions?
Here's a quick way to test what I am talking about:
assert_options(ASSERT_BAIL, TRUE);
// TODO: specify valid image here
$input_filename = 'Dock.jpg';
assert(file_exists($input_filename));
$qualities = array('100', '75', '50', '25', '1');
$geometries = array('100x100', '250x250', '400x400');
foreach($qualities as $quality)
{
echo("<h1>$quality</h1>");
foreach ($geometries as $geometry)
{
$output_filename = "$geometry-$quality.jpg";
$command = "convert -units PixelsPerInch -density 72x72 -quality $quality -resize $geometry $input_filename $output_filename";
$output = array();
$return = 0;
exec($command, $output, $return);
echo('<img src="' . $output_filename . '" />');
assert(file_exists($output_filename));
assert($output === array());
assert($return === 0);
}
echo ('<br/>');
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
您可以运行 jpegtran 或 jpegoptim 在您创建的文件上,以进一步减小其大小。
You may run jpegtran or jpegoptim on your created file, to reduce it further in size.
为了进一步减小图像大小,您应该删除所有元数据。 ImageMagick 可以通过在命令行中添加
-strip
来实现此目的。您是否还考虑过将缩略图作为内联 Base64 编码数据放入 HTML 中?
这可以使您的网页加载更快更快(即使尺寸变大一点),因为它可以使浏览器免于对所有图像文件( HTML 代码中引用的图像)。
此类图像的 HTML 代码如下所示:
并且您将创建如下的 Base64 编码图像数据:
To minimize the image sizes even more, you should remove all meta data. ImageMagick can do this by adding a
-strip
to the commandline.Have you also considered to put your thumbnail images as inline-d base64 encoded data into your HTML?
This can make your web page load much faster (even though the size gets a bit larger), because it saves the browser from running multiple requests for all the image files (the images) which are referenced in the HTML code.
Your HTML code for such an image would look like this:
And you would create the base64 encoded image data like this:
Google 根据其 WebP 图像格式执行这些计算 (https://developers.google.com/speed/webp /)。
尽管提供了性能提升,但目前仅 chrome 和 opera 支持它 (http://caniuse.com/webp )
Google performs those calculations based on it's WebP image format (https://developers.google.com/speed/webp/).
Despite giving performance gains though, it is currently supported only by chrome and opera (http://caniuse.com/webp)