微信小程序是一个小的主要鼻子。 2017年1月9日,微信正式推出了一个小程序。在探索技术架构之前,让我们来看看applet,微信官方网站给微信Applet产品定位和功能介绍是:
“微信Applet是连接用户和服务的新方法,可以方便地在微信中获得和传播,同时具有优异的体验。”
用户眼中的小程序
iOS:从小程序独立角度(小程序和小程序之间,小程序在小程序和主机应用程序之间切换),Batt的applet类似于中国商人银行的小程序。
Android:从BATT的Applet的交互,您可以看到一个单独的应用程序,在后台(多过程)中独立存在,可以在小程序和小程序之间切换,小程序在主机应用程序之间切换。理解小程序应用程序的这种小程序可以直观。中国商家银行的小程序与主机应用程序共存,即在一个过程中,它不能在小程序和小程序之间切换,小程序在主机应用程序之间切换。这种类型的applet可以直观地了解小程序页面。
因此,从用户的角度来看,BATT的互动体验更有利。从理解小程序的概念,每个应用都理解,但这不会影响功能级别的使用。
平台透视
最早的应用程序applet微信创建了一个小程序?它有什么作用吗?在我看来,主要目的是控制控制的目的,使用多种方法实现,主要由两个方面控制:
UI控制:以微信为例,微信定义了一组DSL,而不是使用HTML开发页面。这将不允许开发人员在Wechat的DSL框架中发展。 DSL编写的开发人员的具体转换是什么,是什么是渲染,这是一个决定的微信平台。基于定制的DSL,您可以更好地进行代码控制,例如:请求白名单,代码扫描等。
服务控制:或作为微信的示例,由丝克特(如Pupant)(如付款,微信体育,优惠券,发票,用户账户信息等)提供的服务提供的服务,对控制的需求进行控制。目的也是一个不能访问的小程序,并且将呼叫丝网基本服务在不存在授权机制的前提。
小程序技术架构
让我们根据用户角度的经验要求,以及平台角度的管理需求来看看Batt。小程序已经实现了这些技术的技术。
主要技术点
DSL(特定于域名语言):
在我们谈论DSL之前,让我们来看看需要做什么工作。无论是一种解释性语言(JS,Ruby,Python)还是编译语言(Java,C ++,C#),都会有一个公共部分,可以解析到AST(抽象语法树)的源代码。 AST不仅可以以结构化方式展示源代码,而且在语义分析中也发挥着关键作用。 AST不仅在解释器和编译器中应用,而且在静态代码分析中也更常见,例如我们希望在重建代码以减少重复代码时提取公共模块。此时,我们使用字符串比较的简单方法将比较单面无法达到效果,然后生成AST更有用。另一个应用示例对我们的DSL设计提供了更多的参考:代码转换器。下图是要转换为另一种语言代码的语言代码的主要步骤:
源代码被解析为AST。在解析之前,它是语言规则的文本。在分辨率之后,它将成为完全相同的树结构,作为输入文本,这是可逆的。然后,AST遍历和替换,此过程类似于前端的DOM树,最后基于修改的AST生成编译代码。在JS作为一个例子中,我们可以使用橡子生成的AST,我们也可以使用其他解析器,例如巴比伦,esprima等。
由于applet的渲染容器,可以是WebView容器,本机本机容器和颤动容器(虽然颤动也是本机渲染,以便区分本机本地,这里可以单独使用它,即同样),所以我们可以从前一段代码转换器中学习这个想法,AST平滑,特定渲染容器之间的差异,
通过上述设计,讲述并不是很好,并且有许多需要做的工作。我们可以简单地将DSL的处理划分为编译时并运行,将DSL代码编译为目标代码,并且目标代码可以在相应的运行时环境执行。生成的目标代码的角色是可以通过特定运行时的当前环境的参数执行实际代码,并且简单地理解是在多呈现环境中运行。
为了编译时间,它从零明确表示。首先,我们继续上面的AST主题,并提到了各种AST:Acorn,Babylon,Esprima。当然,还有许多其他人,例如:Cherow,Espree,Shift等待。所以我们不必制作一个轮子,使用巴比伦,因为巴比伦用于巴巴勒,它将与最接近的JS函数同步,并且使用API??设计。 Babel是一个JS编译器(不仅仅是ES6支持的工具包,否则它将成为一个类似于Android的支持包),可用于代码压缩,语法转换等。对于生成目标代码的过程:解析(Babel-Traverse)具有良好的支持。由于不同的渲染容器具有不同的组件库和API,因此相同的功能不相同,因此必须封装适配器层代码。
对于运行,您只需要生成编译代码的代码执行来生成特定的呈现环境。以下是Babel将ECMAScript新代码转换为旧版本的逻辑比较。
2.本地渲染
从性能的角度来看,applet最终由本机模式呈现,而不是使用WebView作为渲染容器。 DSL设计可能非常好,无法屏蔽基础的实际渲染的实现。您可以使用本机或H5,或使用两者的组合,底层渲染引擎的切换不会影响小程序的外部访问。 。目前,与WEEX / RN / Flutter相比,移动终端跨平台本机渲染非常流行。市场基于WEEX和基于RN的案例。扑腾在展会后面,并且在使用verutting作为渲染引擎的情况下没有任何情况。
3. Android多进程:
正如我们从用户角度的“小程序”部分所看到的那样,BATT方案使小程序真正做与申请相同的经验。由于IOS应用程序无法打开新进程,因此applet在独立的过程中运行,因此iOS中的applet只能与主机应用程序共享相同的进程。对于Android,它不一样,小程序占用了独立的过程。从安全角度来看,第二方后一方三方小程序应用程序是从主机应用程序流程中孤立的,以及小程序不会影响主机应用程序的问题。此外,从性能透视图,applet不共享主机应用程序的内存。从BATT的实际应用操作,它基本上控制了五个背景开放式启用的过程。您可以使用五个容器活动在您自己的进程中呈现小程序,有些将具有后端时间限制。 。打开一个新的applet,关闭最早的开放小程序过程,这已经实现了有效的热启动目标。
4.多线程:逻辑渲染隔离:
首先,让我们讨论一个小程序的逻辑和渲染,然后与特定的多线程聊天。当然,小程序的逻辑和渲染可以从功能级别分开,没有可以实现分离。这里的逻辑和渲染分离是指小程序在单独的JS环境中的逻辑运行,并且只需要JS引擎,渲染在WebView线程中运行。逻辑和渲染已分为两个线程。有几个好处:首先是逻辑和渲染代码分离未耦合,第二个是执行逻辑线程和呈现线程并行,并且JS执行不会阻止UI。第三是为了补充UI控制,逻辑线程的目的,在JS引擎中运行,而不是在WebView中,限制了通过注入JS代码操作DOM的可能性,任何与UI相关API相关的任何相关的API就无法改变通过JS,因此它是使用DSL控制UI控件的目的。第四个好处是多个小程序页面共享相同的JS逻辑操作环境,可以轻松富有高效的共享数据。
优化:
在逻辑和渲染分离之后,逻辑线程需要将数据发送到呈现线程,呈现线程需要将事件发送到逻辑线程,这需要序列化传输。这将带来问题,频繁的数据传输和单个大数据卷传输将带来性能问题。在响应这个问题时,ahipay应用程序的设计思想是值得的,apagay小程序重新设计的V8虚拟机,让逻辑和渲染有自己的本地运行时,存储私有模块和数据。它还提供共享的全局运行时共享堆来共享数据,该数据仍然是逻辑和渲染隔离,并降低序列化和传输成本。
5.预加载:
applet的开发人员在小程序应用程序中进行了大量优化,例如数据预加载。从用户点击页面,转到在线onload(),将延迟100ms-300ms,这种延迟时间,可以做数据预加载。这里提到的小程序是预装的,这是一个小程序渲染帧级别。 iOS优化将在实际渲染中预加载比一个wkwebview,打开新的小程序直接呈现预加载的wkwebview,保存初始化时间; Android有点复杂,但仍然是空间更改来自Android的时间主机应用程序启动,启动保留流程,当新小程序打开时,将占用此过程并准备新过程,直到第五个过程的上限已打开。
6.离线包装(子封面):
脱机包机制的基本目的是让页面资源在开放小程序时替换本地IO。实际上,在App打开之前打开应用程序之前,可以在本地本地地本地包裹。脱机包模块的职责包括:更新,解压缩,存储,阅读和检查,当然,当然可以进行二进制差异。使用离线包机制,还需要将整个过程视为将影响效率的离线包。因此,有必要增加订阅,并且可以将脱机包划分为主包和多个子电卡。该包主要包括:诸如第一个屏幕,公共代码,相关子纸牌等信息;子片段可以包含辅助页面的页面资源
III技术选择
ide.
小程序平台有自己的IDE,对于多系统平台的当前情况,选择跨平台桌面技术来开发一个小程序IDE,绝对是最佳选择。
2. JS发动机
如前所述,逻辑层具有单独的JS环境,其还示出了这一点,以防止JS从控制透视图中修改UI的风险。在技??术选择方面,iOS可以使用本身,虽然IOS上的JS引擎比JSCORE更多,但执行速度非常快,但它与其他JS引擎相比,使用Combo JS发动机具有先天性优势这是稳定的,不会增加包装的大小。这件作品可能会提及,颤动引入iOS中的滑雪渲染引擎。扑腾引入Skia在iOS中的好处是与滑雪发动机配有Android的同一个渲染引擎,这将在UI兼容性方面更好。增加。 JS引擎兼容性问题要小得多。
旧版本的微信Applet使用JScore,新版本的V8;支付宝小程序是重新设计的v8;标题小程序也是V8;您可以看到V8的获胜率仍然很高,开源协议也是可比的友好。
概括
本文是一个小程序渲染架构的实现。就小程序平台本身而言,还有其他功能和优化点,例如小程序,调试包,埋地点,虚拟DOM优化等。本文仅介绍了一些主要的流程和技术要点,真正是一个完美的小程序平台或需要大量的细节,有必要考虑,还有一个优化的空间,例如:骨架屏幕。为了使一个小程序平台需要多平台综合应用程序来不断改进,随着新技术的出现,将来会有更多的技术。
返回列表