Yahoo!JAPANが行った高速化はiPhone向けにも有効そう
Yahoo!JAPANが行った高速化の手法が公開されてたのでiPhoneでも使えそうなのPNGファイルの最適化を試してみました。
Yahoo!ニュース高速化へのサイトデザイン側からのアプローチ (Yahoo! JAPAN Tech Blog)
http://techblog.yahoo.co.jp/cat207/cat214/yahoo_3/
smush.itで最適化してみる
smush.it はその名の通り以下のURLで変換可能なのですが
http://smush.it/
たまにYahoo!の以下のURLへリダイレクトされることがありました(サーバの負荷の状態で変わるのかな？)。
http://developer.yahoo.com/yslow/smushit/
smush.it ではファイルアップロードでの変換にも対応していたのですがYahoo!のサイトではWeb上に有るファイルだけしか変換できない様です。
※ファイルをWeb上に置けない場合は後ほど解説する別の方法で変換して下さい。
テストとしては以下のファイルを比較しました。
※「Xcodeでのビルド」はプロジェクトのResourceフォルダに該当ファイルを格納し、ビルドを行い生成された .app に格納されているファイルを確認しました。
テスト1
image1(写真タイプの画像)
http://tsuyobi.heteml.jp/test_image/image1.png
| ファイル | サイズ |
|---|---|
| 元ファイル | 128,894byte |
| 元ファイル→smush.it | 109,282byte |
| 元ファイル→Xcodeでのビルド後 | 136,873byte |
| 元ファイル→smush.it→Xcodeでのビルド後 | 133,186byte |
テスト2
image2(手書き文字の画像)
http://tsuyobi.heteml.jp/test_image/image2.png
| ファイル | サイズ |
|---|---|
| 元ファイル | 14,037byte |
| 元ファイル→smush.it | 5,599byte |
| 元ファイル→Xcodeでのビルド後 | 12,663byte |
| 元ファイル→smush.it→Xcodeでのビルド後 | 8,976byte |
Xcodeでのビルド後はサイズが増加するみたいですがそれでも smush.it を使用した方がサイズが小さくなっています。
pngcrushで最適化してみる
画像の最適化を解説しているこちらのサイトを参考に
Image Optimization, Part 3: Four Steps to File Size Reduction » Yahoo! User Interface Blog
http://yuiblog.com/blog/2008/11/14/imageopt-3/
pngcrushを以下のオプションで実行したところ smush.it で変換したものと同一のサイズ109,282byteになりました。
自分の手元で一気に変換したいときやWeb上にアップするのは不味い場合はこちらの方法で変換すると良いでしょう。
/Developer/Platforms/iPhoneOS.platform/Developer/usr/bin/pngcrush -rem alla -reduce -brute image1.png image1_chg.png
