微信小程序的【运行机制】解读

这篇具有很好参考价值的文章主要介绍了微信小程序的【运行机制】解读。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。


微信小程序的【运行机制】解读

导语

前面我们有章节给大家讲到了,微信小程序的生命周期钩子函数,那么大家知道,这些不同的生命周期函数,是在什么样的操作运行模式下触发的吗?本章节就给大家整理了有关于 微信小程序 的操作运行机制,以便于对后面微信小程序的开发理解。


1.微信小程序的运行流程

微信小程序从启动到最终被销毁,会经历很多不同的状态,小程序在不同状态下会有不同的表现形式。

运行流程图例
微信小程序的【运行机制】解读

1.1 微信小程序的启动模式

从广泛意义上来说,微信小程序的启动模式可以被分为两种状态,一种是 冷启动 ,另一种为 热启动,那么对于这两种启动模式的区别又是什么呢?

从系统的运行的模式上,可以被区分为以下两种模式:

  • 冷启动:如果用户是首次打开小程序,或者小程序被完全销毁后被用户再次打开,此时的小程序需要重新加载启动,就叫做冷启动
  • 热启动:如果用户已经打开过小程序了,然后在一定时间内再次打开该小程序,此时小程序并未被完全销毁,只是从后台状态进入前台状态,这个过程就是热启动

从小程序的生命周期函数触发的角度来看,我们一般所说的 启动,专指为冷启动,热启动 一般被称为 后台切换为前台。


1.2 前台与后台的概念

小程序启动后,界面被展示出来给用户呈现后,此时小程序处于「前台」状态。

当用户「关闭」小程序时,小程序其实并没有真正被关闭,而是进入了「后台」状态,此时小程序还可以短暂运行一小段时间,但部分 API 的使用会受到限制。切入后台的方式包括但不限于以下几种:

  • 点击右上角胶囊按钮离开小程序
  • iOS 从屏幕左侧右滑离开小程序
  • 安卓点击返回键离开小程序
  • 小程序前台运行时直接把微信切后台(手势或 Home 键)
  • 小程序前台运行时直接锁屏

以上几种的操作触发时,一定时间内,小程序均未完全被退出。当用户再次进入微信并打开小程序,小程序又会重新进入「前台」状态。


1.3 挂起

小程序进入「后台」状态一段时间后(目前是 5 秒),微信会停止对小程序 JS 线程的执行,小程序则会进入「挂起」状态。而此时小程序的内存状态依然会被保留,但开发者代码的执行会停止,事件和接口回调会在小程序再次进入「前台」时触发。

1.4 微信小程序的销毁

当用户长时间未使用小程序时,或者系统资源紧张,小程序会被 完全「销毁」,即完全终止运行。具体而言包括以下几种情形:

  • 当小程序进入后台并被「挂起」后,如果很长时间(目前是 30 分钟)都未再次进入前台,小程序会被销毁。
  • 由于底层系统机制原因,当小程序占用系统资源过高,也可能会被系统销毁或被微信客户端主动回收。

2.微信小程序冷启动的页面

当微信小程序执行冷启动时,打开的页面有以下情况:

(A 类场景)若启动的场景中不带 指定页面路径:

基础库 2.8.0 以下版本,在冷启动时默认直接进入首页。

基础库 2.8.0 及以上版本遵循「重新启动策略」,可能是首页或上次退出的页面。

(B 类场景)若启动的场景中带有 指定页面路径,则启动会进入对应 指定页面路径的页面。

2.1从新启动策略

当小程序冷启动时,如果启动时不带 path(A 类场景),默认情况下将会进入小程序的首页。 在页面对应的 json 文件中(也可以全局配置在 app.json 的 window 段中),指定 restartStrategy 配置项可以改变这个默认的行为,使得从某个页面退出后,下次 A 类场景的冷启动可以回到这个页面。

微信小程序的【运行机制】解读
例:

{
  "restartStrategy": "homePage"
}

