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

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

Transcript

1. JSConf EU XࢀՃใࠂ wasmฤ Cloudflare Workersͷ঺հ NodeֶԂ34࣌ݶ໨ 2019-06-27 Tomohide Takao
2. whoami • ߴඌ ஌ल(͔͓ͨ ͱ΋ͻͰ) • ౦ژӺۙ߫Ͱ Node.js ͱ͔ॻ͍͍ͯ·͢ɻ • ޷͖ͳݴޠ͸ Rust Ͱ͢ɻ • Wasmͷ࿩୊΋େ޷͖Ͱ͢ɻ • Twitter: @dorayaki_kun • GitHub: dorayakikun
3. ؓ࿩ٳ୊
4. ͜͜1ʙ2೥ͰWasmͷ࿩୊͕૿͖͑ͯ·ͨ͠
5. JSConf EU΋ྫ֎Ͱ͸ͳ͍Ͱ͢ ͜͜1ʙ2೥ͰWasmͷ࿩୊͕૿͖͑ͯ·ͨ͠
6. Wasmʹؔ࿈ͨ͠ൃද • day1 • Let’s build a JavaScript Engine • day2 • Simulating Sand: 
 Building Interactivity With WebAssembly • JavaScript’s Journey to the Edge
7. 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
8. 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/
9. JavaScript’s Journey to the Edge • طଘͷwebඳըઓུͱEdge Side Renderingͷ঺հ • Cloudflare Workers(+ workers.dev) & wranglerͷ঺հ ࠓճ͸͜ͷൃදΛਂ۷Γ͍͖ͯ͠·͢
10. Webͷݱঢ়Λ੔ཧͯ͠ΈΔ
11. JavaScriptͷbyteαΠζ • ঃʑʹ͕࣮ͩ֬ʹ্ঢ͍ͯ͠Δ • ͜ͷ3೥ͰϞόΠϧ͸50%Ҏ্ϑΝΠϧαΠζ͕૿Ճ https://beta.httparchive.org/reports/state-of-javascript#bytesjs
12. TimeToInteractive • TTI͸9ඵҎ্ • ·͊·͊஗͍ https://beta.httparchive.org/reports/loading-speed#ttci
13. طଘͷઓུ • 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
14. ͲͪΒͷઓུ΋τϨʔυΦϑ ଞͷઓུ͸ͳ͍ͷ͔?
15. Edge Side Renderingͱ͍͏ ৽ͨͳઓུ
16. Edge Side Rendering • Τοδαʔό্ͰHTMLΛrendering • ΤοδαʔόͷಛੑΛੜ͔ͯ͠ɺ
 Time to First ByteΛվળ • Τοδαʔό্Ͱrendering͢Δ͜ͱͰɺ
 Time to Interactive·Ͱͷ࣌ؒΛվળ • SSRͱCSRͷྑ͍ͱ͜औΓ͕Ͱ͖Δ࢓૊Έ

17. ͦΜͳEdge Side Rendering Ͱ͖ΔαʔϏε͕… Cloudflare Workers
18. Cloudflare Workers • Cloudflare͕ॴ༗͢ΔΤοδαʔό্ͰserverlessΞϓϦ έʔγϣϯΛಈ࡞ͤ͞ΔαʔϏε • ίʔυͷσϓϩΠ͸web·ͨ͸wranglerͰߦ͏ • ݱঢ়αϙʔτ͞Ε͍ͯΔݴޠ͸JavaScript, Wasm(*) *ެࣜͷTemplateͰRustͷྫ͕͋Δ͕ɺ࠷ޙ͸Wasmʹม׵͍ͯ͠Δ
 multithreadʹରԠ͍ͯ͠ͳ͍WasmΛͳͥରԠݴޠͱ͍ͯ͠Δ͔͸ޙड़ https://workers.cloudflare.com/
