Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
海外から快適に使ってもらうためにしてきたこと / the battle with networ...
Search
fanglang
September 05, 2018
Programming
0
4.5k
海外から快適に使ってもらうためにしてきたこと / the battle with network latency
fanglang
September 05, 2018
Tweet
Share
More Decks by fanglang
See All by fanglang
「家族アルバム みてね」を支えるS3ライフサイクル戦略
fanglang
4
820
マルチCPUアーキテクチャ構成の実現に向けて
fanglang
1
290
Other Decks in Programming
See All in Programming
すべてのコンテキストを、 ユーザー価値に変える
applism118
3
1.3k
テストから始めるAgentic Coding 〜Claude Codeと共に行うTDD〜 / Agentic Coding starts with testing
rkaga
12
4.4k
PHPでWebSocketサーバーを実装しよう2025
kubotak
0
280
ニーリーにおけるプロダクトエンジニア
nealle
0
830
Claude Code + Container Use と Cursor で作る ローカル並列開発環境のススメ / ccc local dev
kaelaela
9
5k
ruby.wasmで多人数リアルタイム通信ゲームを作ろう
lnit
3
470
Blazing Fast UI Development with Compose Hot Reload (droidcon New York 2025)
zsmb
1
290
Webの外へ飛び出せ NativePHPが切り拓くPHPの未来
takuyakatsusa
2
550
PHPで始める振る舞い駆動開発(Behaviour-Driven Development)
ohmori_yusuke
2
390
PipeCDのプラグイン化で目指すところ
warashi
1
270
XP, Testing and ninja testing
m_seki
3
240
Azure AI Foundryではじめてのマルチエージェントワークフロー
seosoft
0
170
Featured
See All Featured
Building an army of robots
kneath
306
45k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
How to Think Like a Performance Engineer
csswizardry
25
1.7k
How to Ace a Technical Interview
jacobian
278
23k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.4k
4 Signs Your Business is Dying
shpigford
184
22k
The Language of Interfaces
destraynor
158
25k
Being A Developer After 40
akosma
90
590k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.3k
GitHub's CSS Performance
jonrohan
1031
460k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
Building Adaptive Systems
keathley
43
2.7k
Transcript
海外から快適に使ってもらう ためにしてきたこと みてねのMeetup #2 for サーバーサイド/SRE 2018/09/05 おぜきよしろう
自己紹介 • 尾関芳郎 • みてねがすき • ポーカーがすき • ロックフェスがすき
「家族アルバム みてね」について
• URL: https://mitene.us/ • 2015年4月 サービス開始 • 2017年7月 英語版提供開始 ◦
ここを伸ばしていくために頑張ってます • 2018年7月 ユーザー数 300万人突破 • 2018年8月 写真・動画のアップロード総数10億枚突破 「家族アルバム みてね」について
課題の整理
課題の整理 • 海外における課題 ◦ 日本よりもアプリの動作が遅い ◦ 海外で成功するためにはまずここをなんとかせねば!
課題の整理 • そもそも「遅い」って、何が遅いの? • 何を速くすれば快適になるの?
アプリケーションの特徴 • 家族間で画像・動画をシェア ◦ 大量の画像・動画がアップされるため、大量のストレージが必要 ◦ それぞれ少数人からのアクセスしかないため、 CDNキャッシュ効率が悪い • 海外展開
◦ 日本のリージョンに構築しているため、ネットワークレイテンシが大きい ◦ ピークタイムが国によって違う (とはいえ、今はほとんどが日本からのアクセス )
アプリケーションの特徴 • 家族間で画像・動画をシェア ◦ 大量の画像・動画がアップされるため、大量のストレージが必要 ◦ それぞれ少数人からのアクセスしかないため、 CDNキャッシュ効率が悪い • 海外展開
◦ 日本のリージョンに構築しているため、 ネットワークレイテンシが大きい ◦ ピークタイムが国によって違う (とはいえ、今はほとんどが日本からのアクセス )
アプリケーションの特徴 • 家族間で画像・動画をシェア ◦ 大量の画像・動画がアップされるため、大量のストレージが必要 ◦ それぞれ少数人からのアクセスしかないため、 CDNキャッシュ効率が悪い • 海外展開
◦ 日本のリージョンに構築しているため、 ネットワークレイテンシが大きい ◦ ピークタイムが国によって違う (とはいえ、今はほとんどが日本からのアクセス ) • 今日は、AWSが提供する機能で解決してきたことを共有します ◦ (AWS使ってない人すみません ) ◦ それ以外もいろいろやってますが、 AWSの話なら自社に取り入れやすいですよね
何をやったか?
何をやったか? 1. 写真・動画ダウンロードの高速化 2. 写真・動画アップロードの高速化 3. APIアクセス全体の高速化
1. 写真・動画ダウンロードの高速化 • みてねの画像・動画DL時のフロー(変更前) ◦ 全画像に対して、一度 APIにアクセスしてCloudFrontの署名付きURLを発行している ▪ これが遅い
1. 写真・動画ダウンロードの高速化 • 署名付きURLはまとめて発行するようにAPIの仕様を変更 ◦ 且つ署名はワイルドカードを使用 ◦ APIへのアクセスを大幅に減らすことができた!
1. 写真・動画ダウンロードの高速化 • ここを掘り下げたものが弊社酒井がiOSDCで発表しています ◦ https://speakerdeck.com/_atsushisakai/image-distribution-for-overseas ▪ こちらの資料もご確認ください。
2. 写真・動画アップロードの高速化 • 海外版リリース時のアップロードフロー ◦ US在住の場合、us-east(またはus-west)のバケットにアップロード ▪ us-east(またはus-west)から ap-northeast にレプリケーション
▪ US以外は ap-northeast に直接アップロード ◦ ap-northeast のバケットに反映されないと、家族に共有されない
2. 写真・動画アップロードの高速化 • Cross-Region Replication ◦ https://docs.aws.amazon.com/ja_jp/AmazonS3/latest/dev/crr.html ◦ もともとこれによって高速化されることを期待 ◦
ただし、レプリケーションされるまでにタイムラグがある ▪ 体感で、遅い時は数十秒
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 に ルーティングされます。
2. 写真・動画アップロードの高速化 • Amazon S3 Transfer Acceleration を導入 ◦ ap-northeastへのアップロードは平均
0.5秒以上速くなった ▪ とは言え、大きいファイルのアップロードは時間がかかるものなので、ユーザーの体感的には あまり変わらないかも
2. 写真・動画アップロードの高速化 • この時点でうすうす気づいていた ◦ 「あれ、Cross-Region Replicationいらなくね?」
2. 写真・動画アップロードの高速化 • アメリカ出張時に現地から計測 ◦ サムネイル作成完了まで S3 Transfer Accelerationの方が最大40秒ほど速かった ◦
やはりレプリケーションは結構遅いことを実感 ◦ Transfer Accelerationは十分速い • 全てap-northeastのバケットに置くように変更した
2. 写真・動画アップロードの高速化 • はじめからこうすればよかった! ◦ (けどしょうがない)
3. APIアクセス全体の高速化 • シンプルなアプリケーション(略図)
3. APIアクセス全体の高速化 • フロントにCloudFrontを入れる
3. APIアクセス全体の高速化 • CloudFrontを入れるメリット ◦ ユーザーからCloudFrontのエッジロケーションまでの物理的な距離が近い ▪ SSL/TLS の接続確立が速くなる ◦
エッジから日本のリージョンまでの通信経路が最適化される ▪ Transfer Accelerationと同じ原理 • 実際に速くなった ◦ UKからだと平均700msほど速くなった
3. APIアクセス全体の高速化 before after
3. APIアクセス全体の高速化 before after 1,120ms → 321ms !!!!
3. APIアクセス全体の高速化 • リソースを一つのAZに集約 ◦ フロントのEC2, RDS, ElastiCacheのマスターを同じAZに集約 ◦ 10msほど速くなった(海外だからというのはあまり関係ない
) ◦ ※もちろんAZ障害が起きた際の復旧手順は用意している ◦ ※アンチパターンなのであまりおすすめはしない
今後の改善案
今後の改善案 • 端末側で画像の先読み&キャッシュ ◦ 現在開発中 • マルチリージョンAPI ◦ まだかなり先になりそう
まとめ
まとめ • 海外向けアプリはネットワークレイテンシとの戦い • AWSの機能だけである程度解決できる