14

ユーザーがアップロードした画像を前提として、Webサイトに表示するためにさまざまなサムネイルを作成する必要があります。私はImageMagickを使用していて、GooglePageSpeedを幸せにしようとしています。quality残念ながら、コマンドで指定した値に関係なくconvert、PageSpeedは画像をさらに圧縮することを提案できます。

http://www.imagemagick.org/script/command-line-options.php?ImageMagick=2khj9jcl1gd12mmiu4lbo9p365#qualityに言及していることに注意してください。

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/>');
}
4

3 に答える 3

9
  • JPEGには、コメント、サムネイル、またはメタデータが含まれている場合があり、これらは削除できます。
  • 同じ品質を維持しながら、JPEGファイルをさらに圧縮できる場合があります。これは、画像を生成したプログラムが画像を圧縮するための最適なアルゴリズムまたはパラメータを使用しなかった場合に可能です。同じデータを再圧縮することにより、オプティマイザは画像サイズを縮小する場合があります。これは、圧縮に特定のハフマンテーブルを使用することで機能します。

作成したファイルに対してjpegtranまたはjpegoptimを実行して、ファイルのサイズをさらに小さくすることができます。

于 2010-10-10T10:28:56.477 に答える
4

画像サイズをさらに最小化するには、すべてのメタデータを削除する必要があります。ImageMagickは-strip、コマンドラインにを追加することでこれを行うことができます。

サムネイル画像をinline-dbase64でエンコードされたデータとしてHTMLに配置することも検討しましたか?

これにより、HTMLコードで参照されるすべての画像ファイル(画像)に対してブラウザが複数のリクエストを実行する必要がなくなるため、Webページの読み込みが大幅に高速化されます(サイズが少し大きくなります)。

このような画像のHTMLコードは次のようになります。

 <IMG SRC="data:image/png;base64,
         iVBORw0KGgoAAAANSUhEUgAAAM4AAABJAQMAAABPZIvnAAAABGdBTUEAALGPC/xh
         BQAAAAFzUkdCAK7OHOkAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAA
         OpgAABdwnLpRPAAAAAZQTFRFAAAA/wAAG/+NIgAAAAF0Uk5TAEDm2GYAAAABYktH
         RACIBR1IAAAACXBIWXMAAABIAAAASABGyWs+AAAB6ElEQVQ4y+3UQY7bIBQG4IeQ
         yqYaLhANV+iyi9FwpS69iGyiLuZYpepF6A1YskC8/uCA7SgZtVI3lcoiivkIxu/9
         MdH/8U+N6el2pk0oFyibWyr1Q3+PlO2NqJV+/BnRPMjcJ9zrfJ/U+zQ9oAvo+QGF
         d+npPqFQn++TXElkrEpEJhAtlTBR6dNHUuzIMhFnEhxAmJDkKxlmt7ATXDDJYcaE
         r4Txqtkl42VYSH+t9KrD9b5nxZeog/LWGVHprGInGWVQUTvjDWXca5KdsowqyGSc
         DrZRlGlQUl4kQwpUjiSS9gI9VdECZhHFQ2I+UE2CHJQfkNxTNKCl0RkURqlLowJK
         1h1p3sjc0CJD39D4BIqD7JvvpH/GAxl2/YSq9mtHSHknga7OKNOHKyEdaFC2Dh1w
         9VSJemBeGuHgMuh24EynK03YM1Lr83OjUle38aVSfTblT424rl4LhdglsUag5RB5
         uBJSJBIiELSzaAeIN0pUlEeZEMeClC4cBuH6mxOlgPjC3uLproUCWfy58WPN/MZR
         86ghc888yNdD0Tj8eAucasl2I5LqX19I7EmEjaYjSb9R/G1SYfQA7ZBuT5H6WwDt
         UAfK1BOJmh/eZnKLeKvZ/vA8qonCpj1h6djfbqvW620Tva36++MXUkNDlFREMVkA
         AAAldEVYdGRhdGU6Y3JlYXRlADIwMTItMDgtMjJUMDg6Mzc6NDUrMDI6MDBTUnmt
         AAAAJXRFWHRkYXRlOm1vZGlmeQAyMDEyLTA4LTIyVDA4OjM3OjQ1KzAyOjAwIg/B
         EQAAAA50RVh0bGFiZWwAImdvb2dsZSJdcbX4AAAAAElFTkSuQmCC"
  ALT="google" WIDTH=214  HEIGHT=57  VSPACE=5 HSPACE=5 BORDER=0 />

そして、次のようにbase64でエンコードされた画像データを作成します。

base64  -i image.jpg  -o image.b64
于 2012-08-22T18:48:21.280 に答える
2

Googleは、WebP画像形式( https://developers.google.com/speed/webp/ )に基づいてこれらの計算を実行します。

パフォーマンスは向上しますが、現在はchromeとoperaでのみサポートされています(http://caniuse.com/webp

于 2014-05-17T11:07:39.930 に答える