最前沿
还记得当初微信小程序一出来爆红的情景，依赖于手机微信的确要给大家带来了很大的便捷，拥有微信的流量，用了即走，不需要下载，随时随地应用，从17年至23年，微信小程序广为人知，休闲娱乐你都能找到小程序影子，疫情防控期间各种各样码的情景也帮微信小程序带来了极大的总流量
肯定不仅仅小程序，各个平台纷纷推出自身小程序，像小程序、微信开发平台、抖音小程序等，这种app都紧跟时代潮流，完成了他的小程序框架，经历了五年多时长的高速发展，小程序架构早已保持稳定，针对前端工程师而言，甚至出现一批专门从事小程序开发者
在研发应用上，相信大家看文档与此同时，早已拥有自己的了解，可是微信小程序具体架构设计是怎么样的？它基本原理是什么？我们怎样在自己app上架设一套微信小程序管理体系？
自然微信上的webview的形式也可以实现微信小程序相同的作用，但跟微信上的webview对比，小程序执行速度相当快，由于微信小程序是双线程模型，逻辑与3D渲染是分开的，不容易彼此堵塞
微信小程序基本原理
用浏览器环境里，众所周知，js代码的落实会堵塞页面渲染，3D渲染和脚本执行是相互独立的，长时间脚本制作经营造成网页页面无响应，这也就是为什么react需要进行切片操作
微信小程序选用多线程将两者分离，3D渲染逻辑单独，互相不危害，这也是为什么前面提到的微信小程序会比正常H5要快点，自然想让客户体会到快，最重要的便是3D渲染
目前比较通用四种渲染技术分别为
- webview3D渲染
- native3D渲染
- Hybrid3D渲染
- Skyline渲染引擎（新增加）
最先如果使用webview的3D渲染大家也提到了，同一个线程阻塞造成兼容性问题，选用native的形式做3D渲染得话大家修改小程序代码还要同pc版微信一起分包，显而易见根本不可能，即然两个都要不好，那选用hybrid的方法呢？将两者结合，例如react native就使用了这种方法
那什么叫hybrid呢？说到底就是一个app中不仅有native内容，还有web内容，工作原理是其中有一个UIWebView，里边置入了一些web网页页面，这种web网页页面能够混合开发应用，例如ios和安卓系统，做一个通用壳就行了，我们可以把手机微信对比成hybrid app，微信小程序就是一些H5，页面3D渲染主打的是web层面3D渲染，再由做好端上提供各种的插口提供大量手机客户端原生态水平，确保在web的性能上可以使用一些原生的水平，而且升级较为快速
最近微信新增了一种渲染引擎，为何要新增加呢？原因是因为web发展趋势了那么久，尽管3D渲染方面已经做得非常好的，但是还是因为历史因素及其繁杂的3D渲染步骤，让其在app上的表现还是有一定的差别，终究js总会堵塞页面渲染，因此skyline是一种新的渲染引擎，skyline创造了一条3D渲染进程全权负责layout, composite 和3D渲染等相关工作，并在做好端上划到一个单独的前后文，来运作以前webview承担js任务、dom树建立等逻辑性。促使js没有在堵塞界面的3D渲染，而且非常好的确保了兼容模式
可是其中的一些特点并非原生态就会有，也是需要做好端上做一些水平的研发和适配，例如CSS的calc 函数公式，小程序picker-view部件等都要去干兼容，费用较高，可是这当然是之后小程序发展前景，可以比较好的提高小程序性能
现阶段要是没有独特特定，微信小程序选用还是hybrid方法
安全性
除开3D渲染要快点，相对于微信小程序而言，最重要的一点是安全性，针对web而言，我能自动跳转随意需要页面，例如从他们的网页跳转到baidu，跳转juejin，全是很随便的，没有任何监管，但对于微信小程序而言不可以这样，假如没有约束要自动跳转内容，感受会变得越来越槽糕
另一方面，一般通过js代码获得一些客户的隐秘数据根据dom实际操作，那客户信息泄漏会把事儿变得不能进行
因此根据这类情况，微信中部阻拦一些实际操作dom，自动跳转，动态性脚本执行的插口，只提供了一些js的脚本制作执行机构，因此微信小程序提供了一个沙盒自然环境，这样的环境不能出现电脑浏览器有关实际操作，但对于手机客户端而言，自身微信软件就会有内置的js表述模块，iOS下是内置的JavaScriptCore架构，在安卓系统则是通过腾讯官方x5核心所提供的JsCore自然环境，创立了单独的进程去行动js代码，这一进程中实行的基本都是有关的领域模型代码，逻辑性相关的信息就在这里解决，3D渲染有关都在webview中解决，根据逻辑层去控制3D渲染层的展示，这便是小程序双线程模型
特性
毕竟是多线程，那那么问题来了，进程间的通讯也是有延迟时间的，就会导致进程间的通讯实际是多线程的，针对和手机客户端原生的互动都是多线程的，因此小程序api大量使用了调整的形式，例如选择的图片
wx.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success (res) {
// tempFilePath可作为 img 标签的 src 特性显示图片
const tempFilePaths = res.tempFilePaths
}
})
部件
即然3D渲染要用webview的，那么是不是大家直接用html标签就行了，自然不好，要不然运用a标识这不是可以自己自动跳转了吗？因此微信小程序做了自身的一套部件系统软件，名叫Exparser，实质或是模仿了html的那一套，可是相对应的也提高了自己的一些水平，例如button，使用一些附加参数值用于获取用户信息，map可以直接用地图的水平，ad的宣传水平
通讯
微信小程序和app通信原理其实质和web同app通讯的基本原理相近，只不过是有3D渲染层及逻辑层的通讯，由于多线程架构设计，安卓系统非常简单，不论是逻辑层或是3D渲染层，都在window目标中引入一些方法，ios在3D渲染层选用messageHandlers特点，逻辑层则在JavaScripCore架构引入一个全局性的原生方式
汇总
全套的基本原理拥有，根据这个原理和具体内容，本质上是能够可以自己完成一套小程序体系，但这个任务量毫无疑问是非常大的，即然已经是一套完善的计划方案，那么怎么在自己app里边搭件一套微信小程序自然环境呢？
目前市面上已经出现许多开源系统的解决方案，终究一个大生产商都已拥有自己小程序，容器技术已经成熟，例如比较常见的FinClip，OpenApp，mPaas，Donut等
就以FinClip为例子，终究FinClip可以运作微信上的微信小程序，并且能确保客户体验，顾客量较大，中国比较领跑小程序容器化企业，大家熟知的像建设银行app，工商局银行app等具有他们的身影，有全部一套完整的小程序管理服务平台，端侧微信小程序sdk，和自身的微信开发工具，便捷运营开发及其数据统计分析
就像我们前面提到的沙盒自然环境，多线程的逻辑层和视图层都做成一套通用性计划方案
因此如果要搭件自身的一套微信小程序管理体系，应用已有的计划方案，安全性放心，希望能对所需要的同学们一定的依据