从0开始搭建你的第一款小程序（原来方案和架构的介绍）

从的诞生到公众号、支付再到小程序腾讯生态在一次又一次影响用户行为习惯的同时也为开发者提供了新的思路和技能发展方向。无可置疑小程序开发浪潮已经来临也将在 2018年成为各行业流量红利的集中爆发入口。

腾讯云联合 InfoQ举办的云+社区技术沙龙以小程序开发实战为基准点围绕小程序云上解决方案serverless后端架构小游戏底层设计和直播、电商小程序的开发实战五大主题内容分享最全面的小程序设计开发思路以及解决方案。本文整理了讲师演讲精彩内容感兴趣的读者可以拉到文末下载讲师演讲 PPT。

小程序云端解决方案

小程序不需要安装易于分享与传播、开发容易同时用户体验也非常好那么他的这些特性是如何实现的呢？腾讯云工程师朱展从小程序架构分析、小程序解决方案进化历程以及腾讯云小程序解决方案介绍三方面给出了答案。

小程序的实现原理

小程序的开发模式是一种类 Web的模式它的前端和一般的 H5的前端相似但和 JavaScrpit开发比起来的会简单很多这点得益于小程序的实现原理和架构。下图是程序的基本架构图它的上层分两个板块一块是视图层也是 WebViews另一块是逻辑层也就是 AppService这两层在两个不同的线里面进行处理跟传统的 web有根本性的差异。

传统的 Web渲染时如果逻辑里面有很复杂的处理往往会导致界面出现卡顿的现象。小程序没有这个问题如果没有调用渲染不会导致界面的流程度下降。不过由于视图层和逻辑层在不同的线程里面这两层不能进行直接的交互必须通过一些手段实现交互采用 JSBridge实现 JS的运行环境和原生系统的相互调用当用户在界面上进行操作时候会触发相关事件传递到原生 Webviews再到逻辑层。

下图是小程序的渲染流程图编译打包的阶段编写小程序时需先编写一个 ML的代码通过 WCC的编译工具进入 WAWebView用户运行小程序时会和逻辑层传入的数据做一个编译渲染成最终的界面下图是一个局部更新的过程。

以下是小程序加载的几种简单的示意图小程序在手机加载时要在 CDN上面拉一个小程序包小程序在加载时可能有一个等待的时间当这次安装包缓存到本地以后下次手机再打开该小程序则直接从缓存里面读取安装包的内容如果有新的版本小程序也不会等新版本更新完了再打开 APP而是直接用上一层缓存的小程序等下再启动时直接使用新的安装包替换旧的。

同时小程序还提供了一个 Webview预加载的性能除了当前看到的 Webview的视图以外在后台还可以看到一个新的 Webview这种预加载性能能够让一些复杂的小程序在一定程度上保证加载的速度。

小程序的安装包缓存、分包加载、独立渲染线程、Webview 预加载以及一些 Native 组件……这些工作在让小程序拥有丰富功能的同时保证了小程序的打开速度和流畅度从而给用户带来完美的体验。

小程序解决方案进化历程

开发者在开发一款小程序时需要处理很多非业务性的逻辑同时需要准备自己的服务器因此需要花费很多精力在服务器运维以及周围环境的部署上而无法专注于小程序的业务开发。为了让开发者从繁琐的配置上解放出来腾讯云为企业和机构定制了一套基于腾讯云 IaaS 能力的解决方案这就是腾讯云小程序 Wafer 解决方案帮助开发者更加便捷的部署和调试服务器。

Wafer1 面向企业和机构客户（以下称为企业级客户）提供了一台业务服务器和一台会话服务器业务服务器来部署和处理业务相关的逻辑而会话服务器则用来独立处理与用户会话（登录注册等）相关的逻辑业务与会话的分离有助于中大型企业级客户将来对小程序后台进行扩展。除此之外腾讯云还将数据库从云服务器中抽离出来提供了云数据库。

除了 IaaS 能力的解决方案 wafer 腾讯云还提供了快速通信接口、登录、语音识别等多种能力用以满足用户在小程序开发过程中的各项功能需求。

Wafer 的信道服务是由腾讯云提供的一个 PaaS 级的 websocket 服务。利用信道通信技术可以实现小程序与服务器之间的信息互动和传输。腾讯云信道通信技术可以使当前的用户直接跟信道服务器直接建立 websocket 链接业务服务器只用处理 http 请求而不需要关心 websocket 信息。

总的来说Wafer信道服务有以下几大特点：配合 SDK无需开发直接使用；平台提供稳定性和性能保障；能够自动实现断线重连；独立信用服务器消息搬运工。但同时Wafer1架构复杂开发者上手成本高开发者代码调试也不方便。

针对 wafer1不足之处2017年上半年提出 wafer2的解决方案它是 wafer1是一个简化版把 wafer1做一些简化合并兼顾的安全性和便利性比如说它把会话服务器和业务服务器做一个合并；在 wafer1时代我们会让用户自行部署他的服务器在这儿我们进行托管式的管理用户可以购买自己的服务器但是不需要做服务器端的配置还会自动免费部署 SSL证书此外腾讯云和进行深度的合作已经将 wafer2的解决方案提进开发者空间里面去了。

