## Edge Computing + Jamstack. Is it the future of the Internet? Note: * I apologize for the clickbait title. * Maybe wrods "the future of the Internet" do sound too strong for my talk. * Especially with all the hype around Web3 concepts such as Blockhain and AI. * But I just wanted to share with you some trends that I see in the industry and showcase some of the technologies that I've been playing with at my spare time to build sydjango.org website. * I want to start my talk by making a prediction.

__640K of RAM ought to be enough for anybody__ Note: - No that's not my prediction.

__640K [of RAM] ought to be enough for anybody__ __(© Bill Gates, 1981)__ Note: - This is what Bill Gates said in 1981. - I have a lot of respect to Gates, in my opinion he is one of the best tech visioners of all times. - So if wasn't afraid to make mistakes, I shouldn't be afraid it too.

### My prediction At least 50% of all web applications in the world will be completely hosted on edge infrastructure by 2034. Note: * So my predictions is... * And hopefull by the end of this talk you can you can see what makes me to say this.

### What is Edge Computing? - **Late 90s.** CDNs are invented to solve fundamental problem of the Internet - network latency and traffic congestion. - **Late 2000s.** CDNs started offering other services, e.g. media streaming, image optimization, etc - **Late 2010s.** Advanced services, DDoS protection, WAF, Edge Computing (Cloudflare Workers 2017). Note: - In the most generic form this is any design that brings compute operations physically closer to user. - But today we will be talking about Edge Servers computing. And it all started with CDNs. - Fisrt CDNs were invented in late 90s to solve the fundamental problem of the Internet - traffic congestion and network latency. - Early CDNs were able to store only static content, e.g. html, css, images. - But over time CDN providers added more features, e.g. automatic image conversion, protocol upgrades, video streaming, etc. - In the end of last decade CDNs started playing even larger role in the modern Internet infrastructure. - CDN providrs started offering advanced solutions that not only allowed to achieve better performance, but also enhance security, - These services solutions included DDoS protection, Web Application Firewalls, etc. - Finally at some stage CDNs started offering even more services allowing to place workloads in the edge, that pradigm became known as Edge Computing. - Let's have a close look at CDNs to understand how it works and what the benefits are.

- But let's foucs a little bit and try to understand how CDN's PoP are conneected to the Internet backbone.
- This is done through so called Internet Exchange Points or IXPs.
- Those IXPs are usuaully created as cooperative non-profit organisations that are backed by all the organisatiosn using it.
- CDNs and cloud providers place their data centres in close proximity to these IXPs too.
- I mentioned that CDNs solves two problems - latency and traffic congestion.
- But let me explain how.
- The CDN servers normally host some sort of reverse proxy, e.g. Nginx, HAProxy.
- When a client requests a static file, the request gets routed to the closest IXP and then to the CDN network that is using the internet backbone infrastructure to send it further to the origin server. - The response returned by origin is cached in the CDN. - When the next user in the same city is trying to request the same file it serves it from the local saving some bandwith for the Internet Backbone instead of making another roundtrip to the origin server.
- This not only saves traffic, it also massively reduces the per-request cost.
- CDNs are used by all respectable websites these days.
- CDN is what allows us to start watching a Netflix video in a matter of milliseconds in any part of the world.
- This strategic positin of CDNs allow the to implement other important funcionality. E.g. SSL termination, DDoS protection, file compression, or automatic upgrade to the modern internet protocls.

### What else can be hosted in the Edge? * DNS (1.1.1.1) * VPN (Zero Trust) * [NEW!] Apps & App Services * [NEW!] Databases Note: - But technically it is possible to host any software in the Edge. - Let's take DNS for example. - offers a DNS resolver 1.1.1.1 that works 30% faster than the 8.8.8.8 provided by Google. - All because Cloudflare hosts it inside their Anycast Edge Network. - It also compliments well CDN and other services that Cloudflare offers. - Another example of a service that can be hosted in the Edge is VPN. - Cloudflare's VP is branded Zero Trust and also hosted on their Edge Network. - Our engineers in US know that before we switched from self-hosted VPN to Zero Trust, accessing GitLab from US was much slower. - The reason for this is that we used a VPN service that was hosted in Europe and GitLab is hosted in Australia. - It caused traffic from US to Asutralia to travel via Europe. As you can imagine it's much much much slower than connecting directly from US to Asutralia. - Finally, CDNs became offering customers PaaS for hosting custom applications in the edge. - I originally didn't take it seriously as it only allowed to run a JS function in the Edge Server, adn this is for example how Akamai Ege Computing still works. - But I cahnged my mind once I started seeign that Cloudflare also started offering databases as a service and many other application services along with the Applicaiton platform. - I will show you in a bit how it works on the example of sydjango.org website, but before I do this...

