微信小程序08 - 底层架构实现，启用运行机制之MINA框架

最新推荐文章于 2024-04-27 19:48:28 发布
最新推荐文章于 2024-04-27 19:48:28 发布
阅读量799 收藏 7
点赞数 1
分类专栏： 微信小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/gaoya7305/article/details/92788497
版权
本文介绍了微信小程序的底层架构，包括MINA框架的View、App Service、Manager和API部分。小程序视图层与逻辑层通过JSBridge通信，利用 setData 方法和diff算法实现数据同步。此外，文章还详细阐述了小程序的启动运行机制，包括热启动和冷启动，并解释了微信如何管理小程序的生命周期。最后，讨论了小程序的启动流程和代码包的更新与缓存策略。
摘要由CSDN通过智能技术生成

目录：

  1. 底层架构
  2. 小程序的运行机制

一、底层架构

小程序的开发框架称为MINA框架

在这里插入图片描述

View：视图层 - 搭建视图的结构和展现样式
App Service：逻辑层 - 处理事务逻辑，数据交互的服务中心

  • Manager：逻辑处理部分的执行
  • API：底层提供的叫WAService.js文件来封装各个api的接口，让各个平台的运行环境能通过API使用微信客户端能力。

小程序只有一个app Service,并且整个生命周期常驻内存的，app Service 的线程加载App Service.

Native：系统层 - 里面接入了微信客户端的原生能力，小程序的视图层和逻辑层是一个双线程的通信，提供了数据传输和事件系统。

视图层和逻辑层通过JSBridge进行通信，逻辑层将数据变化通知到视图层，触发视图层的页面更新，视图层把触发的事件通知给我们逻辑层然后逻辑层进行业务处理。

视图层是怎么将数据变化实时的展示出来呢？

首先WXML具有元素，属性和文本的节点树结构，在节点树种每个节点都有个上下文的关系。所以在渲染WXML的时候，小程序的运行环境，会把WXML的节点树转化成js对象，（可以查下ast抽象语法树的概念）

