微信小程序的线程架构【推荐】


Posted in Javascript onMay 14, 2019

小程序的线程架构

每个小程序包含一个描述整体程序的app实例多个描述页面的page

其中app由3个文件构成:

app.json 公共配置文件

app.wxss 公共样式文件

app.js 主体逻辑文件

page页面最多由4个文件构成:

page.jason 页面配置

page.wxml 页面结构

page.wxss 页面样式

page.js 页面主体逻辑

app.js和page.js中包含小程序在生命周期的每个阶段相应的事件。

典型的app.js代码结构如下:

App({
 onLaunch:function(){
  //小程序启动时执行的初始化工作
 },
 onShow:function(){
  //程序启动或从后台进入前台时,触发执行的操作
 },
 onHide:function(){
  //程序从前台进入后台时,触发执行的操作
 },
globalConf:{
 indexDate:'',
 matchData:''
},
dataCache:{},
globalData:''
})

典型的page.js代码结构如下:

Page({
 Data:{
}
 onLoad:function(){
  //页面加载时,执行的初始化工作
 },
 onReady:function(){
  //页面就绪后,触发执行的操作
 },
 onShow:function(){
  //页面打开时,触发执行的操作
 },
 onHide:function(){
  //页面隐藏时,触发执行的操作
 },
 onUnload:function(){
  //页面关闭时,触发执行的操作
 },
 //Events handler
  viewTap:function(){
   this.setData({
    text:'set some data for updating view.'
   })
}
})

 一个完整的小程序执行的过程或生命周期如下:

app.onLaunch-->app.onShow-->page1.onLoad-->page1.onShow-->page1.onReady
(打开程序,第一个页面page1加载完成)
-->page1.onHide-->page2.onLoad-->page2.onShow-->page2.onReady 
(从第1个页面打开第2个页面)
-->page2.onUnload-->page1.onShow-->...-->app.onUnload 
(关闭page2,返回page1...退出小程序)

一个page的生命周期开始于onLoad事件,在整个生命周期内onLoad、onReady、onUnload这三个事件各执行一次,onHide和onShow事件在每次页面隐藏和显示时都会触发。

当用户手动触发小程序的退出箭头时,小程序仅触发app.Hide,下次进入小程序时会触发app.onShow以及当前页的page.onShow。仅当小程序在后台运行超过一定时间未被唤起、或者用户手动在小程序的控制栏里点击退出程序、或者小程序内存占用过大被系统关闭时,小程序将被销毁,会触发app.onUnload事件。

每个小程序分为2个线程,view与appServer。

view 线程   appServer线程
.wxml + wxss   ios:safari Android:X5浏览器 开发工具:chrome .js   ios:JavaScriptCore Android:X5内核 开发工具:nwjs

view线程负责解析渲染页面(wxml和wxss文件)。

appServer线程负责运行js。appServer线程运行在jsCore(安卓下运行在X5中,开发工具运行在nwjs中)。由于js不跑在WebView里,就不能直接操纵DOM和BOM,这就是小程序没有window全局变量的原因。

总结

以上所述是小编给大家介绍的微信小程序的线程架构,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
Extjs优化(二)Form表单提交通用实现
Apr 15 Javascript
JavaScript排序算法之希尔排序的2个实例
Apr 04 Javascript
详解Jquery实现ready和bind事件
Apr 14 Javascript
AngularJs每天学习之总体介绍
Aug 07 Javascript
微信小程序使用toast消息对话框提示用户忘记输入用户名或密码功能【附源码下载】
Dec 09 Javascript
Vue的elementUI实现自定义主题方法
Feb 23 Javascript
Angular使用操作事件指令ng-click传多个参数示例
Mar 27 Javascript
对vue中v-on绑定自定事件的实例讲解
Sep 06 Javascript
vue中$nextTick的用法讲解
Jan 17 Javascript
微信小程序常用简易小函数总结
Feb 01 Javascript
如何通过javaScript去除字符串两端的空白字符
Feb 06 Javascript
JavaScript Date对象功能与用法学习记录
Apr 28 Javascript
jquery实现选项卡切换代码实例
May 14 #jQuery
Vue表单之v-model绑定下拉列表功能
May 14 #Javascript
JQuery样式操作、click事件以及索引值-选项卡应用示例
May 14 #jQuery
vue实现歌手列表字母排序下拉滚动条侧栏排序实时更新
May 14 #Javascript
vue实现动态按钮功能
May 13 #Javascript
详解小程序之简单登录注册表单验证
May 13 #Javascript
arctext.js实现文字平滑弯曲弧形效果的插件
May 13 #Javascript
You might like
深入讲解PHP的Yii框架中的属性(Property)
2016/03/18 PHP
浅谈PHP发送HTTP请求的几种方式
2017/07/25 PHP
PhpStorm配置Xdebug调试的方法步骤
2019/02/02 PHP
JQUERY实现左侧TIPS滑进滑出效果示例
2013/06/27 Javascript
Jquery动态进行图片缩略的原理及实现
2013/08/13 Javascript
推荐一个封装好的getElementsByClassName方法
2014/12/02 Javascript
AngularJS的一些基本样式初窥
2015/07/27 Javascript
纯HTML5制作围住神经猫游戏-附源码下载
2015/08/23 Javascript
JavaScript模块规范之AMD规范和CMD规范
2015/10/27 Javascript
Bootstrap每天必学之级联下拉菜单
2016/03/27 Javascript
关于JSON与JSONP简单总结
2016/08/16 Javascript
jQuery实现为LI列表前3行设置样式的方法【2种方法】
2016/09/04 Javascript
如何在AngularJs中调用第三方插件库
2017/05/21 Javascript
jquery与js实现全选功能的区别
2017/06/11 jQuery
详解IWinter 一个路由转控制器的 Nodejs 库
2017/11/15 NodeJs
使用Vue自定义数字键盘组件(体验度极好)
2017/12/19 Javascript
nuxt框架中路由鉴权之Koa和Session的用法
2018/05/09 Javascript
Vuejs监听vuex中值的变化的方法示例
2018/12/02 Javascript
使用form-create动态生成vue自定义组件和嵌套表单组件
2019/01/18 Javascript
vue使用localStorage保存登录信息 适用于移动端、PC端
2019/05/27 Javascript
JavaScript变量作用域及内存问题实例分析
2019/06/10 Javascript
js 根据对象数组中的属性进行排序实现代码
2019/09/12 Javascript
[04:12]第二届DOTA2亚洲邀请赛选手传记-Newbee.Sccc
2017/04/03 DOTA
[49:27]LGD vs OG 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
python获得文件创建时间和修改时间的方法
2015/06/30 Python
python 识别图片中的文字信息方法
2018/05/10 Python
Python做智能家居温湿度报警系统
2018/09/25 Python
Python列表切片操作实例总结
2019/02/19 Python
利用python numpy+matplotlib绘制股票k线图的方法
2019/06/26 Python
python如何统计代码运行的时长
2019/07/24 Python
如何在python开发工具PyCharm中搭建QtPy环境(教程详解)
2020/02/04 Python
Nº21官方在线商店:numeroventuno.com
2019/09/26 全球购物
学生打架检讨书1000字
2014/01/16 职场文书
大一学生的职业生涯规划书范文
2014/01/19 职场文书
财务部经理岗位职责
2014/02/03 职场文书
漫画「请问您今天要来点兔子吗?」最新杂志彩页公开
2022/03/24 日漫