微信小程序开发原理与测试注意事项
背景
(1)Why:小程序普及率高、提供用户活跃度;
(2)What:小程序是什么、具备哪些能力;
(3)How:小程序架构、测试注意点;
小程序是什么
小程序是基于WEB规范,采用HTML、CSS和JS等搭建的一套框架。
小程序架构
小程序有哪些能力
提供了一系列基础组件
- 如:容器、表单、多媒体、地图、Canvas及web-view
封装了基于native应用的API接口
- 网络请求(http\websocket)
- 多媒体(图片、音频、视频)
- 文件、数据缓存、位置、调试等API
提供了微信庞大的用户接入能力
小程序应用文件结构
小程序打包后结构:
- 一个入口文件:app.js
- 一个全局样式:app.wxss
- 一个全局配置:app.json
- 页面:pages下,每个页面再按文件夹划分,每个页面4个文件
- 视图:wxml,wxss
- 逻辑:js,json(页面配置,不是必须)
小程序打包后的目录结构
1、WAService.js 框架JS库,提供逻辑层基础的API能力
2、WAWebview.js 框架JS库,提供视图层基础的API能力
3、WAConsole.js 框架JS库,控制台
4、app-config.json 小程序完整的配置,包含我们通过app.json里的所有配置,综合了默认配置型
5、app-service.js 应用逻辑代码,全部打包到这个文件
6、page-frame.html 小程序视图的模板文件,所有的页面都使用此加载渲染,且所有的WXML都拆解为JS实现打包到这里
7、pages 所有的页面,主要是处理WXSS转换,使用js插入到header区域。
小程序结构
View视图层
- View层用来渲染页面结构
App Service逻辑层
- 用来逻辑处理、数据请求、接口调用
- 它们在两个进程(两个Webview)里运行
- 视图层和逻辑层通过系统层的JSBridage进行通信
- 逻辑层把数据变化通知到视图层,触发视图层页面更新,视图层把触发的事件通知到逻辑层进行业务处理。
小程序开发手册
https://mp.weixin.qq.com/debug/wxadoc/dev/index.html
小程序注意事项
审核与发布
版本管理
可以使用小程序开发者助手方便快捷的预览和体验线上版本,体验版本以及开发版本。可以在体验版本中测试。
运营数据
有两种方式可以方便的看到小程序的 运营数据
- 方法一: 登录 小程序管理后台 - 数据分析 点击相应的 tab 可以看到相关的数据。
- 方法二: 使用小程序数据助手,在微信中方便的查看运营数据
测试用例设计注意点
1、浏览器适配:iOS与Android浏览器不同;
2、ROM适配:Android不同厂商其浏览器可能不同;
3、分辨率适配:iOS和Android不同机型适配;
4、典型案例分析:可罗列测试过程中的总结;
本文地址:https://blog.csdn.net/jlhx123456/article/details/107190084
下一篇: Web基础--HTML、Css