注意
即使不配置为 homePage ,微信小程序如果退出过久(当前默认一天时间,可以使用退出状态来调整),下次冷启动时也将不再遵循 restartStrategy 的配置,而是直接从首页冷启动

当完全退出时,页面中的状态并不会被保留,如输入框中的文本内容、 checkbox 的勾选状态等都不会还原。如果需要还原或部分还原,需要利用退出状态


3.微信小程序热启动页面

当微信小程序执行 热启动时,打开的页面也有以下情况:

  • (A 类场景)若启动的场景中不带 指定页面路径,则保留上次的浏览的状态
  • (B 类场景)若启动的场景中带有 指定页面路径,则会直接加载到对应 路径的页面

A 类场景有以下一些能被触发的场景
微信小程序的【运行机制】解读

4. 退出状态

每当微信小程序可能被销毁之前,页面回调函数 onSaveExitState 会被触发。如果想保留页面中的状态,可以在这个回调函数中“保存”一些数据,下次启动时可以从新获得这些已保存数据。

{
  "restartStrategy": "homePageAndLatestPage"
}
Page({
  onLoad() {
    var prevExitState = this.exitState // 尝试获得上一次退出前 onSaveExitState 保存的数据
    if (prevExitState !== undefined) { // 如果是根据 restartStrategy 配置进行的冷启动,就可以获取到
      prevExitState.myDataField === '上一次保存的数据' 
    }
  },
  onSaveExitState() {
    let exitState = { myDataField: '上一次保存的数据' } // 需要保存的数据
    return {
      data: exitState,
      expireTimeStamp: Date.now() + 24 * 60 * 60 * 1000 // 超时时刻
    }
  }
})

onSaveExitState 返回值可以包含两项:
微信小程序的【运行机制】解读

注意点补充

  • 如果超过 expireTimeStamp 所设置的时间范围 ,那么保存的数据将被丢弃,并且冷启动时不遵循 restartStrategy 的配置,而是直接从首页冷启动
  • expireTimeStamp 有可能被自动提前,如微信客户端需要清理数据的时候
  • 在小程序存活期间, onSaveExitState 可能会被多次调用,此时以最后一次的调用结果作为最终结果。
  • 在某些特殊情况下(如微信客户端直接被系统杀死,或系统出现异常,强制性终止微信客户端运行环境),这个方法将不会被调用,下次冷启动也不遵循 restartStrategy 的配置,而是直接从首页冷启动。

总结

上述内容,是我结合官方文档梳理的内容,讲述了整个微信小程序的运行流程模式,以及在不同的业务操作下,将执行不同的运行机制。


🚵‍♂️ 博主座右铭:向阳而生,我还在路上!
——————————————————————————————
🚴博主想说:将持续性为社区输出自己的资源,同时也见证自己的进步!
——————————————————————————————
🤼‍♂️ 如果都看到这了,博主希望留下你的足迹!【📂收藏!👍点赞!✍️评论!】
——————————————————————————————文章来源地址https://www.toymoban.com/news/detail-457261.html

