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
20160907_Akamai_Tech_Deep_Dive
Search
kakerukaeru
September 07, 2016
Technology
0
2.2k
20160907_Akamai_Tech_Deep_Dive
Akamaiを活用したCyberAgentのhogehogeというお題で、20160907 AkamaiTechDeepDiveでお話した奴
後半の画像配信部分のSlide
kakerukaeru
September 07, 2016
Tweet
Share
More Decks by kakerukaeru
See All by kakerukaeru
大規模ImageOptimizer利用案件から学ぶ 安心安全のCDN移行 / Fastly yamagoya 2022
kakerukaeru
1
1.4k
事業と歩む Ameba システム刷新の道 / the-road-to-ameba-system-renovation-aws-summit-online
kakerukaeru
0
1.9k
事業と歩むAmebaシステム刷新の道 / the-road-to-ameba-system-renovation-cadc
kakerukaeru
0
670
The Shining / ~all work and no play makes jack a dull boy~
kakerukaeru
0
420
AmebaとCDNのお付き合いの歴史 / ameba cdn waiwai
kakerukaeru
0
130
fastlyでええかんじにサイトリニューアル @ Yamagoya Meetup 2018 / e-kanzi Website renewal with fastly
kakerukaeru
0
590
ghe_ameba_arekore
kakerukaeru
2
2.2k
はじめるCassandra
kakerukaeru
1
310
ansible is nani
kakerukaeru
1
380
Other Decks in Technology
See All in Technology
HonoとJSXを使って管理画面をサクッと型安全に作ろう
diggymo
0
170
Linux カーネルが支えるコンテナの仕組み / LF Japan Community Days 2025 Osaka
tenforward
1
120
だいたい分かった気になる 『SREの知識地図』 / introduction-to-sre-knowledge-map-book
katsuhisa91
PRO
3
1.4k
デザインとエンジニアリングの架け橋を目指す OPTiMのデザインシステム「nucleus」の軌跡と広げ方
optim
0
100
Introduction to Sansan Meishi Maker Development Engineer
sansan33
PRO
0
310
GraphRAG グラフDBを使ったLLM生成(自作漫画DBを用いた具体例を用いて)
seaturt1e
1
120
入院医療費算定業務をAIで支援する:包括医療費支払い制度とDPCコーディング (公開版)
hagino3000
0
100
コンパウンド組織のCRE #cre_meetup
layerx
PRO
1
250
名刺メーカーDevグループ 紹介資料
sansan33
PRO
0
940
もう外には出ない。より快適なフルリモート環境を目指して
mottyzzz
13
9.7k
現場の壁を乗り越えて、 「計装注入」が拓く オブザーバビリティ / Beyond the Field Barriers: Instrumentation Injection and the Future of Observability
aoto
PRO
1
210
Databricks AI/BI Genie の「値ディクショナリー」をAmazonの奥地(S3)まで見に行く
kameitomohiro
1
400
Featured
See All Featured
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
9
930
A better future with KSS
kneath
239
18k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
30
2.9k
Done Done
chrislema
185
16k
Product Roadmaps are Hard
iamctodd
PRO
55
11k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
990
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Practical Orchestrator
shlominoach
190
11k
Site-Speed That Sticks
csswizardry
13
920
XXLCSS - How to scale CSS and keep your sanity
sugarenia
249
1.3M
A designer walks into a library…
pauljervisheath
209
24k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
Transcript
Akamaiを活用した Amebaの画像配信基盤 株式会社サイバーエージェント 技術本部 Service Reliability Group 岩永 翔
agenda
agenda 3 ❏ 自己紹介 ❏ AkamaiとAmeba ❏ 画像配信基盤の紹介 ❏ atlas
❏ hayabusa ❏ 構成概要 ❏ これからの話
自己紹介
自己紹介 5 岩永 翔(いわなが かける) @kakerukaeru ❏ 株式会社サイバーエージェント ❏ インフラエンジニア
❏ コンテンツ配信担当 ❏ 認証とか課金の基盤も見てます ❏ HashiCorp製品が好き ❏ Akamaiさんもterraform対応してくれないかなー ❏ 渋谷でオススメのカレー屋はチリチリです
AkamaiとAmeba
AkamaiとAmeba 7 ❏ 200X年から利用
AkamaiとAmeba 8 ❏ 200X年から利用 ❏ DSD中心 / ION少なめ(画像配信
AkamaiとAmeba 9 ❏ 200X年から利用 ❏ DSD中心 / ION少なめ(画像配信 ❏ Amebaの画像はだいたいAkamaiに乗ってる
AkamaiとAmeba 10 ❏ 200X年から利用 ❏ DSD中心 / ION少なめ(画像配信 ❏ Amebaの画像はだいたいAkamaiに乗ってる
❏ 画像配信基盤の規模感(ピーク帯
AkamaiとAmeba 11 ❏ 200X年から利用 ❏ DSD中心 / ION少なめ(画像配信 ❏ Amebaの画像はだいたいAkamaiに乗ってる
❏ 画像配信基盤の規模感(ピーク帯 ❏ get ❏ 32Gbps ❏ 250,000 req/s
AkamaiとAmeba 12 ❏ 200X年から利用 ❏ DSD中心 / ION少なめ(画像配信 ❏ Amebaの画像はだいたいAkamaiに乗ってる
❏ 画像配信基盤の規模感(ピーク帯 ❏ get ❏ 32Gbps ❏ 250,000 req/s ❏ post ❏ 2,500,000 file/day
AkamaiとAmeba 13 ❏ 200X年から利用 ❏ DSD中心 / ION少なめ(画像配信 ❏ Amebaの画像はだいたいAkamaiに乗ってる
❏ 画像配信基盤の規模感(ピーク帯 ❏ get ❏ 32Gbps ❏ 250,000 req/s ❏ post ❏ 2,500,000 file/day ❏ offload ❏ 85% ~ 95%
AkamaiとAmeba 14 ❏ Akamaiの機能でやってること
AkamaiとAmeba 15 ❏ Akamaiの機能でやってること ❏ Tiered Distribution
AkamaiとAmeba 16 ❏ Akamaiの機能でやってること ❏ Tiered Distribution ❏ Adaptive Image
Compression
AkamaiとAmeba 17 ❏ Akamaiの機能でやってること ❏ Tiered Distribution ❏ Adaptive Image
Compression ❏ Front End Optimization
AkamaiとAmeba 18 ❏ Akamaiの機能でやってること ❏ Tiered Distribution ❏ Adaptive Image
Compression ❏ Front End Optimization ❏ Prefetch
AkamaiとAmeba 19 ❏ Akamaiの機能でやってること ❏ Tiered Distribution ❏ Adaptive Image
Compression ❏ Front End Optimization ❏ Prefetch ❏ modify Cache-key
AkamaiとAmeba 20 ❏ Akamaiの機能でやってること ❏ Tiered Distribution ❏ Adaptive Image
Compression ❏ Front End Optimization ❏ Prefetch ❏ modify Cache-key ❏ Cache-key統合
AkamaiとAmeba 21 ❏ Akamaiの機能でやってること ❏ Tiered Distribution ❏ Adaptive Image
Compression ❏ Front End Optimization ❏ Prefetch ❏ modify Cache-key ❏ Cache-key統合 ❏ QueryStringを含めたCache-Keyの生成
AkamaiとAmeba 22 ❏ Akamaiの機能でやってること ❏ Tiered Distribution ❏ Adaptive Image
Compression ❏ Front End Optimization ❏ Prefetch ❏ modify Cache-key ❏ Cache-key統合 ❏ QueryStringを含めたCache-Keyの生成 ❏ 意図しないCache効率の落ちそうなQueryParameterを 予めEdge側で削除 ❏ etc ...
画像配信基盤の 紹介
画像配信基盤の紹介 24 ❏ atlasについて
画像配信基盤の紹介 25 ❏ atlasについて ❏ 利用サービス
画像配信基盤の紹介 26 ❏ atlasについて ❏ 200x年から存在
画像配信基盤の紹介 27 ❏ atlasについて ❏ 200x年から存在 ❏ amebaと共に育ってきた基盤 ❏ アメブロ
/ スマートフォンプラットフォーム
画像配信基盤の紹介 28 ❏ atlasについて ❏ 200x年から存在 ❏ amebaと共に育ってきた基盤 ❏ アメブロ
/ スマートフォンプラットフォーム ❏ ブラウザゲーム
画像配信基盤の紹介 29 ❏ atlasについて ❏ 200x年から存在 ❏ amebaと共に育ってきた基盤 ❏ アメブロ
/ スマートフォンプラットフォーム ❏ ブラウザゲーム ❏ CommunityService
画像配信基盤の紹介 30 ❏ atlasについて ❏ 200x年から存在 ❏ amebaと共に育ってきた基盤 ❏ アメブロ
/ スマートフォンプラットフォーム ❏ ブラウザゲーム ❏ CommunityService ❏ 基本的なリサイズやクロップなどを提供
画像配信基盤の紹介 31 ❏ atlasについて ❏ 200x年から存在 ❏ amebaと共に育ってきた基盤 ❏ アメブロ
/ スマートフォンプラットフォーム ❏ ブラウザゲーム ❏ CommunityService ❏ 基本的なリサイズやクロップなどを提供 ❏ amebaにまつわるidに紐付く投稿APIを用意
画像配信基盤の紹介 32 ❏ atlasについて ❏ 200x年から存在 ❏ amebaと共に育ってきた基盤 ❏ アメブロ
/ スマートフォンプラットフォーム ❏ ブラウザゲーム ❏ CommunityService ❏ 基本的なリサイズやクロップなどを提供 ❏ amebaにまつわるidに紐付く投稿APIを用意 ❏ Storageも自前でホスティング ❏ ameba専用画像配信基盤
画像配信基盤の紹介 33 ❏ hayabusaについて
画像配信基盤の紹介 34 ❏ hayabusaについて ❏ 利用サービス
画像配信基盤の紹介 35 ❏ hayabusaについて ❏ 利用サービス
画像配信基盤の紹介 36 ❏ hayabusaについて ❏ 2014年からサービス開始
画像配信基盤の紹介 37 ❏ hayabusaについて ❏ 2014年からサービス開始 ❏ amebaの外の世界で作られたサービスのニーズを満たす 社内 Responsive
Image as Service
画像配信基盤の紹介 38 ❏ hayabusaについて ❏ 2014年からサービス開始 ❏ amebaの外の世界で作られたサービスのニーズを満たす 社内 Responsive
Image as Service ❏ Originを用意しドメインを申請するだけで利用可能
画像配信基盤の紹介 39 ❏ hayabusaについて ❏ 2014年からサービス開始 ❏ amebaの外の世界で作られたサービスのニーズを満たす 社内 Responsive
Image as Service ❏ Originを用意しドメインを申請するだけで利用可能 ❏ よりリッチに / 機能多め
画像配信基盤の紹介 40 ❏ hayabusaについて ❏ 2014年からサービス開始 ❏ amebaの外の世界で作られたサービスのニーズを満たす 社内 Responsive
Image as Service ❏ Originを用意しドメインを申請するだけで利用可能 ❏ よりリッチに / 機能多め ❏ リサイズ / クロップ ❏ フォーマット変換とauto拡張子指定での自動フォーマット選択 ❏ PSDレイヤーとスライス切り出し ❏ 最適化(圧縮) ❏ Autoキャッシング機能
画像配信基盤の紹介 41 ❏ hayabusaについて ❏ 2014年からサービス開始 ❏ amebaの外の世界で作られたサービスのニーズを満たす 社内 Responsive
Image as Service ❏ Originを用意しドメインを申請するだけで利用可能 ❏ よりリッチに / 機能多め ❏ リサイズ / クロップ ❏ フォーマット変換とauto拡張子指定での自動フォーマット選択 ❏ PSDレイヤーとスライス切り出し ❏ 最適化(圧縮) ❏ Autoキャッシング機能 ❏ などなど、よりリッチに社内ニーズを満たす機能を実装
構成概要 atlas
構成概要 / atlas 43 iOS client CDN On Premises front
proxy front proxy varnish cluster varnish cluster varnish cluster convert App varnish cluster Archive Storage front proxy atlas API front proxy MySQL front proxy S3 proxy post get
構成概要 / atlas 参照 44 iOS 自作 Storage群 Archive Storage
varnish cluster varnish cluster front proxy front proxy ❏ Originにくるtrafficの90%ぐらいがAkamai On Premises varnish cluster convert App
構成概要 / atlas 参照 45 iOS 自作 Storage群 Archive Storage
varnish cluster varnish cluster front proxy front proxy ❏ Originにくるtrafficの90%ぐらいがAkamai ❏ 100%にしていきたい On Premises varnish cluster convert App
構成概要 / atlas 参照 46 iOS 自作 Storage群 Archive Storage
varnish cluster varnish cluster front proxy front proxy ❏ Originにくるtrafficの90%ぐらいがAkamai ❏ 100%にしていきたい ❏ pathルールでbackendのstorageを決定 On Premises varnish cluster convert App
構成概要 / atlas 参照 47 iOS 自作 Storage群 Archive Storage
varnish cluster varnish cluster front proxy front proxy ❏ Originにくるtrafficの90%ぐらいがAkamai ❏ 100%にしていきたい ❏ pathルールでbackendのstorageを決定 ❏ backendの決定をするのはvarnish On Premises varnish cluster convert App
構成概要 / atlas 参照 48 iOS 自作 Storage群 Archive Storage
varnish cluster varnish cluster front proxy front proxy ❏ Originにくるtrafficの90%ぐらいがAkamai ❏ 100%にしていきたい ❏ pathルールでbackendのstorageを決定 ❏ backendの決定をするのはvarnish ❏ front proxyはチョットシタ処理を挟むだけで基本右から左へスルー On Premises varnish cluster convert App
構成概要 / atlas 参照 49 iOS 自作 Storage群 Archive Storage
varnish cluster varnish cluster front proxy front proxy ❏ Originにくるtrafficの90%ぐらいがAkamai ❏ 100%にしていきたい ❏ pathルールでbackendのstorageを決定 ❏ backendの決定をするのはvarnish ❏ front proxyはチョットシタ処理を挟むだけで基本右から左へスルー ❏ 800GB * 80 = 64TBのcache層 On Premises varnish cluster convert App
構成概要 / atlas 参照 50 iOS 自作 Storage群 Archive Storage
varnish cluster varnish cluster front proxy front proxy ❏ Originにくるtrafficの90%ぐらいがAkamai ❏ 100%にしていきたい ❏ pathルールでbackendのstorageを決定 ❏ backendの決定をするのはvarnish ❏ front proxyはチョットシタ処理を挟むだけで基本右から左へスルー ❏ 800GB * 80 = 64TBのcache層 ❏ VarnishのCache ClusterでThundering Herd問題の対策 On Premises varnish cluster convert App
構成概要 / atlas 参照 51 iOS 自作 Storage群 Archive Storage
varnish cluster varnish cluster front proxy front proxy ❏ Originにくるtrafficの90%ぐらいがAkamai ❏ 100%にしていきたい ❏ pathルールでbackendのstorageを決定 ❏ backendの決定をするのはvarnish ❏ front proxyはチョットシタ処理を挟むだけで基本右から左へスルー ❏ 800GB * 80 = 64TBのcache層 ❏ VarnishのCache ClusterでThundering Herd問題の対策 ❏ front proxyでvarnishのhash ringを所持 On Premises varnish cluster convert App
構成概要 / atlas 参照 52 iOS 自作 Storage群 Archive Storage
varnish cluster varnish cluster front proxy front proxy ❏ Originにくるtrafficの90%ぐらいがAkamai ❏ 100%にしていきたい ❏ pathルールでbackendのstorageを決定 ❏ backendの決定をするのはvarnish ❏ front proxyはチョットシタ処理を挟むだけで基本右から左へスルー ❏ 800GB * 80 = 64TBのcache層 ❏ VarnishのCache ClusterでThundering Herd問題の対策 ❏ front proxyでvarnishのhash ringを所持 ❏ objectとcache serverを1対1にしてcache hit率を上げる On Premises varnish cluster convert App
構成概要 / atlas Storage 53 iOS 自作 Storage群 Archive Storage
varnish cluster varnish cluster front proxy front proxy ❏ atlasのStorageは現在2種類 On Premises
構成概要 / atlas Storage 54 iOS 自作 Storage群 Archive Storage
varnish cluster varnish cluster front proxy front proxy ❏ atlasのStorageは現在2種類 ❏ HotなデータをS3に。 ❏ Warmなデータをgo製の自作Archive Storageに。 On Premises
構成概要 / atlas Storage 55 iOS 自作 Storage群 Archive Storage
varnish cluster varnish cluster front proxy front proxy ❏ atlasのStorageは現在2種類 ❏ HotなデータをS3に。 ❏ Warmなデータをgo製の自作Archive Storageに。 ❏ チョット前までは複数の Storageを抱えていた ❏ WebDAV ❏ Voldemort ❏ OpenStack Swift On Premises
構成概要 / atlas Storage 56 iOS 自作 Storage群 Archive Storage
varnish cluster varnish cluster front proxy front proxy ❏ atlasのStorageは現在2種類 ❏ HotなデータをS3に。 ❏ Warmなデータをgo製の自作Archive Storageに。 ❏ チョット前までは複数の Storageを抱えていた ❏ WebDAV ❏ Voldemort ❏ OpenStack Swift ❏ file数が多すぎてinodeのキャッシュが乗り切らず Storageがスケールしくなってきた段階で 新規データをS3に逃がす対応を入れた On Premises
構成概要 / atlas Storage 57 iOS 自作 Storage群 Archive Storage
varnish cluster varnish cluster front proxy front proxy ❏ atlasのStorageは現在2種類 ❏ HotなデータをS3に。 ❏ Warmなデータをgo製の自作Archive Storageに。 ❏ チョット前までは複数の Storageを抱えていた ❏ WebDAV ❏ Voldemort ❏ OpenStack Swift ❏ file数が多すぎてinodeのキャッシュが乗り切らず Storageがスケールしくなってきた段階で 新規データをS3に逃がす対応を入れた ❏ またコスト面も加味し、定期的に S3からWarmなデータを自作Archive Storageにマイグレーションするようにしている。 On Premises
構成概要 hayabusa
構成概要 / hayabusa 59 iOS client CDN AWS Varnish +
hayabusa App ECS Management Service Origins Cache
これからの事
これからの事 61 ❏ Cache-Keyの統合 ❏ 歴史的経緯で対応ドメインが数十個ある
これからの事 62 ❏ Cache-Keyの統合 ❏ 歴史的経緯で対応ドメインが数十個ある ❏ 配信のconfigを分けてしまっていた事もあり、単一オリジンか つ同一コンテンツであるにもかかわらずCache-Keyが別れる ような状況
これからの事 63 ❏ Cache-Keyの統合 ❏ 歴史的経緯で対応ドメインが数十個ある ❏ 配信のconfigを分けてしまっていた事もあり、単一オリジンか つ同一コンテンツであるにもかかわらずCache-Keyが別れる ような状況
❏ 規約違反の画像が上がってpurgeしても、他ドメインでの キャッシュが残ってしまう状態
これからの事 64 ❏ Cache-Keyの統合 ❏ 歴史的経緯で対応ドメインが数十個ある ❏ 配信のconfigを分けてしまっていた事もあり、単一オリジンか つ同一コンテンツであるにもかかわらずCache-Keyが別れる ような状況
❏ 規約違反の画像が上がってpurgeしても、他ドメインでの キャッシュが残ってしまう状態 ❏ 煩雑化したCache-Keyを統合し、運用とパフォーマンスの観 点で最適化を図る
これからの事 65 ❏ Cache-Keyの統合 ❏ 歴史的経緯で対応ドメインが数十個ある ❏ 配信のconfigを分けてしまっていた事もあり、単一オリジンか つ同一コンテンツであるにもかかわらずCache-Keyが別れる ような状況
❏ 規約違反の画像が上がってpurgeしても、他ドメインでの キャッシュが残ってしまう状態 ❏ 煩雑化したCache-Keyを統合し、運用とパフォーマンスの観 点で最適化を図る ❏ Edge側でのCache-Keyの作り方を統一するということ
これからの事 66 ❏ Aqua ION化 ❏ サイトのHTTP/2化に伴う画像配信基盤のHTTP/2化対応 ❏ hayabusaもAkamai化
これからの事 67 ❏ Aqua ION化 ❏ サイトのHTTP/2化に伴う画像配信基盤のHTTP/2化対応 ❏ hayabusaもAkamai化 ❏
Cloud Monitor導入 ❏ Edge側のパフォーマンスや調査をリアルタイムで行うのはデ フォルトだと難しい。問題発生時の調査が遅れたりパフォーマ ンスの可視化が出来ていないとそれだけ、配信品質が下がっ てしまう ❏ ので、可視化していきます。
おわり 68 thank you :)