The shift to the edge

The way we build web applications evolved over the decades - from on-prem servers named after your favourite Star Wars characters to autoscaling cloud clusters and serverless functions. Throughout this journey the architecture paradigm shifted towards more distributed model. Whether that’s your CMS, monitoring system or authorisation layer - it’s most likely just an endpoint you exchange data with. At the end of the day, every HTTP request goes through various middleware layers and requires both server- (SSR) and client-side rendering (CSR).

Recently, a new piece of tech appeared on the landscape - WebAssembly. It became 4th official language on the Web (following HTML, CSS and JavaScript) and was initially meant to run in the browser and improve CSR. It quickly turned out that WebAssembly on the server is also a thing and can revolutionise the way we think of web apps.

Some providers like Fastly and Cloudflare adopted WebAssembly and allow you to run custom code at the edge. That opens up completely new possibilities - authentication, personalised content rendering, A/B testing - you name it. Everything as close to end users as possible.

During my talk I’d like to show you what edge computing offers at this stage and how it can be integrated with AEM as a Cloud Service.

Transcript

1. EUROPE'S LEADING AEM DEVELOPER CONFERENCE 27th – 29th SEPTEMBER 2021 The shift to the edge Jakub Wądołowski, diva-e (@jwadolowski)
2. Web standards HTML JavaScript CSS
3. Web standards HTML JavaScript CSS WebAssembly
4. 4 WebAssembly (WASM)
5. Buzzword bingo
6. ▪ Binary instruction format for a conceptual machine ▪ Compilation target for other languages ▪ Supported in all major browsers since 2017 ▪ Runs outside of the browser too! WebAssembly https://flic.kr/p/RJ5xEs
9. ▪ Simple ▪ Small & portable ▪ Streamable ▪ Fast & secure WASM features https://flic.kr/p/e7noPK
11. WebAssembly Text (WAT)
13. WASM in the wild
14. 14 WebAssembly beyond the browser
15. ▪ Compiler ▪ Runtime ▪ Wasmer ▪ Wasmtime ▪ Lucet ▪ … Server-side WebAssembly https://flic.kr/p/dD6gQr
16. ▪ Fastly Compute@Edge ▪ Cloudflare Workers ▪ WasmEdge Runtime (CNCF sandbox project) ▪ AWS Lambda@Edge ▪ … Edge computing https://flic.kr/p/2m47Daf
17. AEM as a Cloud Service https://flic.kr/p/FWq4ez ▪ Paradigm shift ▪ Mindset change ▪ New challenges and opportunities
20. ▪ “Let AEM resolve and handle it” ▪ Rewrite maps ▪ External service/function Vanity URL approaches https://flic.kr/p/qtyGZf
23. ▪ Time limited redirects ▪ Geo-redirects ▪ Auth-aware Extended vanity URLs https://flic.kr/p/pvUYGb
25. WASM service development flow
26. WASM service deployment demo https://flic.kr/p/27Py5HK
27. Content stitching at the edge https://flic.kr/p/opCnxv ▪ Edge Side Includes (ESI) ▪ Templating libraries ▪ Handlebars ▪ Tera (~Jinja2) ▪ Liquid ▪ …
29. OAuth at the edge https://flic.kr/p/zwVNBh ▪ https://www.fastly.com/blog/simplifying- authentication-with-oauth-at-the-edge
30. Content Security Policy (CSP) logging https://flic.kr/p/iYxHLh ▪ Browser security feature ▪ Violation == POST request ▪ Log collection
32. ▪ Content stitching (incl. SSR) ▪ A/B testing ▪ Authentication ▪ Personalisation ▪ Ad targeting ▪ Games?! Compute@Edge use cases https://flic.kr/p/XqGdcM
34. ▪ Supported languages ▪ Rust (limited availability) ▪ AssemblyScript (Beta) ▪ JavaScript (Beta) ▪ Constraints ▪ max 32 backend requests ▪ max 50 MB binary ▪ max 2 min of runtime / request ▪ max 50ms of CPU time + 128 MB memory / request The state of Compute@Edge https://flic.kr/p/23CGdL8
35. Thank you!