最低0.47元/天 解锁文章
gaoya7305
关注
专栏目录
微信小程序底层框架实现原理:开篇-双线程架构
sybh的博客
02-17 1455
介绍章节我们聊了一下“小程序”的一些概念和发展历程，并且拓展了一下思路。我们从本章节开始讲解小程序的架构。小程序的双线程架构设计。双线程对比单线程的优势在哪里。传统h5开发环境有什么弊端。Native层在双线程架构中起到怎样的作用。如何解决传统h5的安全管控问题。
微信小程序底层框架实现原理
sybh的博客
10-21 1061
掌握小程序框架的设计思想与实现方式，了解小程序背后的世界
深入理解微信小程序的底层框架（一）
m0_58859743的博客
07-22 1782
大家对小程序开发已经非常熟悉了。现在开始，我们会向大家介绍在编写小程序代码背后的方方面面的细节，而在这里我们会先深入小程序底层，介绍底层的架构设计，一些细节原理，以及大家所熟悉的组件系统。通过学习，我们可以在之后的小程序开发中编写出更合理的代码，遇到问题可以有依据可循，能想到更好的解决办法。...............
深入理解微信小程序的底层框架（二）组件系统、Exparser
m0_58859743的博客
07-23 1187
介绍了关于组件系统的运行原理。
微信小程序底层架构
wanglele16的博客
07-11 1681
1. 与h5页面的区别 从技术的发展角度来看，微信小程序是从微信中的 webView 和 JS-SDK 进化到了今天的形态。那么，小程序和普通的h5页面到底有什么区别呢？ 运行环境：小程序基于浏览器内核重构的内置解析器，而 h5 的宿主环境是浏览器。所以小程序中没有 DOM 和 BOM 的相关 API，jQuery和一些 NPM 包都不能在小程序中使用； 系统权限：小程序能获得更多的系统权限，如...
微信小程序复习总结
最新发布
2302_81909561的博客
04-27 1032
微信小程序简介微信小程序是一种由腾讯开发的应用程序软件，可在微信内直接使用，无需下载和安装。小程序的设计理念是"用完即走，无需安装"，旨在为用户提供轻量级的移动应用体验。通过微信平台提供的接口和工具，开发者可以创建不同类型的小程序，覆盖多个领域，如购物、社交、娱乐等。工具栏：在工具栏中可以实现多种功能，例如账号的切换，模拟区、编辑区、调试区的显示/隐藏，小程序的编译、预览，切换后台，清理缓存等。模拟区：在模拟区中选择模拟手机的类型、显示比例、网络类型后，模拟器中会显示小程序的运行效果。
微信小程序学习笔记（ 小程序框架 ）
qq_44786519的博客
10-24 842
注册小程序 每个小程序都需要在app.js中调用App方法注册小程序的示例，并绑定声明周期回调函数，错误监听和页面不存在监听函数等。 App中可以调用的详细参数： 1.onlaunch 初始化完成时触发，全局只触发一次，参数可以使用 wx.getLaunchOptionsSync获取（一个wx提供api获取小程序的一些的启动信息参数 2.onshow 小程序启动，或者从后台进入前台显示触发。 或者...
微信小程序开发-第二章
weixin_74181869的博客
03-08 1749
在Page(）函数的参数中，可以定义当前页面的生命周期函数。页面的生命周期函数主要有onload、onShow、onReady、onHide、onUnload。（1）onLoad页面加载函数。当页面加完成后调用该函数。一个页面只会调用一次。该函数的参数可以获取 wx. navigate To 和 wx.redirectTo及中的query。（2）onShow页面显示函数。当页面显示时调用该函数。何次打开页面都会调用一次。（3）onReady页面数据绑定函效。
微信小程序逻辑层视图层解析
weixin_34356138的博客
08-06 6407
框架 小程序开发框架的目标是通过尽可能简单、高效的方式让开发者可以在微信中开发具有原生 APP 体验的服务。框架提供了自己的视图层描述语言 WXML 和 WXSS，以及基于JavaScript的逻辑层框架，并在视图层与逻辑层间提供了数据传输和事件系统，让开发者能够专注于数据与逻辑 响应的数据绑定 框架的核心是一个响应的数据绑定系统。整个小程序框架系统分为...
浅析微信小程序的底层架构原理
qq_47443027的博客
06-24 8370
一、小程序基础知识 　　小程序是基于WEB规范，采用HTML、CSS和JS等搭建的一套框架，微信官方给它们取的名字：WXML、WXSS，但本质上还是在整个WEB体系之下构建的。WXML说到底就是xml的一个子集。WXML采用微信自定义的少量标签WXSS，大家可以理解为就是自定义的CSS。实现逻辑部分的JS还是通用的ES规范，并且runtime还是Webview（IOS WKWEBVIEW、ANDROID X5） 1、小程序的组成结构 　　一个完整的小程序主要由以下几部分组成： 　　一个入口文件：ap
浅析微信小程序技术架构（原创）
weixin_34380781的博客
04-17 4642
周末万里虎抽空体验了下微信小程序的DEMO，对小程序的开发有了一个基础的了解与认识，今天就来和大家分享一下我对小程序的看法。 从官方DEMO来看，小程序在技术架构上非常清晰易懂。JS负责业务逻辑的实现，而表现层则WXML和WXSS来共同实现，前者其实就是一种微信定义的模板语言，而后者类似CSS。所以对于擅长前端开发，或者WEB开发的广大开发者而已，小程序的开发可谓降低了不少门槛。 从上面的微信小...
微信小程序底层框架实现原理:架构篇-快速渲染设计原理之PageFrame
sybh的博客
02-17 1260
小程序如何做到快速打开新页面小程序快速渲染流程原理webview-pageFrame设计原理。
小程序底层框架---随笔
smile_y_y的博客
05-30 172
小程序底层框架 好久没有更新博客了，闲的无聊码上一个吧～ 技术选型 当下，界面渲染技术分为三种： 纯客户端界面渲染技术 web界面渲染技术 Hybird界面渲染技术（名字高端大气上档次，实际上就是客户端渲染和web渲染混合体） 那么作为微信小程序，他的选择是什么呢？ 首先，小程序的宿主是微信，如果采用native技术，这意味着，每一次的小程序发版都需要和微信一起打包，这多少不太现实。 假如，选择web技术呢，众所周知，web是个单线程，一旦遇到了复杂的逻辑，那么必然逻辑渲染会抢占UI渲染，这个性能则不太
微信小程序：MINA视图层
追随世界的脚步
10-04 3880
一、WXML WXML(WeiXin Markup Language)是MINA设计的一套标签语言，结合基础组件、事件系统，可以构建出页面的结构。 WXML具备数据绑定、列表渲染、条件渲染、模板、事件、引用等能力，下面逐一进行详细介绍。 数据绑定 简单绑定 数据绑定使用“Mustache”语法（双大括号）将变量包起来，可以作用于： 内容 {{ message }} Page({
微信小程序框架解析
呆萌码小猿
01-07 1795
框架 小程序开发框架的目标是通过尽可能简单、高效的方式让开发者可以在微信中开发具有原生 APP 体验的服务。 框架提供了自己的视图层描述语言 WXML 和 WXSS，以及基于 JavaScript 的逻辑层框架，并在视图层与逻辑层间提供了数据传输和事件系统，可以让开发者可以方便的聚焦于数据与逻辑上。 响应的数据绑定 框架的核心是一个响应的数据绑定系统。 整个系统分为两块视图层（View）
微信小程序--底层运行原理
河里的草_increase
08-02 1033
说明：资料来源于王红元老师在B站发布的视频。视频质量很高。 （https://space.bilibili.com/368931401?spm_id_from=333.788.b_765f7570696e666f.1） 小程序的MVVM架构 小程序的MVVM架构中，视图层通过Mustache（{{ }}）接受经过Data Bindings处理的逻辑层数据；而逻辑层通过DOM Listeners监听视图层的绑定； MVVM架构使得小程序为声明式编程；命令式编程为采用原生DOM进行编程。 小程序
小程序2——MINA框架、运行机制
Lucifer的博客
04-18 778
小程序开发学习2——
微信小程序开发学习之 MINA框架架构了解（转载）
zy103118的博客
05-27 867
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值