19. Cloudflare Workersͷཁૉٕज़ • V8: Isolates • ͳͥ࠾༻ͨ͠ͷ͔? • ҆શੑ͕อূ͞Εͳ͍ίʔυΛɺଞͷ؀ڥ΁ӨڹΛ༩͑ͣ ࣮ߦ͔ͨͬͨ͠ • ্ه࣮ݱͷͨΊʹ…v8:Isolatesͷ2ͭͷಛੑ͕࠷దͩͬͨ 1. ୯ҰϓϩηεͰ͍ͭ͘΋ͷisolate contextΛಈ͔ͤΔ 2. isolate contextΛγʔϜϨεʹ੾Γସ͑ΒΕΔ https://blog.cloudflare.com/cloud-computing-without-containers/
20. ͦΕҎલʹݕ౼͞Εٕͨज़ • Lua • Sandboxʹ࣮ߦ͕Ͱ͖ͳ͍ͨΊݟૹΓ • k8sͳͲͷίϯςφ؀ڥ • ҎԼͷཧ༝͔ΒݟૹΓ • ͖ͪΜͱӡ༻͢Δͱ͓͕͔͔ۚΔ • εέʔϧ͸Մೳ͕ͩɺ͞΄Ͳ༰қͰ͸ͳ͍
21. Isolatesͱ VM / Containerͷൺֱ • ҎԼͷ2ͭͷ؍఺Ͱൺֱ • Code Footprint • Memory Usage
22. Code Footprint https://www.youtube.com/watch?v=MBndZddVQdw&feature=youtu.be&t=1025 0 2500 5000 7500 10000 Code Footprint 1 100 10000 VM Container Isolates
23. Memory Usage 0 250 500 750 1000 Memory Usage 5 100 1,000 VM Container Isolates
24. ͳͥWasmରԠ͍ͯ͠Δ? • IsolateϕʔεͷγεςϜͰ͸ɺ
 ίϯύΠϧࡁΈͷίʔυΛ࣮ߦͰ͖ͳ͍ • Ϗϧυ͕ඞཁͳطଘΞϓϦͷϙʔςΟϯάखஈͱͯ͠ WasmΛఏڙ͍ͯ͠Δ
25. wrangler • Cloudflare Workers༻ͷcliπʔϧ • Cloudflare WorkersͷϓϩδΣΫτ࡞੒΍Ϗϧυɺ
 publish͕Ͱ͖Δ • npm install -g, cargo install͍ͣΕ͔ͰಋೖՄೳ https://github.com/cloudflare/wrangler
26. Terrariumͱͷൺֱ • Terrariumͱ͸? • Fastly͕ఏڙ͢ΔEdge Computing Platform • ઐ༻ͷWasmΛ༻ҙͯ͠ಈ࡞ͤ͞Δ • ରԠ͍ͯ͠Δͷ͸C, Rust, Assembly Script • ཪଆͷ࢓૊Έͱͯ͠lucet(ϧηοτ)Λར༻͍ͯ͠Δ https://wasm.fastlylabs.com/docs
27. Terrariumͱͷൺֱ • Wasm͔͠ར༻Ͱ͖ͳ͍ • lucet಺෦ͰWASI(ϫζΟ)͕ར༻͞Ε͍ͯΔͷͰ
 ௿ϨΠϠʔͷૢ࡞΋૝ఆ͍ͯͦ͠͏ • ಉ͡TerrariumσϓϩΠࢿ࢈ؒͰར༻Ͱ͖Δ
 Key Value StoreΛ͍࣋ͬͯΔ
28. Terrariumͱͷൺֱ Terrarium Workers
29. Terrariumͱͷൺֱ • ಠࣗύοέʔδͷhttp_guestΛར༻͢Δඞཁ͕͋Δ • Workers͸୯७ͳServiceWorkerͷ࣮૷Ͱ
 ϋʔυϧ͸௿͍(ϑϩϯτΤϯυΤϯδχΞ؍఺Ͱ)
30. Edge Side Rendering͸
 ༗ޮͳͷ͔ • άϩʔόϧͳαʔϏεͷ৔߹ɺࢫຯ͕͋Γͦ͏ • ҰํͰԿΛΤοδαʔόʹͤ͞Δ͔͸ٞ࿦ͷ༨஍͕͋Δ
31. Edge Side Rendering͸
 ༗ޮͳͷ͔ • άϩʔόϧͳαʔϏεͷ৔߹ɺࢫຯ͕͋Γͦ͏ • ҰํͰԿΛΤοδαʔόʹͤ͞Δ͔͸ٞ࿦ͷ༨஍͕͋Δ Α͍࢖͍ํ͋ͬͨΒɺڭ͍͑ͯͩ͘͞…
32. Thanks