ImageFlux meetup #01

先日開催された ImageFlux meetup #01 の様子をざっくりと書きます。末尾にスライドを並べておきました。

f:id:gregminster:20180125184728j:plain

ImageFlux とは

現在のサービス
- URLを変えるだけで画像変換
  - API的
  - /c/w=500,f=webp:jpg/thumb.jpg
- 開発負荷の低下
- 既存のストレージをそのまま利用可能
  - 必要なところから変えていける
- やれること
  - スケーリングモード
  - クロップ位置の指定 − 画像のオーバーレイ（ロゴやセール……）
- 一番使われているのは WebP
  - ブラウザのリクエストを自動判別している
- 転送量に応じた課金
アップデート予定
- インフラ拡張 − 統計機能の改善 − 日付を指定してのレポート − 画像変換のレポート（フォーマットの間違いを見つけるなど） − 0バイト、壊れた画像…… − 料金体系の再考 − フォーマットの追加 − HEICへの対応（HEIF/HEIC） − ライブ配信 − ブラウザからすぐに大規模ライブ配信 − ライブ変換の動的変換サービス − 現在開発中

画像配信の最適化
主にスマートフォン
データ通信量の大部分は画像のデータ
画像は毎日100万ファイル単位で増える
CDN
- Akamai
- ImageFlux
Origin
- S3
User -> Akamai -> ImageFlux -> S3
- 上記のようになった
なぜImageFluxか
- データが増えて配信コストが増えるのを何とかしたい
- スマートデバイスの通信量を減らしてUX向上させたい
- UIやデザイン変更に伴う変更の困難さを解消したい
長期間のA/Bテスト（数十個単位のテストが並行）
- 3列に切り替えてみたところ……
  - CDNが1.5倍のトラフィックになった
    - コストがかかる……
    - ギガが減る……
ImageFlueを導入することで期待できること
- 各種データ削減
- 開発コスト削減
- 三列向けに動的リサイズやWebP
WebP
- Android 4.0 以上
- iOSアプリの対応はネイティブ（6万行追加のPR）
結果
- 縮小とリサイズで10～20%減
- WebPを加えると40～50%減
- 通信量が30%減少（ペタが減った）
- ただし、WebP対応と非対応の違いが生じたためにCDNのキャッシュヒット率減った
  - 数%のヒット率の差でS3の料金が100万円ぐらい違ってくる…… − UIやデザインに柔軟に対応できるようになった − スマホアプリ中心の場合は非常に重要

ImageFlux Live
- ブラウザからプラグイン不要でライブ配信
  - HLS
- pixiv Sketch Live
  - pixiv ONE
  - 同時視聴5000ユーザ
  - このためにImageFluxチームで開発
WebRTC（よって低遅延）
- HLSに変換（よって大規模配信が可能）
HTTP Live Streaming
- by Apple
  - iOS: native（じゃないと審査が通らない）
  - Android: ExoPlayer
  - Web browser: hls.js
- .m3u8
  - ポーリング
pixiv Sketch Live だと遅延は10秒くらい
- 今は3秒にしてる、3つのファイルが仕様なので10秒位
- 1秒にすれば3秒位まで減らせそう（実験中）
WebRTC SFU Sora
Stream Manager
- RTP(UDP)
  - 並び替えが必要
  - パケットロスも
Transcoder
- NVDEC/NVENC