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

Cloudflrea Workersの紹介 / Introduce Cloudflare Workers. ~Think about the Edge Side Rendering ~

Cloudflrea Workersの紹介 / Introduce Cloudflare Workers. ~Think about the Edge Side Rendering ~

Cloudflare Workersの紹介と、サービスを下支えする技術について。
FastlyのTerrariumとの思想の違いについても考察をまとめています。

Tomohide Takao

June 27, 2019
Tweet

More Decks by Tomohide Takao

Other Decks in Programming

Transcript

  1. whoami • ߴඌ ஌ल(͔͓ͨ ͱ΋ͻͰ) • ౦ژӺۙ߫Ͱ Node.js ͱ͔ॻ͍͍ͯ·͢ɻ •

    ޷͖ͳݴޠ͸ Rust Ͱ͢ɻ • Wasmͷ࿩୊΋େ޷͖Ͱ͢ɻ • Twitter: @dorayaki_kun • GitHub: dorayakikun
  2. Wasmʹؔ࿈ͨ͠ൃද • day1 • Let’s build a JavaScript Engine •

    day2 • Simulating Sand: 
 Building Interactivity With WebAssembly • JavaScript’s Journey to the Edge
  3. Let’s build a JavaScript Engine • Rust੡ͷJavaScript • RustͷEnum΍pattern matchΛར༻ͯ͠ɺLexingʙ

    Execution·ͰΛ࣮૷ • ൃදதͷσϞͰ͸wasm-bindgenΛར༻ͯ͠ϒϥ΢β্Ͱ WasmԽͨ͠JSRuntimeΛಈ͔͍ͯ͠·ͨ͠ https://www.youtube.com/watch?v=_uD2pijcSi4 https://jason-williams.co.uk/building-a-js-interpreter-in-rust-part-1/#more-140 https://jason-williams.co.uk/building-a-js-interpreter-in-rust-part-2/#more-165
  4. Simulating Sand: Building Interactivity With WebAssembly • ϒϥ΢βήʔϜͷmodͱͯ͠WasmΛ࠾༻ͨ͠࿩ • WasmΛ࠾༻ͨ͠എܠ

    • SandboxԽ͞Ε͓ͯΓɺηʔϑςΟ • ͢Ͱʹ࣮༻Խ͞Ε͍ͯΔٕज़ • wasm-bindgen / wasm-packͷར༻͕༰қͩͬͨ https://2019.jsconf.eu/max-bittker/simulating-sand-building-interactivity-with-webassembly.html https://twitter.com/MaxBittker https://github.com/MaxBittker https://maxbittker.com/
  5. JavaScript’s Journey to the Edge • طଘͷwebඳըઓུͱEdge Side Renderingͷ঺հ •

    Cloudflare Workers(+ workers.dev) & wranglerͷ঺հ ࠓճ͸͜ͷൃදΛਂ۷Γ͍͖ͯ͠·͢
  6. طଘͷઓུ • SSR + Cache • ॊೈͳରԠ͕Ͱ͖Δ • ҰํɺTime to

    First Byte͕஗͍ • CSR + Cache • Time to First Byte͕଎͍ • ҰํɺFirst Contentful Paint͔ΒTime to Interactive
 ·Ͱϥά͕͋Δ https://developers.google.com/web/updates/2019/02/rendering-on-the-web
  7. Edge Side Rendering • Τοδαʔό্ͰHTMLΛrendering • ΤοδαʔόͷಛੑΛੜ͔ͯ͠ɺ
 Time to First

    ByteΛվળ • Τοδαʔό্Ͱrendering͢Δ͜ͱͰɺ
 Time to Interactive·Ͱͷ࣌ؒΛվળ • SSRͱCSRͷྑ͍ͱ͜औΓ͕Ͱ͖Δ࢓૊Έ

  8. Cloudflare Workers • Cloudflare͕ॴ༗͢ΔΤοδαʔό্ͰserverlessΞϓϦ έʔγϣϯΛಈ࡞ͤ͞ΔαʔϏε • ίʔυͷσϓϩΠ͸web·ͨ͸wranglerͰߦ͏ • ݱঢ়αϙʔτ͞Ε͍ͯΔݴޠ͸JavaScript, Wasm(*)

    *ެࣜͷTemplateͰRustͷྫ͕͋Δ͕ɺ࠷ޙ͸Wasmʹม׵͍ͯ͠Δ
 multithreadʹରԠ͍ͯ͠ͳ͍WasmΛͳͥରԠݴޠͱ͍ͯ͠Δ͔͸ޙड़ https://workers.cloudflare.com/
  9. Cloudflare Workersͷཁૉٕज़ • V8: Isolates • ͳͥ࠾༻ͨ͠ͷ͔? • ҆શੑ͕อূ͞Εͳ͍ίʔυΛɺଞͷ؀ڥ΁ӨڹΛ༩͑ͣ ࣮ߦ͔ͨͬͨ͠

    • ্ه࣮ݱͷͨΊʹ…v8:Isolatesͷ2ͭͷಛੑ͕࠷దͩͬͨ 1. ୯ҰϓϩηεͰ͍ͭ͘΋ͷisolate contextΛಈ͔ͤΔ 2. isolate contextΛγʔϜϨεʹ੾Γସ͑ΒΕΔ https://blog.cloudflare.com/cloud-computing-without-containers/
  10. Memory Usage 0 250 500 750 1000 Memory Usage 5

    100 1,000 VM Container Isolates
  11. wrangler • Cloudflare Workers༻ͷcliπʔϧ • Cloudflare WorkersͷϓϩδΣΫτ࡞੒΍Ϗϧυɺ
 publish͕Ͱ͖Δ • npm

    install -g, cargo install͍ͣΕ͔ͰಋೖՄೳ https://github.com/cloudflare/wrangler
  12. Terrariumͱͷൺֱ • Terrariumͱ͸? • Fastly͕ఏڙ͢ΔEdge Computing Platform • ઐ༻ͷWasmΛ༻ҙͯ͠ಈ࡞ͤ͞Δ •

    ରԠ͍ͯ͠Δͷ͸C, Rust, Assembly Script • ཪଆͷ࢓૊Έͱͯ͠lucet(ϧηοτ)Λར༻͍ͯ͠Δ https://wasm.fastlylabs.com/docs