画像を Base64 でエンコードする

画像を Base64エンコードすることの目的として、

  1. Data URI スキーマを利用することでデータ(画像)のリクエスト回数を減らす。
    画像データを HTML 内に記述してしまう。
  2. Base64エンコードされた画像を HTML 内に記述することで、応答するデータを圧縮することができる。
  3. リクエスト回数の減少とデータの圧縮で、WEB ページを表示する速度を向上させる。

ことを考えている。

Perl で画像を Base64 エンコードする場合のサンプルコード

#!/usr/bin/env perl
use strict;
use warnings;
use MIME::Base64;

my $file = 'sample_thumbnails.png';

my $regex_extension_jpg = qr|\.(jpe?g)$|;
my $regex_extension_png = qr|\.(png)$|;
my $regex_extension_gif = qr|\.(gif)$|;
my $regex_extension_bmp = qr|\.(bmp)$|;

my $mime_type;

if ($file =~ $regex_extension_jpg) {
    $mime_type = 'jpeg';
} elsif ($file =~ $regex_extension_png) {
    $mime_type = 'png';
} elsif ($file =~ $regex_extension_gif) {
    $mime_type = 'gif';
} elsif ($file =~ $regex_extension_bmp) {
    $mime_type = 'bmp';
} else {
    print $file, "\n";
    die 'Unknown image file type.';
}

my $filesize = -s $file;
my $binary;

{
    open my $IN, '<', $file;
    binmode $IN;
    read $IN, $binary, $filesize;
    close $IN;
}
my $base64 = encode_base64($binary, '');
print '<img src="data:image/' . $mime_type . ';base64,', $base64, '" />';

出力される img 要素を HTML ファイルに記述して、表示されるかどうかを確認する。

とはいえ

Base64エンコードの仕様上、画像データの 30% 増しのサイズになってしまう。