### Jamstack (https://jamstack.org/) * Static Site Generators: Jekyll (2008), Gatsby, Hugo, etc * Single Page Applications: React (2013), Vue, etc * Server Side Rendering: Next.js (2016), Astro, etc * Headless CMS: Contentful (2013), Strapi, etc Note: - Let me speak a little bit about what happened with web development during this time. - As CDNs grew in popularity, a new type of software emerged, the name that stuck was "Static Site Generators". - One of the first SSG was Jekyll originally created in 2008. - The idea is quite simple - it allows users to build the entire website from templates stored in a VCS (usually Git) and combine it with soem data coming from different data providers, files, APIs, Dtaabases, etc. - Of course, such static websites would would work extremely fast and reliable when distributed via CDN. It's actually a great choice for some types of websites, e.g. product catalogues, blogs, company websites, etc. - But, there was a couple of problems using this approach. - First. Is dynamic functionality. We can create a static blog which makes it super fast to read the conent, but wat to do with comments? - Second. Build time. For a very large websites, build time could be quite large too. - So in parallel we observed a rapid growth of popularity of Javascript UI frameworks such as React JS and Vue. - We use both these frameworks at CG as they allow fast development of complex fronted applications with reach functionality. - At some stage developers started buildign the entire website logic including routing, etc inside the frontend aplpicaiton. This approach received name "SPA". - Ans though it caused JS bloat and was causing the initial load time inrease this approach became quite popular. - Thanks to JS bloat more recently we were able to observe somewhat renaissance of classic Server Side Rendering approach. - Over time Static Site Generators evolved, mingled with JavaScript Web Frameworks and Headless CMS's and created a new web development paradigm that received name Jamstack. - Unfortunately, if you open the https://jamstack.org/ website and read the Jamstack definition, it will be hard to understand what it's about. - So let me try to explain it in my words. - JAM in Jamstack stands for Javascript, API and Markup. In this paradigm the HTML markup is generated by SSG and the dynamic functionality is added through APIs and Javascript. - Such approach allows websites to receive benefits of being hosted and distributed globally via CDNs while still keeping reach functionality thansk to the use of APIs. - In the next section I will do a qaick demo of a website that I built that uses this approach.

### https://sydjango.org

### Building blocks - [Astro](https://astro.build/) website hosted on [Cloudflare Pages](https://pages.cloudflare.com/) - [Hono](https://hono.dev/) or ([itty-router-openapi](https://cloudflare.github.io/itty-router-openapi/)) API hosted on [CloudFlare Workers](https://workers.cloudflare.com/) - [Cloudflare KV](https://developers.cloudflare.com/kv/) - [Wrangler](https://developers.cloudflare.com/workers/wrangler/) and [Miniflare](https://miniflare.dev/) for local development. Note: - Why Astro? It's a new generation Jamstack framework (cannot call it a static site generator anymore or a web framework). It is very fast. - It introduces the concept of page islands allowing us to render us static HTML on thee server for parts of the webpagge and hydrate only some compentns in the client. - It even allws you mixing Vue and React components in one page, if needed. - It plays very nicely with Cloudflare and allows both deployment via Cloduflare Workers and Cloduflare Pages. - Hono is a Typescript web framework for Edge, it's very fast and has pretty much Zero bootstrap time. - Unfortunately, I don't have workign example of how I used Hone in SyDjango, but I played with it separately and it looks pretty good. - Alternative you can also use `itty-router-openapi` a web framework provided by Cloudflare itself, it's a design first approach to API development. - Cloudflare KV storage is a simple KV store, very easy to work with. I use it to store the Website data, user sessions, etc. - Wrangler is a CLI tool provided by Cloudflare that allows working with Cloudflare resources. Very easy to use. - Cloudflare Pages integrates natively with GitHub and provides automatic CI/CD builds and such features as preview branches.

### Demo * [Astro](https://github.com/tyomo4ka/sydjango.org/blob/master/sydjango/src/pages/login/index.astro) * [Hono](https://github.com/city2code/jobspp-cloudflare/blob/main/apps/techtalks/src/index.ts) * [Pages Dashboard](https://dash.cloudflare.com/ba18c044eb78e85c4c95cd8e4b7bc0a5/pages/view/sydjango-org) * [Workers Dashboard](https://dash.cloudflare.com/ba18c044eb78e85c4c95cd8e4b7bc0a5/workers/services/view/sydjango-crons/production) * [Analytics Engine - Push Data Point](https://gitlab.covergenius.biz/cg/apipulse-proxy/-/blob/master/src/index.ts?ref_type=heads#L114) * [Analytics Engine - Query Data](https://gitlab.covergenius.biz/cg/apipulse-portal/-/blob/master/functions/api/stats.js?ref_type=heads#L13) * [Email Workers](https://github.com/tyomo4ka/sydjango.org/blob/d211ab72bde29a28df1ef585924c1d2d0c76acae/in-at-sydjango-org/src/index.ts)

## Why I like this solution? * Price * Simplictiy * Rich funcionality Notes: * Price. 10 million requests included for $5/mo. +$0.30 per additional million. * Minimum traffic between countries and continents and serverless model based on V8 Isolates makes resource utilization very efficient.

## Problems * Vendor lock (partially solved by using Hono and Astro). * Maturity (many services are still in beta). * Lack of enterprise-level security controls. * Other limitation typical for serverless technologies.

## Is it the future of Internet? Note: * So, coming back to the topic of my talk. Is Edge Computing and Jamstack the future of Internet? * The honest answer is - I don't know. * As bare minimum - I think it deserves our attention and deep consideration.

- And here is an example of why.
- This is a message that Elad sent to me, Wang and Vijay this night.
- 50ms response time.
- I think the question here is not even in 50ms response times.
- In the end if you have unlimited money and time - everything is possible.
- The question that we should ask ourselves. How we can do it considering existing constraints?
- And to me the only proper way to implement 50ms response times in a relatively short timeframe with relatively small investment of resources is by using Edge Computing.
- Those of you who attended the Cloudflare conference this year remember that Atlassian was one of the main supporters.
- Atlassian is already using Cloudflare to implement real-time funcionality for Confluence and other services.
- And in my opinion we should seriously consider it too at CG.
- But the beauty of Cloudflare is that it is also really easy to use for small projects.
- It's a great cost-efficient solution for pet orojects, websites that you build for your friends and family, etc.
- My main goal for this presentation was to attract your attention to Cloudflare and I hope I was able to do it.

### Thanks for your time!