Flashで画像を置く際の最適化のポイントとして
「複雑で面積の小さなものはビットマップで、単純で面積の大きい図形はパスで」
というのは良く聞かれますが、その面積のボーダーラインを正確に把握していなかったので実験してみた。
この画像で大きさを変えながら検証。使ったFlaファイルはこちら。
以下、FlashCS3、DeviceCentralCS3+プロファイルW52Kでのテスト結果
26x26px | 76x76px | 180x180px | 240x240px | ||
---|---|---|---|---|---|
パス (Flash上での曲線数:360) |
Heapメモリ | 145KB | 152KB | 155KB | 156KB |
ファイルサイズ | 1KB | 1.1KB | 1.4KB | 1.5KB | |
PNG-24 (Photoshop「Web用に保存」) |
Heapメモリ | 108KB | 130KB | 238KB | 340KB |
ファイルサイズ | 0.5KB | 2.4KB | 7KB | 10.4KB | |
PNG-8 16色 (PNG-24→Pngquant→OptiPNG) |
Heapメモリ | 107KB | 113KB | 142KB | 169KB |
ファイルサイズ | 0.4KB | 1.6KB | 4.6KB | 6.6KB |
おおよそこんな感じのまとめ。
・アイコンのような要素はビットマップ画像が向いている
・背景にあたるような要素はパスが向いている
・どちらとも言えない大きさの画像の場合、メモリ重視ならビットマップ、ファイルサイズ重視ならパス
・VGA端末向けのデータの場合、パスを使用した方が良い場面が多い
・QVGA端末向けのデータの場合、ビットマップ画像を使用した方が良い場面が多い
なお、この結果はパスの曲線数や複雑さ、ビットマップ画像にした際は色数に左右されます。
・サンプルファイルよりパスの曲線数が多い場合
…ビットマップにした方が良い場合が増える
・サンプルファイルよりビットマップ画像の色数が多い場合や画像が複雑な場合
・またはビットマップ画像としてJPEG形式の画像を使用する場合
…パスにした方が良い場合が増える
適宜読み替えて、どちらを使ったら良いかの判断の目安にしてください。
迷ったら両方作って比較するのが一番。
個人的には
・PNGを減色すると消費メモリもかなり大きく落ちる
・明らかにビットマップの方が良い面積と、明らかにパスの方が良い面積の中間にあるグレーゾーンがとても広い
の2点が「ここまで大きく出るのか、、」という感想。
One thought on “パスとビットマップのメモリ/ファイルサイズ比較”
Comments are closed.