EdgeRoutine技术专家教你把JS代码跑到CDN边缘

4月27日CDN云课堂中，阿里云智能技术专家洪晓龙在线分享《阿里云CDN轻量编程环境》，对EdgeRoutine的背景、功能、案例实践介绍并在线进行上手操作演示，希望更多用户能够使用CDN轻量编程环境服务自主编程、快速落地实际线上业务。本文为直播分享全文。

云原生与边缘计算概念火热

以云原生为理念的基础服务快速增长

近年来，“云原生”概念在技术领域大热，企业上云意愿越来越强烈。不管在国内还是全球，云原生技术在公共云和私有云的使用量一路领先增长，Gartner等多家行业机构已经预测云原生即将进入爆发阶段。

而同属云原生阵营， Serverless&FaaS年增长率这一点上已经逐渐赶上甚至超过以容器形态提供服务的使用量。Serverless&FaaS已经证明了其拥有巨大的技术优势和商业价值潜力。

5G引爆边缘计算的概念

除了“云原生”，“边缘计算”也是近年来最热门的技术领域之一。CDN其实就是边缘生态的重要一环，在CDN遍布全球的边缘节点上提供计算服务是目前“边缘计算”概念快速落地的最大助力。边缘计算的最大特性低时延，Gartner甚至预测到2025年，超过75%的云服务将外迁到边缘。目前，边缘计算的应用场景已经陆续覆盖到交通、医疗、娱乐等各行业各领域，离大众生活越来越近。

云原生和边缘计算的组合碰撞能够催生出什么样的技术和产品？

传统的IaaS是抽象物理机资源来提供服务，如虚拟机ECS、弹性容器ECI，再到更上层的Serverless和FaaS服务形态，整个服务边界一直在上移，资源隔离开销越来越小，给云的客户带来更灵活的按需付费和弹性伸缩能力。阿里云CDN在全球部署了超过2800个边缘节点，兼具了“云原生”和“边缘计算”两大最热门的技术理念和业务场景，当真正将Serverless落地到边缘，将给客户带来什么样的技术和产品服务？

这就是今天洪晓龙为大家介绍的产品：阿里云CDN轻量编程环境-EdgeRoutine。

顾名思义它是一个边缘程序，属于边缘Serverless服务范畴，主要特性是超低时延、按需付费和无需运维。

EdgeRoutine技术专家教你把JS代码跑到CDN边缘

从物理机走向云原生，我们可以在多个能力矩阵上作对比：在延迟方面，数据中心的网络带宽和地域限制决定了它的平均时延会比较高，Serverless更轻量迁移成本更低，在region选择时相对可以做到中延时，而依赖边缘节点能力的边缘Serverless则可以实现更低的延时；在计算能力方面，因为边缘节点资源有限，提供的更多是轻量级计算服务，对比更下层的容器、虚拟机、物理机等，资源隔离开销更小，弹性能力更强；在成本方面，从物理机、虚拟机、弹性容器到Serverless，价格越来越低，而边缘Serverless基于CDN资源复用的场景，它的价格将做到更低，满足业务对于边缘节点的总体规划和预期。

因为EdgeRoutine(ER) 是依托于阿里云CDN去提供服务的，所以它的很大的一个优势是覆盖了全球6大洲70多个国家，基本上在全球做到了所有边缘节点的覆盖。

阿里云CDN轻量编程环境-EdgeRoutine是什么？

EdgeRoutine(ER) 是阿里云CDN团队开发的边缘Serverless计算环境，支持在CDN边缘执行客户编写/编译的JavaScript或者WebAssembly代码（未来会推出）。客户无需关心实际机器、部署region、调度和伸缩性。一经上传，全球部署，全球执行！EdgeRoutine主要具有以下四个特征：

一、轻量级

 简单代码片段
 单个文件最大1M，当项目比较复杂时候，支持webpack打包生成JS文件再上传
 支持多种事件触发，fetch、chrome、set

二、延迟低

 冷启动5-10ms，当代码在全球已经部署完成之后，客户请求进来缩短冷启动时间，直接提供服务
 边缘部署，就近接入
 代码check完成之后，下发到全球秒级生效，修改配置秒级刷新
 DCDN全站加速帮助客户回源加速

三、限制高

 内存128M、CPU时间5ms，5ms可以支持绝大部分客户的业务，随着计算复杂度升高可付费升级，动态可配
 因为是轻量级针对网络带宽流量为主，对文件、进程、Socket进行了限制，网络限于HTTP/HTTPS
 敏感信息不建议放入，后续将支持边缘KV/cache让客户能实现计算、存储等业务场景

