$30 off During Our Annual Pro Sale. View Details »

海外から快適に使ってもらうためにしてきたこと / the battle with network latency

fanglang
September 05, 2018

海外から快適に使ってもらうためにしてきたこと / the battle with network latency

fanglang

September 05, 2018
Tweet

Other Decks in Programming

Transcript

  1. 海外から快適に使ってもらう
    ためにしてきたこと
    みてねのMeetup #2 for サーバーサイド/SRE
    2018/09/05
    おぜきよしろう

    View Slide

  2. 自己紹介
    ● 尾関芳郎
    ● みてねがすき
    ● ポーカーがすき
    ● ロックフェスがすき

    View Slide

  3. 「家族アルバム みてね」について

    View Slide

  4. ● URL: https://mitene.us/
    ● 2015年4月 サービス開始
    ● 2017年7月 英語版提供開始
    ○ ここを伸ばしていくために頑張ってます
    ● 2018年7月 ユーザー数 300万人突破
    ● 2018年8月 写真・動画のアップロード総数10億枚突破
    「家族アルバム みてね」について

    View Slide

  5. 課題の整理

    View Slide

  6. 課題の整理
    ● 海外における課題
    ○ 日本よりもアプリの動作が遅い
    ○ 海外で成功するためにはまずここをなんとかせねば!

    View Slide

  7. 課題の整理
    ● そもそも「遅い」って、何が遅いの?
    ● 何を速くすれば快適になるの?

    View Slide

  8. アプリケーションの特徴
    ● 家族間で画像・動画をシェア
    ○ 大量の画像・動画がアップされるため、大量のストレージが必要
    ○ それぞれ少数人からのアクセスしかないため、 CDNキャッシュ効率が悪い
    ● 海外展開
    ○ 日本のリージョンに構築しているため、ネットワークレイテンシが大きい
    ○ ピークタイムが国によって違う (とはいえ、今はほとんどが日本からのアクセス )

    View Slide

  9. アプリケーションの特徴
    ● 家族間で画像・動画をシェア
    ○ 大量の画像・動画がアップされるため、大量のストレージが必要
    ○ それぞれ少数人からのアクセスしかないため、 CDNキャッシュ効率が悪い
    ● 海外展開
    ○ 日本のリージョンに構築しているため、 ネットワークレイテンシが大きい
    ○ ピークタイムが国によって違う (とはいえ、今はほとんどが日本からのアクセス )

    View Slide

  10. アプリケーションの特徴
    ● 家族間で画像・動画をシェア
    ○ 大量の画像・動画がアップされるため、大量のストレージが必要
    ○ それぞれ少数人からのアクセスしかないため、 CDNキャッシュ効率が悪い
    ● 海外展開
    ○ 日本のリージョンに構築しているため、 ネットワークレイテンシが大きい
    ○ ピークタイムが国によって違う (とはいえ、今はほとんどが日本からのアクセス )
    ● 今日は、AWSが提供する機能で解決してきたことを共有します
    ○ (AWS使ってない人すみません )
    ○ それ以外もいろいろやってますが、 AWSの話なら自社に取り入れやすいですよね

    View Slide

  11. 何をやったか?

    View Slide

  12. 何をやったか?
    1. 写真・動画ダウンロードの高速化
    2. 写真・動画アップロードの高速化
    3. APIアクセス全体の高速化

    View Slide

  13. 1. 写真・動画ダウンロードの高速化
    ● みてねの画像・動画DL時のフロー(変更前)
    ○ 全画像に対して、一度 APIにアクセスしてCloudFrontの署名付きURLを発行している
    ■ これが遅い

    View Slide

  14. 1. 写真・動画ダウンロードの高速化
    ● 署名付きURLはまとめて発行するようにAPIの仕様を変更
    ○ 且つ署名はワイルドカードを使用
    ○ APIへのアクセスを大幅に減らすことができた!

    View Slide

  15. 1. 写真・動画ダウンロードの高速化
    ● ここを掘り下げたものが弊社酒井がiOSDCで発表しています
    ○ https://speakerdeck.com/_atsushisakai/image-distribution-for-overseas
    ■ こちらの資料もご確認ください。

    View Slide

  16. 2. 写真・動画アップロードの高速化
    ● 海外版リリース時のアップロードフロー
    ○ US在住の場合、us-east(またはus-west)のバケットにアップロード
    ■ us-east(またはus-west)から ap-northeast にレプリケーション
    ■ US以外は ap-northeast に直接アップロード
    ○ ap-northeast のバケットに反映されないと、家族に共有されない

    View Slide

  17. 2. 写真・動画アップロードの高速化
    ● Cross-Region Replication
    ○ https://docs.aws.amazon.com/ja_jp/AmazonS3/latest/dev/crr.html
    ○ もともとこれによって高速化されることを期待
    ○ ただし、レプリケーションされるまでにタイムラグがある
    ■ 体感で、遅い時は数十秒

    View Slide

  18. 2. 写真・動画アップロードの高速化
    ● Amazon S3 Transfer Acceleration を導入
    ○ https://docs.aws.amazon.com/ja_jp/AmazonS3/latest/dev/transfer-acceleration.html
    ■ Amazon S3 Transfer Acceleration を使用すると、クライアントと S3 バケットとの間で、長距
    離にわたるファイル転送を高速、簡単、安全に行えるようになります。 Transfer Acceleration
    では、Amazon CloudFront の世界中に分散したエッジロケーションが利用されています。
    エッジロケーションに到着したデータは、最適化されたネットワークパスで Amazon S3 に
    ルーティングされます。

    View Slide

  19. 2. 写真・動画アップロードの高速化
    ● Amazon S3 Transfer Acceleration を導入
    ○ ap-northeastへのアップロードは平均 0.5秒以上速くなった
    ■ とは言え、大きいファイルのアップロードは時間がかかるものなので、ユーザーの体感的には
    あまり変わらないかも

    View Slide

  20. 2. 写真・動画アップロードの高速化
    ● この時点でうすうす気づいていた
    ○ 「あれ、Cross-Region Replicationいらなくね?」

    View Slide

  21. 2. 写真・動画アップロードの高速化
    ● アメリカ出張時に現地から計測
    ○ サムネイル作成完了まで S3 Transfer Accelerationの方が最大40秒ほど速かった
    ○ やはりレプリケーションは結構遅いことを実感
    ○ Transfer Accelerationは十分速い
    ● 全てap-northeastのバケットに置くように変更した

    View Slide

  22. 2. 写真・動画アップロードの高速化
    ● はじめからこうすればよかった!
    ○ (けどしょうがない)

    View Slide

  23. 3. APIアクセス全体の高速化
    ● シンプルなアプリケーション(略図)

    View Slide

  24. 3. APIアクセス全体の高速化
    ● フロントにCloudFrontを入れる

    View Slide

  25. 3. APIアクセス全体の高速化
    ● CloudFrontを入れるメリット
    ○ ユーザーからCloudFrontのエッジロケーションまでの物理的な距離が近い
    ■ SSL/TLS の接続確立が速くなる
    ○ エッジから日本のリージョンまでの通信経路が最適化される
    ■ Transfer Accelerationと同じ原理
    ● 実際に速くなった
    ○ UKからだと平均700msほど速くなった

    View Slide

  26. 3. APIアクセス全体の高速化
    before
    after

    View Slide

  27. 3. APIアクセス全体の高速化
    before
    after
    1,120ms → 321ms !!!!

    View Slide

  28. 3. APIアクセス全体の高速化
    ● リソースを一つのAZに集約
    ○ フロントのEC2, RDS, ElastiCacheのマスターを同じAZに集約
    ○ 10msほど速くなった(海外だからというのはあまり関係ない )
    ○ ※もちろんAZ障害が起きた際の復旧手順は用意している
    ○ ※アンチパターンなのであまりおすすめはしない

    View Slide

  29. 今後の改善案

    View Slide

  30. 今後の改善案
    ● 端末側で画像の先読み&キャッシュ
    ○ 現在開発中
    ● マルチリージョンAPI
    ○ まだかなり先になりそう

    View Slide

  31. まとめ

    View Slide

  32. まとめ
    ● 海外向けアプリはネットワークレイテンシとの戦い
    ● AWSの機能だけである程度解決できる

    View Slide