先月からpixivの選考インターンに来ている@knmkrと申します。 インターンではbokkoさんのもと、 動的にサムネイルを生成するmod_small_lightを拡張する課題に取り組みました。
Github: mod_small_light (with GraphicskMagick)
mod_small_lightによる動的サムネイル生成
pixivのように画像を大量に扱うwebサービスでは、サムネイルもまた大量に必要となります。大量のサムネイルを扱う場合、
- サムネイルを保存するのに大容量のストレージが必要
- サイトのデザイン変更に伴う新規サムネイルの生成コストが高い
といったことが問題になります。
そこで、pixivでは一部のサムネイルは事前に用意せず、画像を配信する際にmod_small_lightでサムネイルに変換する「動的サムネイル生成」が行われています。 mod_small_lightはApacheのモジュールで、次のように画像のURIにパラメータを渡すことで、 動的に画像変換を行うことができます。
1 2 |
|
1 2 |
|
実際には、pixivでサムネイルをなんでかんでも動的に生成すると画像変換サーバに凄い負荷がかかるので、 あらかじめ前段のキャッシュサーバでキャッシュすることを前提に運用されています。
このあたりの話は「YAPC::Asia 2012で「pixivのサムネイル事情」について発表してきました」で少し触れられているので興味のある方はご覧ください。
mod_small_lightの拡張
今回、mod_small_lightを拡張してGraphicsMagickをバックエンドに追加してみました。
Github: mod_small_light (with GraphicskMagick)
small_light(e=graphicsmagick,...
とするとGraphicsMagickがバックエンドになります。
GraphicsMagickはImageMagickからフォークされたもので、より高速に動作すると言われており(GraphicsMagick vs ImageMagick Benchmarks)、実際にmod_small_lightに対してab(apache bench)でパフォーマンスを確認したところ、ImageMagickよりもGraphicsMagickの方が高速に動作するのを確認できました。以下は手持ちのMacBook Air(mid 2011)上で単純なリサイズのみを行った場合のベンチマーク結果です。(abのオプションは、「ab -n 100 -c 10 $url」、small_lightに渡すパラメータは「e=graphicsmagick,ch=30,cw=30,dh=28,dw=28,jpeghint=y」、画像のピクセル数は600x425です。)
また、せっかくURIで簡単にパラメータを渡せるので、画像エフェクトに「回転」、「油絵風エフェクト」、「コントラスト強弱」を追加してみました。 「色合いの強弱」も追加したかったのですが、ImageMagickの関数であるMagickTintImageがGraphicsMagickではサポートされていないなど、 GraphicsMagickならでの弊害もありました。
終わりに
インターンでの開発の機会を与えて下さったpixiv Inc.さま、bokkoさま、ありがとうございました!