本文目录：
- 1.冷启动与热启动
- 2.小程序里不要频繁的进行setData
- 3.小程序的更新机制
- 4.小程序性能与体验优化
- 5.场景值scene的作用与应用场景
- 6.页面收录sitemap.json的作用与使用方法
- 7.云开发小程序上限审核流程
网页开发和小程序开发的主要区别.png
小程序运行环境.png
在不同的运行环境下，逻辑层和渲染层的运行位置都不同，所以在小程序开发中，要多用真机去进行调试。
小程序的开发其实就是典型的客户端原生与web技术结合的混合技术（Hybrid）
1.冷启动与热启动
第一次打开小程序，虽然以前打开过，但是数据被小程序主动销毁了，再次启动也算是冷启动，热启动：已经打开了，在一定时间内再次打开（大约5分钟），这时候的打开只是从后台切换到前台。
冷启动与热启动.png
2.小程序里不要频繁的进行setData
不表现在页面上的数据，不需要定义在data中。直接定义全局变量就行了。因为每次setData都会触发渲染层和系统层、逻辑层的通信。
小程序的渲染逻辑.png
3.小程序的更新机制
我们可以在app.js的onLaunch生命周期中，添加代码，进行版本的检查和更新，把下面这个函数放在onLaunch()里面，让小程序启动的时候就检查更新。
checkUpdate() {
const updateManager = wx.getUpdateManager()
// 检测版本更新
updateManager.onCheckForUpdate((res) => {
// 如果有版本更新的话
if (res.hasUpdate) {
updateManager.onUpdateReady(() => {
wx.showModal({
title: '更新提示',
content: '新版本已经准备好，是否重启应用',
// 如果用户选择的是确定
success(res) {
updateManager.applyUpdate()
}
})
})
}
})
}
4.小程序性能与体验优化
- 合理设置可点击元素的响应区域大小
- 避免渲染页面耗时过长
- 避免执行脚本时间过长
- 对网络请求做必要的缓存以避免多余的请求
- 不要引入未被使用的wxss样式
- 所有资源请求建议使HTTPS，更加安全
- 不要使用废弃接口
- 避免过大的WXML节点数目
- 一个页面少于1000个WXML节点
- 节点数深度少于30层
- 子节点数量不大于60个
- 避免将不可能被访问到的页面打包在小程序包里
- 及时回收定时器（小程序中的定时器都是全局的，不会随便页面切换而消失）
- 避免使用:active伪类来实现点击态（使用navigator组件）
- 滚动区域可开启惯性滚动以增强体验
IOS上：-webkit-overflow-scrolling:touch - 避免出现任何的Javascript异常
- 所有请求的耗时不应该太久，请求最好都要加上showloading，不要让页面处于假死状态
- 避免短时间内发起太多的图片请求
- 避免短时间内发起太多请求
setData的优化
- 避免setData的数据过大（小程序的限制是每次1M以内）
- 避免setData的调用过于频繁
- 避免将未绑定到WXML的变量传入setData
setData是一个异步操作，this.data是同步操作，setData的回调是所有同步任务完成后才去执行，但是this.data的值我们可以直接拿到进行使用
案例1：下面代码的执行顺序是什么？
test的初始值是0
console.log('test开始：'+this.test)
this.setData({
test:1
},()=>{
console.log('回调执行')
})
console.log('test设置后：’+this.test)
for (let i =0;i<10000;i++){
for(let j=0;j<10000;j++){}
}
console.log('长耗时：'+this.test)
//test开始：0
//test设置后：1
//test长耗时：1
//回调执行
案例2：setData改变对象的属性值
testObj的默认属性为name:zhangsan,age:27
changeAge(){
this.setData({
testObj:{
age:28
}
})
}
如果直接像上面这样设置的话，age属性值确实是变了，但是name属性就消失了，正确的做法应该是
changeAge(){
this.setData({
['testObj.age']:{
age:28
}
})
}
setData改变的值可以不事先在data中进行定义，但是建议所有需要setData并且在页面上显示的值都在data中进行定义。
小程序开发的性能检查：测试器中有个界面是Audits，我们开始检查后将页面的所有功能都手动操作一遍，然后点击Stop就会出现响应的评分，A是最好的
5.场景值scene的作用与应用场景
有几十种途径可以进行到小程序，每个途径对应着一个ID值，如扫描二维码对应的是1011，长按图片识别二维码对应的1012
我们可以通过对应的代码设置，来实现根据不同的入口场景，来实现页面的分流，同时也可以很方便的进行后期的数据统计。
在app.js中对应的生命周期onShow()中添加代码(onShow监听小程序的启动和切前台)
开发者工具的导航栏有个功能键“切后台”，点击后可以模拟小程序切入后台，然后可以选择不同的场景来进行小程序
onShow(options){
}
onLauch:监听小程序的初始化
onShow:监听小程序的启动和切换前台
这两个的options的结构是一样的，里面都有scene字段
options可以打印出来scene值，根据这个值的不同我们可以进行不同的设置，同时onLaunch生命周期中有可以进行打印，有几个特定的场景代表着来源是外部的应用（其他小程序或者公众号），如果是的话，options的referrerInfo字段会出现appid值，对我们也很有用。
6.页面收录sitemap.json的作用与使用方法
在sitemap没出现之前，小程序的搜索只能通过分类的名称，sitemap让小程序的搜索也可以根据页面内容实现。（本质就是小程序的搜索功能优化）
小程序的官网设置页面，有一个页面收录功能开关按钮，默认是开启的
项目文件里默认创建有sitemap.json，我们可以里面添加和改变配置，在page里面配置页面，*代表所有页面。页面参数params以及匹配规则matching都是可以自由配置的。
"action":"allow"//允许被索引
"action":"disallow"//不允许被索引
7.云开发小程序上限审核流程
微信公众平台=》版本管理
首先需要把项目提交成”体验版”，项目预览只有项目成员才可以扫描二维码进行预览，小程序成为“体验版”
微信开发者工具右上角有个按钮”上传”，上传之后就生成了体验版，微信公众平台的版本管理中就有了对应的“开发版本”。
网友评论