Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Recap CDN, Edge, WebAssembly | ワインと鍋.js#1

Recap CDN, Edge, WebAssembly | ワインと鍋.js#1

ワインと鍋.js#1 の発表資料です。

sadnessOjisan

July 23, 2022
Tweet

More Decks by sadnessOjisan

Other Decks in Programming

Transcript

  1. ⽤語 • FaaS: Cloud Functions, Lambda のようなもの • CDN: Fastly

    のようなもの • エッジコンピューティング: Fastly Compute@Edge, cloudflare workers のようなもの 例外がついてまわるので、定義を与える前にまずは製品名でニュアンス を共有させてください。
  2. What is edge • CDN⽤語集 • https://www.cloudflare.com/ja-jp/learning/cdn/glossary/edge-server/ • edge: For

    Internet devices, the network edge is where the device, or the local network containing the device, communicates with the Internet. The edge is a bit of a fuzzy term; for example a userʼs computer or the processor inside of an IoT camera can be considered the network edge, but the userʼs router, ISP, or local edge server are also considered the edge. The important takeaway is that the edge of the network is geographically close to the device, unlike origin servers and cloud servers, which can be very far from the devices they communicate with. • データ処理をデバイスに近いところで利⽤すれば性能向上やコスト削減が⾒込め る
  3. Edge vs CDN • CDNは Content Delivery Network • インターネットコンテンツを⾼速配信するために連携する地理的に分

    散されたサーバーのグループ • https://www.cloudflare.com/ja-jp/learning/cdn/what-is-a- cdn/ • Push型 • コンテンツをデプロイする • Pull型 • CDNサーバーにキャッシュを持たせる • キャッシュは Cache-Control や Surrogate-Control で制御で きる
  4. Edge vs FaaS / Severless • FaaS は Function as

    a Service • サーバープロセスを持たず、関数単位でのデプロイ、実⾏が可能 • Edgeと違い、ロケーションは固定 • Edgeは呼び出し元に近いPOPで実行される
  5. Edge Computing の特徴 地理的に近い場所でオリジンサーバ ーに近いことができる • CDN のように使える • Cacheの操作

    • req/res の編集 • サーバーレスのようにも使える • ストレージアクセス • SSR
  6. とはいえ、Edge の注⽬は過剰な気はする • Cloudflare Workers 注⽬されすぎでは︖ • 国内サービスにおいてはエッジもオリジンも東京では︖ • エッジじゃなくても代⽤⼿段はたくさんある

    • キャッシュを使いたい、ReqResいじりたい: CDN • 負荷分散したい: スケーリングする系のPaaS • 前段が欲しい: リバースプロキシ • ⼀つ圧倒的な強みはある • VCL以外の⾔語でもコントロールができる
  7. ポータビリティに優れる • WASIの実⾏環境を⽤意すれば、本番、開発、テスト、ローカル環境 で実⾏ができるようになる • 書いたロジックのテストも可能になる。VCL時代は準備が⼤変だった • Viceroy (Fastly) •

    Viceroy provides local testing for developers working with Compute@Edge. • Rustで書こうが、JSで書こうが、Wasmに変換してしまえば⼿元の 検証環境として使える • https://github.com/fastly/Viceroy
  8. 起動時間を減らす工夫 • JSエンジンやアプリケーションの起動は時間がかかる • コールドスタートで時間がかかる原因 • Wizer: 事前コンパイル. コードがデプロイされる前に、ビルドステッ プの⼀部として、JS

    エンジンを使って JS コードを初期化の終わりま で実⾏。JSコードのバイトコードをスナップショットとして扱う。 https://bytecodealliance.org/articles/making-javascript-run-fast-on-webassembly bytecode
  9. wizer • The WebAssembly Pre-initializer • Wasm の init を実⾏し、そのときの

    wasm instance の状態をスナッ プショットする • ライブラリとしてはRustから使うが、コマンドとしてはC++からも使 える https://github.com/bytecodealliance/wizer
  10. V8 isolate • 軽量な実⾏環境 • ランタイムごとに数千の isolate を実⾏ 可能 •

    メモリは分離されている • Nodeのプロセスを⽴てるより、遥かに 少ないメモリと起動時間で実現できる https://developers.cloudfla re.com/workers/learning/ how-workers-works/
  11. V8 snapshot • Isolate Context を dump したもの • スナップショットをヒープに直接デシリアライズして、初期化された

    コンテキストを取得 • コンテキストの作成にかかる時間を40ミリ秒から2ミリ秒未満に短縮 • 初期化の短縮、コールドスタートの時間を短縮できる https://v8.dev/blog/custom-startup-snapshots
  12. WasmとV8の⽐較 • セキュリティ • リクエストごとの分離 vs V8 Isolate • パフォーマンス

    • Wizer vs V8 Snapshot • V8 と Wasm 、どっちが優れているか • 知りません • 計測を考えましたが、ベンチの設計が難しくて挫折しました • 各サービスがそのうち⽐較してくれると思っています
  13. PaywallとCache • 記事の有料部分のことをPaywall という • Ex) ⽇本経済新聞、Note • ユーザーの認証状態によって、Paywallのキャッシュを出し分けたい •

    アクセス権限が弱い⼈が、アクセス権限が強いキャッシュを引き当て てはいけない https://www.nikkei.com/article/DGXZQOUA223TB0S2A72
  14. Vary header • キャッシュは、オリジンサーバーからvary header をつけることで出 し分けられる • Vary: Vary

    HTTP レスポンスヘッダーは、オリジンのサーバーから新 しく要求するのではなく、キャッシュされたレスポンスを使⽤できる かどうかを決定するために将来のリクエストヘッダーをどのように⼀ 致させるかを決定します (MDN)
  15. まとめ • Wasm が動く edge サービスが流⾏りつつある • Wasm を採⽤することで速度、セキュリティ⾯においても良い •

    これまでCDNの操作はVCLほぼ⼀択だったが、Wasm対応によって⾃ 分が⼀番得意な⾔語を使える、Pull型CDNとしても使える