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
Edgeコンピューティング 入門
Search
Seiya Nuta
October 25, 2023
0
600
Edgeコンピューティング 入門
Seiya Nuta
October 25, 2023
Tweet
Share
Featured
See All Featured
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.5k
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.7k
A Tale of Four Properties
chriscoyier
161
23k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
36
6.1k
Automating Front-end Workflow
addyosmani
1371
200k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
54k
For a Future-Friendly Web
brad_frost
180
10k
It's Worth the Effort
3n
187
28k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
10
630
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
23
1.5k
GraphQLとの向き合い方2022年版
quramy
49
14k
Transcript
Edgeコンピューティング 入門 怒田 晟也 <
[email protected]
> NIKKEI Tech Talk (Oct 2023)
ぬた
一般的なWebサービスの設計 ユーザ CDN バックエンド 10 ms 50 ms
ユーザに近いCDNを活用した高速化 ユーザ CDN バックエンド 10 ms ユーザのより近くから キャッシュを返す 一般的なWebサービスの設計 50
ms
CDNで色々したい ユーザ CDN バックエンド 10 ms キャッシュが返せるなら リダイレクションしたい A/Bテストしたい 認証したい
rewriteしたい 一般的なWebサービスの設計 50 ms
Edge コンピューティング
「Edgeコンピューティング」の2つの見方 ⬩ 「CDNのプラグイン」としてのEdgeコンピューティング ⬩ 「バックエンド実行環境」としてのEdgeコンピューティング
CDNの機能を「自分で」拡張できる (ミドルウェア) 「CDNのプラグイン」としての Edgeコンピューティング ユーザ CDN CDN上のバックエンド (認証、A/Bテストなど) バックエンド リクエスト内容
CDNの振る舞い変更 (リダイレクトなど)
「バックエンド実行環境」としての Edgeコンピューティング ユーザ ( 米国リージョン) バックエンド ( 日本リージョン) 150 ms
ユーザにより近い部分でアプリを実行できる 10 ms ユーザ ( 米国リージョン) CDN上の バックエンド ( 米国リージョン)
「バックエンド実行環境」としての Edgeコンピューティング ⬩ Edge SSR (Server Side Rendering) ⬩ API エンドポイント ⬩ OGイメージ動的生成 + CDNキャッシュ
注意点
バックエンドのリージョンに注意 10 ms ユーザ ( 米国リージョン) CDN上の バックエンド ( 米国リージョン)
導入すれば速くなるわけではない PostgreSQL データベース ( 日本リージョン) 150 ms
バックエンドのリージョンに注意 導入すれば速くなるわけではない 10 ms ユーザ ( 米国リージョン) CDN上の バックエンド (
米国リージョン) 分散 データベース ( 米国リージョン) 10 ms 分散 データベース ( 日本リージョン) 裏で同期
CPU・メモリバウンドの処理には不向き 限られた計算資源 Cloudflare Workers Fastly Compute@Edge Vercel Edge Functions
アプリケーションはできるだけ小さく 大きいアプリではコールドスタート時間が発生する (場合もある) https://blog.cloudflare.com/better-micro-frontends/
実行環境
旧来のサーバーレス Edgeなサーバーレス Ser ハードウェア Ser ホストOS Ser Hardware アプリ (プロセス)
OS Ser 言語処理系 (V8/Wasmtimeなど) Serアプリ (グリーンスレッド ) アプリ (プロセス) ユーザー 空間 より軽量・より細かい隔離技術への移行 HW仮想化 Serアプリ (グリーンスレッド ) Ser ゲストOS Ser ゲストOS
Cloudflare Workers / Vercel Edge API JavaScript主体のAPIデザイン ⬩ V8 JavaScriptエンジンベース
⬩ 言語処理系レベル (V8 Isolate) で隔離 ⬩ 同じインスタンスを使い回してコールドスタート (msオーダー) を回避 ⬩ JavaScriptメイン + WebAssembly (C, C++, Rust) ⬩ API は Webブラウザから拝借: fetch, Request, …
WinterCG: Web-interoperable Runtimes Community Group JavaScriptメインなプラットフォーマーたち
None
Fastly Compute@Edge API 言語に依存しないAPIデザイン ⬩ WebAssembly エンジンベース (JavaScriptインタプリタ丸ごとコンパイル) ⬩ 言語処理系レベルで隔離
⬩ 毎回新しいインスタンスで実行される (μsオーダーで起動できる) ⬩ JavaScript, Rust, Go 用の公式SDK ⬩ API は Webブラウザから拝借: fetch, Request, …
Bytecode Alliance WebAssemblyメインなプラットフォーマーたち
“Edge” な環境 vs. コンテナ コンテナに比べると制約がある ⬩ Node.jsでもWebブラウザでもない独特なJavaScriptの世界 ⬩ コンテナの方が自由自在 ⬩
“Edge” な環境はスケーラビリティのための一種の妥協 ⬩ 早い起動時間・スケールアウトの面倒を任せたい場合に “Edge” が便利