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
海外展開を目指すアプリで実装したセキュアで高速な画像配信の話 / Image distribu...
Search
atsushisakai
August 30, 2018
Programming
8
7.2k
海外展開を目指すアプリで実装したセキュアで高速な画像配信の話 / Image distribution for overseas
iOSDC Japan 2018発表資料です。
atsushisakai
August 30, 2018
Tweet
Share
More Decks by atsushisakai
See All by atsushisakai
大規模 SaaS の技術的意思決定を支える三要素 / Three elements that support technical decision-making for large-scale SaaS
_atsushisakai
0
1.2k
一方、私はなぜEMでありつづけるか / TECH TRACK vol.1
_atsushisakai
0
480
子育てとEMと転職と
_atsushisakai
2
850
「家族アルバム みてね」を支える エンジニアリング組織/introduce-familyalbum-engineering-team
_atsushisakai
2
240
ミクシィのマネージャーは悩んでいる / mixi's manager is in trouble
_atsushisakai
16
14k
実践 Engineering Manager / practice engineering manager
_atsushisakai
19
8.2k
Scalable Microservice for Media Transcoding / Transcoder
_atsushisakai
4
1.5k
New Relic {FUTURE} STACK 3/14, 2019 / newrelic_future_stack
_atsushisakai
1
1.5k
実践 WorkManager / WorkManager
_atsushisakai
3
7.5k
Other Decks in Programming
See All in Programming
すべてのコンテキストを、 ユーザー価値に変える
applism118
2
820
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
46
31k
設計やレビューに悩んでいるPHPerに贈る、クリーンなオブジェクト設計の指針たち
panda_program
6
1.5k
Create a website using Spatial Web
akkeylab
0
300
ReadMoreTextView
fornewid
1
480
Cline指示通りに動かない? AI小説エージェントで学ぶ指示書の書き方と自動アップデートの仕組み
kamomeashizawa
1
580
ニーリーにおけるプロダクトエンジニア
nealle
0
520
来たるべき 8.0 に備えて React 19 新機能と React Router 固有機能の取捨選択とすり合わせを考える
oukayuka
2
860
LT 2025-06-30: プロダクトエンジニアの役割
yamamotok
0
480
プロダクト志向ってなんなんだろうね
righttouch
PRO
0
160
エンジニア向け採用ピッチ資料
inusan
0
160
#kanrk08 / 公開版 PicoRubyとマイコンでの自作トレーニング計測装置を用いたワークアウトの理想と現実
bash0c7
1
480
Featured
See All Featured
Git: the NoSQL Database
bkeepers
PRO
430
65k
[RailsConf 2023] Rails as a piece of cake
palkan
55
5.6k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.8k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
930
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
331
22k
Measuring & Analyzing Core Web Vitals
bluesmoon
7
490
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
The Cult of Friendly URLs
andyhume
79
6.5k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Statistics for Hackers
jakevdp
799
220k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.8k
Transcript
ւ֎ల։Λࢦ͢ΞϓϦͰ࣮ͨ͠ ηΩϡΞͰߴͳը૾৴ͷ ञҪ ಞ @_atsushisakai mixi, Inc. iOSDC Japan 2018
- 8/31 14:20~ Track D
ञҪ ಞ @_atsushisakai 2011 ϛΫγΟೖࣾ ։ൃ։࢝ॳΑΓʮՈΞϧόϜ ΈͯͶʯͷiOS։ൃΛ୲ 2018Ҏ߱ɺΈͯͶࣄۀ෦։ൃάϧʔϓϚωʔδϟʔ ݉ SRE
1 ʮՈΞϧόϜ ΈͯͶʯʹ͍ͭͯ
ʮՈΞϧόϜ ΈͯͶʯʹ͍ͭͯ ಛ ࢠڙͷࣸਅಈըΛڞ༗ɺཧ Ո͚ͩͰ҆৺ͯ͑͠ΔΞϧόϜΞϓϦ 1
ʮՈΞϧόϜ ΈͯͶʯʹ͍ͭͯ ͜Ε·Ͱ 20154݄ αʔϏε։࢝ 20188݄ Ϣʔβʔ300ສਓ 1
ʮՈΞϧόϜ ΈͯͶʯʹ͍ͭͯ 20176݄ ӳޠ൛ͷఏڙ։࢝ 1
7݄ʹNYग़ு༷ͨ͠ࢠͳͲ https://medium.com/mixi-developers/4526e24093ca ʮՈΞϧόϜ ΈͯͶʯʹ͍ͭͯ 1
ʮՈΞϧόϜ ΈͯͶʯʹ͍ͭͯ ࠓӳޠ൛ͷΞϓϦʹ͓͚Δ՝ղܾͷࣄྫΛ͓͠͠·͢ɻ 1
՝ͱʁ 2
՝ͱʁ Ϣʔβʔ͔Βͷใࠂ ʮը૾͕දࣔ͞ΕΔͷ͕ͱ͍ͯʯ 2 NYͰݟͨվળલͷΈͯͶ
՝ͱʁ ւ֎ͰαʔϏεΛӡ༻͢Δ࠷ॳͷ՝ ΞϧόϜΞϓϦͱͯ͠ࠃಉ༷ɺߴͳը૾ӾཡΛߦ͑Δ͜ͱ 2
՝ͷੳ 3
ΈͯͶͷը૾৴ϑϩʔʢվળલʣ ՝ͷੳ 3
ը૾৴ϑϩʔ 1. ϦΫΤετ 2. ೝূɾೝՄΛߦ͍CloudFrontϦμΠϨΫτ 3. ॺ໊͖ɾ੍࣌ؒݶ͖URLը૾ΛϦΫΤετ 4. S3ͷΦϦδϯαʔόʔը૾ΛϦΫΤετ 5.
ը૾ΛCloudFrontฦ٫ɺCloudFrontͰΩϟογϡ 6. ը૾ΛσόΠεϨεϙϯεʢΩϟογϡʣ Amazon EC2 Amazon CloudFront Amazon S3 1 2 3 4 5 6 ՝ͷੳ 3
ຊࠃ֎͔ΒͲ͏ݟ͑Δ͔ʁ Amazon EC2 Amazon CloudFront Amazon S3 1 3 4
5 6 2 ՝ͷੳ 3
ຊࠃ֎͔ΒͲ͏ݟ͑Δ͔ʁ Amazon CloudFront 1 3 4 5 6 ຊࠃ Amazon
S3 Amazon EC2 2 ՝ͷੳ 3
3 ࠃ֎͔ΒͲ͏ݟ͑Δ͔ʁ Amazon EC2 Amazon CloudFront Amazon S3 1 3
4 5 6 2 ຊࠃ ຊࠃ֎͔Βͷը૾ද͕͍ࣔݪҼ • ຊࠃʹଘࡏ͍ͯ͠ΔAPIαʔόʔͷڑ͕ԕ͗͢Δ • ຊࠃʹଘࡏ͍ͯ͠ΔS3ͷڑ͕ԕ͗͢Δ ՝ͷੳ
Ͳͷ͙Β͍͍ͷʁ ՝ͷੳ 3
NewRelic Synthetics • APIΤϯυϙΠϯτͷ֎ܗࢹαʔϏε • ϦΫΤετ։࢝ॴ͕ੈքதʹଘࡏ͍ͯ͠ΔͷͰࠃ֎͔ΒͷϦΫΤετΛγϛϡϨʔτՄೳ • ςετ༰JavaScriptͰهड़ • ֤छnode.js
modulesΛར༻Մೳ (https://docs.newrelic.com/docs/synthetics/new-relic- synthetics/scripting-monitors/import-nodejs-modules) ՝ͷੳ 3
None
36.2KBͷసૹ " Washington, DC, ͔ΒͷΞΫηε
ೝূΛ࣮ߦ
302 Redirect
CloudFrontʢ࣮ࡍͷը૾ϦιʔεʣͷΞΫηε
ൃߦͨ͠ϦΫΤετ͕ྃ͢Δ·Ͱͷ࣌ؒ ͨͬͨ36.2KBΛసૹ͢ΔͨΊʹ1.35sec͔͔͍ͬͯΔ
՝Λղܾ͢ΔγεςϜઃܭ 4
՝Λղܾ͢ΔγεςϜઃܭ 4 վળ͖͢ϙΠϯτ 1. ຊࠃͷAPIϦΫΤετͷൃੜ࠷খݶʹɻ 2. CDNͷΩϟογϡΛࣄલʹߦ͏Α͏ʹɻ 1 Amazon CloudFront
1 3 4 5 6 ຊࠃ Amazon S3 Amazon EC2 2
վળ͖͢ϙΠϯτ 1. ຊࠃͷAPIϦΫΤετͷൃੜ࠷খݶʹɻ 2. CDNͷΩϟογϡΛࣄલʹߦ͏Α͏ʹɻ Amazon CloudFront 1 3 4
5 6 ຊࠃ Amazon S3 Amazon EC2 2 ՝Λղܾ͢ΔγεςϜઃܭ 4
վળ͖͢ϙΠϯτ 1. ຊࠃͷAPIϦΫΤετͷൃੜ࠷খݶʹɻ 2. CDNͷΩϟογϡΛࣄલʹߦ͏Α͏ʹɻ AWSʹPre-Warmingػೳແ͍ Amazon CloudFront 1 3
4 5 6 ຊࠃ Amazon S3 Amazon EC2 2 ՝Λղܾ͢ΔγεςϜઃܭ 4
ຊࠃͷAPIϦΫΤετͷൃੜΛ࠷খݶʹ͢Δɻ ՝Λղܾ͢ΔγεςϜઃܭ 4
ͲͷΑ͏ʹ࣮ݱ͔ͨ͠ • ॺ໊͖URLΛUI͔ΒͷϦΫΤετ͕ΔલʹࣄલʹҰཡͰ͍ग़͢Α͏ʹมߋ • ༗ޮظݶΕͷͱ͖͚ͩɺຊʹ͍߹Θͤͯ࠶औಘ • ॺ໊͖URLࣗମΛΩϟογϡ͢Δ • දࣔϦΫΤετ࣌ʹɺ͙͢ʹCloudFrontͷΞΫηεΛߦͳ͑ΔΑ͏ʹͨ͠ ՝Λղܾ͢ΔγεςϜઃܭ
4
γʔέϯε 1. ҰཡऔಘͷϦΫΤετൃՐϝλσʔλߋ৽࣌ͷΈ 2. ॺ໊͖URLࣗମΛΩϟογϡ͢Δ 3. ॺ໊͖URL͑͋͞Ε͙͢ʹը૾ʹΞΫηεՄೳ ՝Λղܾ͢ΔγεςϜઃܭ 4
ղઆ ߴͳίϯςϯπΞΫηε • ओʹCDNͷػೳͰ࣮ݱ • S3ͷίϯςϯπΛΩϟογϡ͠ϨΠςϯγʔͰ৴͢Δ • CDNʹΩϟογϡ͞Ε͍ͯΕS3ͷϦΫΤετ͕লུͰ͖Δ ηΩϡϦςΟ •
RailsͰೝূɾೝՄࡁΈͷϢʔβʔʹͷΈॺ໊͖URLΛൃߦ͍ͯ͠Δ • ৴པ͞Εͨॺ໊ऀʢαʔόʔʣͷΈ͕ॺ໊͖URLΛੜՄೳ • CloudFrontͰURLʹ༩͞Εͨॺ໊Λݕূ͞ΕͯॳΊͯϦιʔεͷΞΫηε͕Մೳ • ༗ޮظݶ͖ͰURLͷ࿙Ӯ͔ΒकΔ • S3ʹΞΫηεग़དྷͳ͍Α͏ʹઃఆ͍ͯ͠Δ ՝Λղܾ͢ΔγεςϜઃܭ 4
TIPS: ϫΠϧυΧʔυΛ༻ͨ͠CloudFrontॺ໊͖URLੜ • ϫΠϧυΧʔυࢦఆͰෳίϯςϯπΛରʹͯ͠ॺ໊͖URLΛൃߦͰ͖Δ • ྫ͑ɺෳͷαΠζͷαϜωΠϧΛS3্ʹอ͍࣋ͯ͠Δ߹ͳͲ • https://cdn-hoge.cloudfront.net/images/*/id-001.jpeg Λॺ໊͢ΔͱҎԼ྆ํͱΞΫηε͕Մೳ •
https://cdn-hoge.cloudfront.net/images/small/id-001.jpeg • https://cdn-hoge.cloudfront.net/images/large/id-001.jpeg • SDKΛͬͨURLੜ͕ศར • AWS SDK for Ruby version 3 • https://docs.aws.amazon.com/sdk-for-ruby/v3/api/Aws/CloudFront/UrlSigner.html ՝Λղܾ͢ΔγεςϜઃܭ 4
ΞϓϦ࣮ 5
্࣮ͷϙΠϯτ • ॺ໊͖URLΛRealmʹΩϟογϡ͢Δ • ༗ޮͳॺ໊͖URL͕ඞͣऔಘͰ͖ΔΑ͏ʹRxSwiftΛۦͯ͠RepositoryΛ࣮͢Δ • ͷը૾ͷDownload/CacheSDWebImageΛར༻͢Δ ΞϓϦ࣮ 5
Realm ΞϓϦ࣮ 5
ΞϓϦ࣮ 5
5 ॺ໊͖URLͷϑΥʔϚοτͱ༗ޮظݶΛอ࣋͢ΔϑΟʔϧυΛ༻ҙ ΞϓϦ࣮
Repository ΞϓϦ࣮ 5
ΞϓϦ࣮ 5
ΞϓϦ࣮ 5
ΞϓϦ࣮ 5 Realm/Remote APIͷΠϯλʔϑΣʔεΛநԽ ➡ RemoteCacheStore (API͚) ➡ LocalCacheStore (Realm͚)
ΞϓϦ࣮ 5 Realm͘͠API͔Βॺ໊͖URLΛऔಘ͢Δ
ΞϓϦ࣮ 5 Realmʹॺ໊͖URLΛอଘ͢Δ
ΞϓϦ࣮ 5
ΞϓϦ࣮ 5 RemoteStore ➡ SignedUrlDataStoreͷAPI࣮ CacheStore ➡ SignedUrlDataStoreͷRealm࣮
ΞϓϦ࣮ 5 RealmʹϨίʔυ͕ଘࡏ͠ͳ͍ͱ͖ʹAPI͔Βॺ໊͖URLΛऔಘ
ΞϓϦ࣮ 5 ΩϟογϡࡁΈͷॺ໊͖URL͕༗ޮظݶΕͷ߹ ࠶APIܦ༝ͰԆͨ͠ॺ໊͖URLΛऔಘ͢Δ
ΞϓϦ࣮ 5 ࠶औಘͨ͠߹ॺ໊͖URLΛΩϟογϡʹอଘͭͭ͠ฦ͢
ը૾ͷDownload/Cache ΞϓϦ࣮ 5
SDWebImage • ͗͢Δॺ໊͖URL͕ΩϟογϡΩʔͱͯ͠ѻ͑ͳ͔ͬͨ • ࣸਅɾಈըϝλσʔλͷ֤छใ͔ΒੜͰ͖ΔΩϟογϡΩʔΛࣗͰੜ͢Δ͜ͱʹͨ͠ • SDImageDownloader/SDImageCache Λݸผʹૢ࡞͢ΔίʔυΛॻ͍ͨ ΞϓϦ࣮ 5
Ռ 6
Ռ 6 Before After
※ͨͩ͠ɺॺ໊͖URL͕Expireͨ͠ͱ͖ʹ࠶औಘͷͨΊͷϦΫΤετ͕ඞཁ ඞཁͳͷCloudFrontΞΫηε͢Δ͚࣌ؒͩ
58.4ms͕ը૾දࣔϦΫΤετ࣌ؒ 1.35sec͔͔͍ͬͯͨࠒ͔ΒൺΔͱ࣮ʹ 22 ഒߴԽ
͞ΒͳΔ՝ 7
վળ͖͢ϙΠϯτ 1. ຊࠃͷAPIϦΫΤετͷൃੜ࠷খݶʹɻ 2. CDNͷΩϟογϡΛࣄલʹߦ͏Α͏ʹɻ Amazon CloudFront 1 3 4
5 6 ຊࠃ Amazon S3 Amazon EC2 2 ͞ΒͳΔ՝ 7
ࠃࡍ݁ࠗͳͲͷՈʹඇޮͰ͋Δ • CDNͷΩϟογϡΛ׆͔͖͠Εͳ͍ύλʔϯ • ྫʣຊͷ්ͱΞϝϦΧͷɻΤοδͷΩϟογϡΛෳճߦ͏ඞཁ͕͋Δɻ • Τοδαʔόʔ⁶S3ΦϦδϯͷ௨৴ʹڑʹىҼ͢ΔϨΠςϯγΛഉআ͖͠Εͳ͍ɻ • ٯʹɺಉ͡ࠃɾҬʹ͓͍ͯΤοδΩϟογϡ͕ޮ͘ͷͰ࠷ॳͷ1ճҎ֎ߴɻ ͞ΒͳΔ՝
7
CDNͷࣄલΩϟογϡػೳ͕ແ͍ • ݁ہɺUIʹىҼ͢ΔϦΫΤετΑΓɺόοΫάϥϯυεϨουʗϓϩηεͰͷࣄલΩϟο γϡ͕Ұ൪༗ޮ • ͪ͜Βݱࡏ։ൃதͰۙதʹϦϦʔε͢Δ༧ఆ ͞ΒͳΔ՝ 7
·ͱΊ 8
·ͱΊ • ը૾Λऔಘɾදࣔ͢Δ͚ͩͰւ֎͚ΞϓϦͰେ͖ͳ՝ʹͳΔͷͰҙʂ • NewRelic SyntheticsͰ؆୯ʹࠃ֎͔ΒͷAPI࣮ߦΛγϛϡϨʔτͰ͖ΔͷͰΦεεϝ • ηΩϡϦςΟΛ୲อͭͭ͠ߴʹදࣔ͢Δઃܭͱ࣮ࣄྫ ·ͱΊ 8
ւ֎ͰࣗࣾͷαʔϏεΛޭ͍ͤͨ͞։ൃऀͷօ͞Μ ઈରʹޭͤ͞ΔͨΊͷใަΛ͠·͠ΐ͏
THANK YOU!!