このページの本文へ

ピクシブ×さくらのクラウド画像変換サービス「ImageFlux」が1周年、イベントを開催

STORES.jp、メルカリが語った!「ImageFlux」活用メリット

2017年02月16日 08時00分更新

文● 大塚昭彦/TECH.ASCII.jp

sponsored

  • この記事をはてなブックマークに追加
  • 本文印刷

メルカリ「画像の動的リサイズとWebP化でデータ通信量を大幅に削減」

 続いて2社目のユーザー企業として登壇したのは、フリマアプリを提供するメルカリだ。同社プリンシパルエンジニアの久保達彦氏が、特に「データ通信量」という観点から、メルカリにおけるImageFlux導入の背景やその効果を説明した。

メルカリ プリンシパルエンジニアの久保達彦氏

 2013年創業のメルカリは、スマートフォンを中心としたフリマアプリ(個人出品できるECサービス)を提供する企業だ。日本だけでなく米国、英国でもサービスを展開しており、昨年12月には世界累計で1億ダウンロードを突破した。同社公開データによると、メルカリ上で売買される金額は毎月100億円以上、新たに出品される商品数は毎日100万品以上に及ぶ。

 メルカリにおいて、データ通信量の大部分を占めるのは「画像」だ。アプリを起動すると、トップ画面にはユーザーが出品した新着商品画像が並ぶ。テキスト情報は価格だけで(商品名すらない)、商品を購入したいユーザーは、カテゴリーやキーワードなどで絞り込みながら、画像を通じてお目当てのモノを見つけ、購入へと進む。

 久保氏は、このように多くの機能(商品タイムライン、検索、いいね!一覧、閲覧履歴など)で「画像が主役」になっていること、そして毎日百万個単位で新たな画像データが増えることが、メルカリの画像配信環境の特徴だと説明する。

メルカリのアプリは画像が中心のインタフェースであり、データ通信量の多くを画像が占める

 こうした大量の画像をスムーズかつ低コストで配信するために、メルカリではAmazon S3とアカマイのCDNサービスを利用していたが、現在はそこにImageFluxを追加した構成となっている。

 「S3がオリジン(オリジナル画像サーバー)、ImageFluxが画像変換とキャッシュ、アカマイはキャッシュとエッジデバイスへの最適化、という構成です」(久保氏)

 メルカリがImageFluxを採用した背景には、サービスの急成長に伴って画像配信データ量(=CDNの配信コスト)も増加していくメルカリ側の問題だけでなく、配信データ量の増加がユーザー側にも悪影響を及ぼすという判断があった。

 「アプリの通信量が多いと速度制限がかかってしまう場合があります。いわゆる『ギガが減る』というやつですね。またスマートフォンの通信は、環境によっては非常に低速になり、そうした環境下でデータ通信量が多いとアプリの動作速度やUXにも大きく影響してしまいます」(久保氏)

 それに加え、UIやデザインの柔軟な変更に支障をきたすという問題もあった。画面デザインを変更すれば最適な画像サイズも変わるが、毎日100万個単位で新たな画像が増える状況下では「複数サイズパターンの画像を用意することは困難です」(久保氏)。

 実際に、一昨年(2016年)末ごろから実施したアプリUI変更のA/Bテストでは、こうした問題があらわになっていた。もともと2列だった商品サムネイル表示を3列に増やすデザイン変更を行ったところ「CDNのトラフィックが1.5倍になりました」(久保氏)。サムネイルは元の2列表示に合わせてサイズ設計されており、その画像を3列にして表示数が1.5倍に増えれば、通信量も当然1.5倍になる。ユーザー側アプリの通信量も増加した。

 「アプリの通信量が増えたために表示が遅くなってしまうという問題が発生し、データ通信量の削減がより急務になりました」(久保氏)

 こうした問題を解消して新しい3列UIに移行するために、ImageFluxが採用されることになった。ImageFluxで配信画像を動的にリサイズ/最適化すれば、アプリのデータ通信量削減につながり、UIとデザインに合った最適な画像サイズも得られる。画像のWebP化も簡単にできるので、通信量の大幅な削減が期待できた。

 複数の画像でテストしたところ、JPEGのまま3列表示用に縮小リサイズすることで10~20%の容量削減、さらにWebP化することで40~50%の容量削減が見込めることがわかった。商品タイムラインや検索結果では多数のサムネイル画像が表示されるため、全体としての効果は非常に大きい。

サムネイル画像の容量テスト。この画像の場合、3列表示サイズに縮小リサイズ(JPEG)すると約18%、さらにWebP変換すると約50%の容量削減となった

 本番環境でImageFluxを導入した結果、ユーザー数が増え続け、リクエスト数が右肩上がりに上昇する中でも、画像データ通信量は30%減少したという。リクエスト数が同じであれば、40%以上のインパクトがあったと言えるのではないかと、久保氏は語る。

 「具体的な数字は出せませんが、『ペタが減りました』(会場笑)というくらいのスケールで通信量を減らすことができました」(久保氏)

 まとめとして久保氏は、画像サイズを動的に変換できるためアプリのUIやデザインの変化に柔軟に対応できるようになったことが、ImageFlux導入によって得られた一番のメリットだと述べた。

カテゴリートップへ

灯油タンクで残量検知を実現!北海道の生活を守るIoTとは【熱量IoT】#3

動画一覧はこちら!