到了这里,关于微信小程序的【运行机制】解读的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信小程序——生命周期详解(代码解读)

    ✅作者简介:2022年 博客新星 第八 。热爱国学的Java后端开发者,修心和技术同步精进。 🍎个人主页:Java Fans的博客 🍊个人信条:不迁怒,不贰过。小知识,大智慧。 💞当前专栏:微信小程序学习分享 ✨特色专栏:国学周更-心性养成之路 🥭本文内容:微信小程序——使

    2024年02月07日
    浏览(34)
  • 微信小程序配置npm构建详细解读

    npm 支持 | 微信开放文档 总之就是,1、开启  2、根据谁进行构建,指定构建后生成的位置      1、 在项目根目录 npm init  生成package.json文件    2、npm install  安装要使用的模块 如· npm i @vant/weapp -S --production    3、 微信开发工具  【工具】-》【构建npm】 构建成功会生成

    2024年02月16日
    浏览(30)
  • 苍穹外卖项目解读(四) 微信小程序支付、定时任务、WebSocket

    HM新出springboot入门项目《苍穹外卖》,笔者打算写一个系列学习笔记,“苍穹外卖项目解读”,内容主要从HM课程,自己实践,以及踩坑填坑出发,以技术,经验为主,记录学习,也希望能给在学想学的小伙伴一个参考。 注:本文章是直接拿到项目的最终代码,然后从代码出发

    2024年02月07日
    浏览(28)
  • 微信小程序克隆到运行

    小程序开发工具下载:官网登陆后下载开发软件 https://mp.weixin.qq.com/ https://mp.weixin.qq.com/cgi-bin/wx 1.git克隆 2.安装依赖 npm i 如果遇到卡在node lib/install.js 一直不进行 重新运行安装:(https://www.python100.com/html/3716RLP8FZM2.html) 理解npm install --ignore-scripts 3.安装完运行 如果报错: 可以尝

    2024年02月11日
    浏览(25)
  • 微信小程序-关于新版隐私协议接口wx.onNeedPrivacyAuthorization的适配解读以及实现代码

    代码插件已集成,即插即用, 五分钟集成进项目, 免费下载 ,欢迎大家交流  微信小程序用户隐私保护协议弹窗插件下载 官方公告地址:关于小程序隐私保护指引设置的公告 | 微信开放社区 1、首先看一下这个网址,里边包含涉及到的隐私的接口,这些接口都要适配一下,否则将会

    2024年02月10日
    浏览(41)
  • 微信小程序学习—配置HBuilder运行微信小程

    第一次接触微信小程序开发。在网上找了个项目想要运行,遇到了一些问题,记录一下运行的问题,以及解决方式,供大家参考。 遇到的报错  于是上网搜索结果 第一步 在微信小程序中打开 设置—安全设置 打开服务端口 但是我还是报错 第二步 检查HBuilder中的微信小程序运

    2024年02月13日
    浏览(34)
  • 微信小程序不同在系统的运行环境

    系统 逻辑层运行环境 渲染层运行环境 iOS JSCore(JavaScriptCore) WKWebView(iOS浏览器内核) Android V8(Chrome V8引擎) XWeb(基于Mobile Chromium内核) 微信开发者工具 NWJS或者Chrome V8 Chromium WebView 说明: 在iOS系统上,小程序的逻辑层运行环境是JSCore(JavaScriptCore),负责处理业务逻辑

    2024年02月03日
    浏览(23)
  • 使用Uniapp运行、打包、发布微信小程序

    1、HBuilder X 打开项目,运行到微信开发者工具,此时会唤起微信开发者工具 2、打包,运行------小程序-微信, 打包中  打包后的文件 3、打包完成后,在小程序开发工具中点击右上角------点击上传 点击上传   4、到小程序后台就可以看到了。测试需要设为体验版,然后测试后

    2024年02月16日
    浏览(27)
  • 微信小程序——运行他人的项目、寻找appid

    如果想要运行他人写好的微信小程序且规避一些报错的的话,如何实现? 1.导入项目 2.修改appid 首先找到 project.config.json 文件里面的 appid ,然后将appid改为自己小程序的 appid 即可。 自己的appid在哪里找? 1.进入微信公众平台https://mp.weixin.qq.com/ 2.有账号的扫码登录,没账号的

    2024年02月14日
    浏览(43)
  • 微信小程序-关于新版隐私协议接口wx.onNeedPrivacyAuthorization getPrivacySetting requirePrivacyAuthorize的适配解读以及实现代码

    代码插件已集成,即插即用, 五分钟集成进项目, 免费下载 ,欢迎大家交流  微信小程序用户隐私保护协议弹窗插件下载 官方公告地址:关于小程序隐私保护指引设置的公告 | 微信开放社区 1、首先看一下这个网址,里边包含涉及到的隐私的接口,这些接口都要适配一下,否则将会

    2024年02月10日
    浏览(34)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包