四、功能灵活

 提供完整JavaScript环境，支持ES6语法
 Web标准Service Worker API支持，前端应用无需更改即可适配
 与CDN融合，可配置扩展任意CDN逻辑，做到CDN可编程

EdgeRoutine的技术原理

很多了解CDN的人都知道CDN是一个多级缓存的架构，CDN加速静态资源时，将源站上的资源缓存到距离客户端最近的CDN节点上。当您访问该静态资源时，直接从缓存中获取，避免通过较长的链路回源，提高访问效率。且阿里云CDN支持多级缓存架构（默认为两级），可以有效提高资源命中率，大大减少回源请求数量。

EdgeRoutine技术专家教你把JS代码跑到CDN边缘

EdgeRoutine(ER) 是依托阿里云CDN这套多级缓存架构，处在边缘节点这样一个位置，和边缘网关边缘缓存都处在同一层，它是一个独立的组件，提供了一个独立的JS runtime。

当边缘环境、边缘网关收到客户请求之后，它可以智能识别，如果客户配置了边缘代码，边缘网关会将这个请求直接透明代理到EdgeRoutine(ER)。EdgeRoutine(ER)完全接管这个请求去执行客户部署的边缘代码，实际上是客户用边缘代码去直接接管了请求的生命周期。

在请求的生命周期里面，支持去执行一些轻量级的计算，同时依然可以使用CDN相关的业务功能，在函数中利用cdnproxy:true这样的参数去将请求代理给边缘网关，然后再走CDN多级缓存架构，同样可以利用到CDN高命中率的这个特点。

EdgeRoutine(ER)其实也是支持Serverless或者再重新发起一个fetch请求，这个fetch请求和主请求无关，完全是在代码里由客户生成的子请求，子请求可以直接访问其它任意互联网域名，也可以继续使用cdnproxy代理到阿里云CDN。如果中小站长，仅仅是简单的静态页面的话，完全可以直接托管在边缘，不再需要购买额外云服务，既可以享受Serverless的便利，也可以享受CDN的边缘内容分发优势。

EdgeRoutine适用场景

第一个场景是针对CDN本身提供的一些功能：包括拦截请求、限流限速、内容生成、多源合并、异步鉴权等等，这些完全是可以通过EdgeRoutine(ER) 自主编程实现，代码基本上可以随时随地的去进行更改测试、灰度发布、上线，EdgeRoutine(ER)将CDN相关功能可编程化，无论大型企业还是中小企业，都可以自由定制组合，无需提工单提需求，作为开发者帮助业务快速实现落地；

第二个场景针对前端网页这一块，支持web API、网页加速、HTML解析、ESI、边缘渲染、边缘SSR等，然后当然也可以实现一个简单的边缘API网关去实现业务中转。前端是EdgeRoutine(ER)一个非常创新的场景，前端同学往往非常关注网页如何优化渲染和提高终端客户体验，前端技术也是近些年变革最快创新不断的领域，CDN的静态内容分发技术针对css、js、图片、视频等各类静态资源的加速也正是基于前端体验不断的追求而持续迭代的。EdgeRoutine(ER)为前端优化在端和云之间开辟了一个新的方向-“边”（边缘），云边端协同，为浏览器/APP客户端减压，在边缘上实现部分前端业务和轻量计算，可以是“微前端”概念的一个探索方向；

第三个场景，当在写代码或者发版的时候，可以通过一个AB测试的这样的功能灰度发布灰度上线，增加稳定性的同时也可以逐步的去观察自己新功能的受众率和期望转化率，实现逐步优化或及时调头。比如：通过代码中使用Geo地域信息，CDN完全支持在国家/省市/区县等更细粒度如浙江区域或者广东区域去灰度不同的功能；

第四个场景，IoT的设备网关在进行数据生成之后，期望把这些数据分析后记录到中心，可能需要一些简单的边缘合并、分析，再把汇总好的数据，回传回中心，边缘可以在端的基础上再加一层收集分析汇总，将海量数据的流式/离线计算压力分散到边缘节点，保障低时延的同时可以有效减轻端和源站压力。

除此之外还有网站托管、小程序等，可以参考下面的大图：

EdgeRoutine技术专家教你把JS代码跑到CDN边缘

开发者能用EdgeRoutine（ER）做什么事情？

接下来用几个案例进行说明开发者可以基于ER做一些什么典型的事情。

第一，网页加速