除了 IaaS 能力的解决方案 wafer 腾讯云还提供了上传代码到开发环境、使用 Devtools 启动单步调试、在开发环境安装依赖、重启 /停止 Node.js 程序、恢复初始状态、上传生产环境代码、带登录态跳转腾讯云控制台等系列解决方案本文不在此一一赘述感兴趣的同学可以登录腾讯云官网进行尝试。

使用 Serverless 构建小程序后台

小程序、小游戏的开发已经越来越火爆而小程序或者小游戏的后台通常还是按照传统的服务器模式提供 API 作为后端服务入口进行开发。腾讯云正在尝试一种新的方法：利用 serverless 架构来实现后端服务通过结合使用 api 网关、云函数、云数据库等服务从而能够无需关心服务器自动实现高并发快速上线和无缝更新能力。腾讯云 SCF无服务器云函数产品经理黄文俊详细讲解了如何使用 Serverless 来构建小程序后台。

小程序及后台交互架构

小程序是一种全新的连接用户与服务的方式它可以在内被便捷地获取和传播同时是更具有出色的使用体验。它的加载方式比传统的 APP方式更快速开发上线也更快速。除了本身的界面展示和数据刷新之外小程序的数据获取通过和后端进行交互小程序的运行是一种类前端的运行方式它整个运行是在内而它和后端的交互是通过进行转发的。在实际运行并发出请求时小程序首先会调用 API发出 API请求这个请求发送给再通过网络请求发送到用户自己的服务器上用户在自己的服务上拿到这个请求以后进行数据的处理然后再来响应给到前端这就是一个小程序和后台交互的完整过程。

传统的后台架构需要提供 API服务的情况下首先是需要使用负载均衡然后接入业务应用服务器之后接入文件存储、包括结构化和非结构化的数据库服务以及缓存服务。在这个过程中为了保证系统不会由于某一个的服务器宕机导致服务瘫痪需要分别建立业务应用集群、数据库集群、分布式文件存储、缓存集群；建立集群的一个首要作用就是确保不会由于某一个单点故障导致整个服务不可用。下图为传统的后台架构图。

这种多服务多集群的架构模式在中大型互联网公司都是已经具备的了但是作为个人开发者来说搭建这一套系统比较困难开发者需要了解整个系统的配置如负载均衡怎么配置、数据库集群怎么配置等等。为了让大家把精力从后台的基础架构搭建当中解放出来将更多的时间投放到业务和小程序本身腾讯云在这里为大家提供了使用 Serverless架构构建小程序后台的方案。

Serverless 架构介绍

Serverless架构英文称之为 Serverless中文称之为无服务器也就是说大家不用购买服务器不用配置虚拟机或者物理机它使用计算托管的方式用户在使用的时候不用担心它的安全性也不用担心可能服务器宕机导致的故障。

那么他是如何实现的呢？下图为腾讯云 Serverless架构可以看成两部分第一部分就是函数即服务计算托管在云函数内真正实现了你业务逻辑的托管计算。另外一种是后端即服务包括对象存储、消息列队、云数据库、云缓存、API网关等等。

因为 Serverless架构是计算托管型的计算托管意味着把真正的业务代码托管到云上面然后在云上面运行。Serverless架构的运行方式有一个特点业务逻辑是触发式运行的。云函数在和各个云产品或云服务打通以后各个产品或服务产生的事件都能触发业务逻辑的运行。我们在这里会将云函数与 API网关进行结合当小程序发出的请求到 API网关时就会产生一个 API请求事件然后触发业务代码的运行。用户在进行托管的时候将代码和触发器的配置提交到云上来代码内容就是对事件进行逻辑处理。在事件发生和处理的过程中对于每一次的事件都有一个代码对应的实例拉起实际上每个实例都是单独处理一个事件。用户发出请求时服务运行没有请求时服务不运行。同时本身产品的计费模式也是根据实际服务运行的时间计费的。

同时利用对象存储大家不用自己构建分布式存储不用担心数据的丢失和安全性问题；使用在云上提供的数据库、消息队列也是一样不用购买服务器自己搭建购买或者开通就立刻可以开始使用因此这种服务也可以称之为 Serverless。

Serverless 后台开发方案

那么怎么使用 Serverless架构实现后台开发呢？传统的架构中的 web服务替换为 Serverless 架构的话对外提供服务所暴露的 API我们使用 API 网关来管理用户的业务逻辑我们放在云函数内运行需要结构化数据存储或者文件存储我们使用数据库服务云缓存服务或对象存储服务等同时其他的更多服务也都可以直接使用云山提供的直接通过代码调用。

具体搭建方案如上图小程序除了本身的页面启动和展示后续和网络的交互都是由小程序发起因此小程序通过网络 API发起请求获得响应并将数据展示到界面使内容可以被用户看到；接着是通过 API 网关 管理 API配置 API 的路径、方法、参数及校验管理 API 的发布和切换；API网关之后就是云函数云函数用来处理业务的逻辑发起到数据库的连接读取及写入数据库生成响应数据这里根据实际业务情况如果需要使用数据库就在代码内发数据库的连接需要存储文件就调用相应的对象存储接口来写文件；最后就是云数据库用于存储业务数据。

通过联合使用 API网关、云函数、云数据库这几款云产品或云服务我们展示了在没有购买和配置服务器的基础上实现小程序登录服务的实现完成服务的 Serverless化。利用 Serverless架构实现的小程序开发者不需要担心运维同时因为运行无状态所以能轻易实现快速迭代、极速部署其弹性计算能力也能满足用户上万或者更高的并发。