Skip to content

wechat.md

Latest commit

 

History

History
78 lines (70 loc) · 5.9 KB

wechat.md

File metadata and controls

78 lines (70 loc) · 5.9 KB

微信小程序

解决小程序内嵌H5缓存问题

  • web-view 组件就是一个嵌在小程序里的浏览器，它在缓存上并没有完全遵照强制缓存和协商缓存的运行机理
  • 解决方案：小程序在onShow通过接口获取页面版本号，把版本号附在请求url参数中

uniapp和小程序的生命周期之间区别

生命周期分类 uniapp 微信小程序
应用生命周期 onLaunch、onShow、onHide onLaunch,onShow,onHide
页面生命周期 onLoad、onShow、onReady onLoad, onShow, onReady, onHide, onUnload

小程序的生命周期理解

小程序的加载顺序是这样的

  • 首先执行 App.onLaunch -> App.onShow
  • 其次执行组件的初始化 Component.created -> Component.attached
  • 再执行 Page.onLoad -> Page.onShow
  • 最后 执行 Component.ready -> Page.onReady 当页面中包含组件时，组件的生命周期(包括pageLifetimes)总是优先于页面，Behaviors生命周期优先于组件的生命周期

小程序onLoad和onShow区别

  • onLoad 页面加载时触发。一个页面只会调用一次，可以在 onLoad 的参数中获取打开当前页面路径中的参数。
  • onShow 页面显示/切入前台时触发。

小程序耗时主要体验在哪里，如何优化

主要关键在于，启动性能，由于首页渲染需要使用逻辑层发送的数据，结合逻辑层得到的数据和渲染层得到的页面结构和样式信息，小程序框架会进行小程序首页的渲染，展示小程序首屏，并触发首页的 Page.onReady 事件。

启动性能优化

  1. 【代码包下载】代码包下载不是启动过程中必然发生的，下载也不都是在启动过程中发生的，在页面跳转和分包预下载等过程中也会发生下载
    1. 尽可能的控制总代码包大小
    2. 合理的分包加载
    3. app.json配置分包预下载功能
    4. 按需配置，独立分包功能
  2. 代码注入优化
    1. 减少启动过程的同步调用 ，启动相关的几个生命周期中，应避免执行复杂的计算逻辑或过度使用Sync结尾的同步 API，对于查询结果使用缓存避免重复调用
    2. 启用「懒注入」，在小程序启动期间，所有主包页面及自定义组件的代码都会进行注入。app.json配置懒注入"lazyCodeLoading": "requiredComponents"，有选择地注入必要的代码，以降低小程序的启动时间和运行时内存。
  3. 页面渲染优化
    1. 【数据预拉取配置】，提前首屏数据请求，小程序 MP 管理后台配置
    2. 【周期性更新】，客户端会在一定的网络条件下，每隔 12 小时，配置的数据下载地址发起一个 HTTP GET 请求，小程序 MP 管理后台配置
    3. 骨架屏
    4. 缓存请求数据 wx.getStorage
    5. 精简首屏数据，延迟请求非关键渲染数据（懒加载），图层渲染无关数据不要放在 data 中
    6. 【初始渲染缓存技术】使视图层不需要等待逻辑层初始化完毕提前将页面初始 data 的渲染结果展示给用户

小程序rpx与px如何换算

微信小程序定义屏幕宽度为750rpx，如iPhone6的逻辑像素375px，物理像素为750rpx， 则750rpx = 375px = 750物理像素 1rpx = 0.5px = 1物理像素

小程序wxss与css区别

与 CSS 相比，WXSS 扩展的特性有：

  • 尺寸单位rpx
  • 样式导入 使用@import语句可以导入外联样式表## 小程序关联公众号如何确定用户唯一性

用户唯一标识 OpenID

当前小程序已绑定到微信开放平台帐号， 用户访问公众号的网页，也会产生一个用户和公众号唯一的OpenID

UnionID 机制说明

如果开发者拥有多个移动应用、网站应用、和公众帐号（包括小程序），可通过 UnionID 来区分用户的唯一性。因为只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号（包括小程序），用户的 UnionID 是唯一的

UnionID获取途径

  • 开发者可以直接通过 wx.login + code2Session 获取到该用户 UnionID，无须用户授权。
  • 小程序端调用云函数时，可在云函数中通过 cloud.getWXContext 获取 UnionID。

小程序登录流程

  • 小程序：wx.login() -> code 发送服务器
  • 开发者服务器：code -> appid + appsecret + code 发送到微信接口服务WHA
  • 微信接口服务：appid + appsecret + code -> session_key + openid 发送到服务器
  • 开发者服务器：session_key + openid -> 自定义登录信息(token) 发送到小程序
  • 小程序: 自定义登录信息(token) -> 存入storage
  • 小程序: -> 发起业务请求wx.request()携带登录信息(token) 发送服务器
  • 服务器: 携带登录信息(token) -> 查询session_key + openid -> 返回业务数据 发送到小程序
  • 小程序：获取业务数据

注意：临时登录凭证 code 只能使用一次