当2G、3G的时候，大家可能都有过这种体验：打开一个网页不停的转圈，等待的时间非常烦恼。4G来了之后这种情况会少一些，5G会更好。
CDN核心价值其实就是帮助实现网页静态加速，缩短这种转圈等待的过程，通过网页资源静态的就近分发，去帮助终端用户更快的触达到对应的资源，更快地访问对应的网页、图片、视频等等。

但当涉及到一些动态资源，单纯的静态分发是无法解决这部分请求的时延问题的。举个实例，像阿里巴巴国际站，他更多的是海外的服务，源站在海外受众在国内，或者与之相反，这种网络链路显而易见就会比较差，造成终端用户等待时间长体验极差。

下图上半部分是常规的渲染效果，当一秒钟的时候页面仍显示白框，下一秒的时候可能一下弹出来很多内容。因为网页是在服务端一次性渲染出来再传输到客户端的，甚至对于一些子资源如图片，都是需要前端JS多次发起网络请求，当客户端收到所有资源之后，才渲染出完整的页面。

EdgeRoutine技术专家教你把JS代码跑到CDN边缘

那秒级的等待体验好不好呢？

如果使用了EdgeRoutine(ER) ，那是否可以在边缘上去动态渲染？回答是Yes。

在EdgeRoutine(ER)的帮助下，前端的业务逻辑也可以实现流式，如流水线般提高业务效率，一般会选择优先渲染页面框架，再逐步渲染一些静态的资源，整个过程客户端只发起一次网络请求，所有的内容都是在边缘渲染拼装，流式输出，包括所有的图片、视频资源，甚至可以在边缘实现异步模式，并发地去请求各类资源。在整个边缘渲染过程中，参考上图下半部分，在0.3秒的时候还是一个白框，当不到0.4秒时，整体页面框架已经出来，然后是文字介绍和价格部分，当一秒钟不到，除了图片之外的其他简单数据其实都已经显现，最重的图片资源留在最后逐步加载。

从上图的TTFB和Download来对比，整体的首屏时间、下载时间都得到了极大的提升。边缘渲染、边缘SSR都是ER提供的创新场景，只有在边缘低时延模式下，才可以实现和浏览器本地优化相似的效果，且还可以利用CDN同时完成静态内容加速。

第二，边缘执行业务计算，降低源站压力

终端发达的今天，手机移动端、浏览器端不可避免仍会包含一些简单或复杂的业务计算，比如输入的会员账号密码就必须回源做校验，这种动态的计算逻辑要回到云上的服务器才可以，这个过程QPS量级和时延都比较高，源站服务器压力也很大。

那在边缘执行计算是不是可以优化这种情况呢？

刚说到的动态的鉴权，如果直接在边缘环境里面直接去做校验，同样可以校验内容是否正确，就不需要回源，减少QPS，而且利用边缘特性实现了超低时延的优点。甚至当有部分业务依赖动态数据和静态资源做拼装组合，比如AB、小程序模板等，都可以直接依托CDN去做缓存。

第三，边缘Serverless

如果企业拥有一个爆款APP，当几亿iOS、Android各种各样的设备同时在线，那开发者一定有此类需求：海量在线设备要做采样打点，多版本的灰度升级，AB测试观察新版本功能的效果或转化率。如果几亿设备全部打点回源，那源站QPS肯定是扛不住的，一般情况只会选择3%或5%的样本率随机去打点观察。

当使用EdgeRoutine(ER)边缘服务，可以将海量设备的QPS分散到遍布全国甚至全球的CDN节点，QPS的压力已经不是问题，甚至可以简单分析汇总后再将数据回传到企业数据中心，方便业务回溯。

另外，现在很多电商网站都在做千人千面，如果通过回源去实现的话，整个成本会非常高，在边缘上直接通过用户地域信息推荐相应内容，就不再需要通过源站服务来做决策，直接在边缘将人和资源做匹配即可。

如何使用EdgeRoutine（ER）？——实操演示（点击直接观看视频）

基于以上的功能介绍和案例实践，如何通过EdgeRoutine(ER) 去编写边缘代码，如何上传部署，如何本地调试和在线测试？阿里云技术专家洪晓龙在直播中也做了相关演示。

EdgeRoutine(ER)推出了命令行相关工具edgeroutine-cli，开发者可以直接在Windows/Mac/Linux本地环境进行代码调试，上传代码，也可以完成灰度测试，灰度上线。具体查看阿里云官网或者开源页面：https://help.aliyun.com/document_detail/154621.html
https://github.com/aliyun/alibabacloud-edgeroutine-cli
https://www.npmjs.com/package/@alicloud/edgeroutine-cli