微信技术架构小程序框架的基本技术层次和优缺点

菏泽炫佑科技 菏泽炫佑小程序开发 菏泽炫佑app制作 炫佑科技

微信技术架构小程序框架的基本技术层次和优缺点

小程序基本技术水平

微信技术架构

小程序框架的核心是响应式数据绑定系统。

整个小程序框架体系分为两部分：视图层（View）和逻辑层（App）

框架使数据和视图保持同步变得非常容易。 修改数据时，只需要修改逻辑层的数据，视图层就会相应更新。

技术解决方案

一般来说，真实层渲染接口的技术栈有以下几个：

客户端原生或编译为原生：/iOS/纯Web：React/Vue/、PWA/MPA、SPA以及将原生与Web相结合并以桥接方式进行通信的混合技术

优缺点：原生技术需要与微信客户端一起编译版本，显然不适合快速阅读迭代； 纯web是*灵活的，但是也会存在性能问题和安全问题。

其他选项，混合技术，具有多+？ +

主要有两类技术：

使用Web技术描述界面但将其转换为原生渲染，或者所谓：/Weex/并用Web技术渲染，原生提供JS-SDK模式的混合技术：+/Ionic、/ns.js（Node- ）

从底层的渲染来看，微信JS-SDK是类似的，两者仍然使用浏览器内核来渲染界面。 因此，我们的答案已经呼之欲出了。 很容易理解，小程序*终选择了沿着这个方向继续前进。

事实上，微信提供的开发工具也使用了桌面技术相对成熟的nw.js。

微信框架提供了自己的视图层描述语言WXML和WXSS，以及基础的逻辑层框架，并提供视图层和逻辑层之间的数据传输和事件系统，让开发专注于数据和逻辑。

小程序视图层WXML()

支持数据绑定

支持逻辑算术和运算

支持模板和参考

支持添加事件

WXML首先被编译成JS文件。 引入数据后，初步完成虚拟DOM，*后将虚拟DOM构建成DOM树并在.

WXSS(风格)

支持大多数 CSS 功能

新增尺寸单位rpx微信技术架构小程序框架的基本技术层次和优缺点，可根据屏幕宽度自适应

使用@语句导入外部样式表

不支持多级选择器微信小程序开发原理，以避免被组件内的结构损坏。

WXSS被编译成JS并运行。 常用的选择器和组件将被忽略。

小程序的组件基于Web标准，使用框架来实现Web。 框架是提出来的，但是在使用过程中发现其性能较低，所以微信开发了自己的一套。

组件层位于层之上。

小程序逻辑层

逻辑层处理数据并发送给视图层，同时接受视图层的事件反馈。

App()小程序的入口； Page()页面的入口

提供丰富的API，如微信用户数据、扫一扫、支付等微信特有的能力

每个页面都有独立的范围并提供模块化功能

数据绑定、事件分发、生命周期管理、路由管理

运行环境：iOS-、-X5 JS解析器、-nwjs内核

逻辑层生命周期

用户从微信打开小程序的执行流程：

执行上拉操作并告诉App层

App层拉起，通知View层初始化。

接下来我们需要打开页面并通过路由通知App层

App层创建Page，然后通知Web层初始化，并通知View层渲染并发送初始化数据。

App层中的Page会被执行，事件被执行，渲染完成。

当用户执行操作时，会触发用户事件，并将用户事件通知给App。

层并在该层上执行，然后通知View层进行部分渲染，从而完成一次交互。

Web View初始化完成后创建新的View。 用于等待用户执行下一个界面，减少Web View创建的成本，用户不需要等待。 App层的New Page也是如此。

小程序值得借鉴的优点

提前创建新的Web View，为新页面渲染做准备

View层和逻辑层分离，由数据驱动，不直接操作DOM。

使用 DOM 进行本地更新

炫佑科技专注互联网开发小程序开发-app开发-软件开发-网站制作等