H5和小程序的测试点，从哪方面分析?

bigegpt 2024-11-15 16:28 46 浏览

正文开始

近期接触了关于H5页面和小程序的测试。H5，也就是“HTML5”，指“HTML”的第5个版本，HTML5也是一种网页技术，包括HTML、CSS和JavaScript在内的一套技术组合，H5本质上可以理解为是一个网页，依赖的外壳主要是浏览器；微信小程序，是一种不需要下载安装即可使用的应用。

对H5页面和小程序的一些通用测试方法进行总结，在此分享给大家：

运行环境区分

客户端运行环境：H5是网页，运行环境主要依赖于浏览器；而微信小程序运行环境本身就属于计算机程序，再配合自己定义的开发语言标准，进而大幅提升了小程序的流畅度及其性能。

服务器配置：由于小程序的性能比H5高些，所以服务器的配置要求上来说，小程序的要求要比H5更高一些。

H5优势与劣势：

优势	劣势
H5可以跨平台，开发成本相对较低
H5可随时上线，只需更新版本，适合快速迭代	但H5目前基本无法将数据存储在本地，依赖实时性数据，网络状态不好的时候卡到哭
H5可以轻量的触达用户，提供更快捷的服务	但性能相对较低，影响用户体验
在微信入口或者浏览器上，用户只需点开链接就可以获取我们所提供的服务	但H5->的转化强依赖于浏览器

H5功能验证

（1）对于页面中的返回，以及浏览器自带的返回的测试。页面中的返回要考虑业务逻辑，返回到相应层次，需要从用户角度返回的转跳逻辑，不能出现死循环；并要注意返回后是否需要刷新页面请求通过H5页面（非手机自带返回键）的返回功能键返回，可以返回到正确的页面（上一级/退出H5）点击返回与back键，回退页面是否是期望页面。

（2）横竖屏切换后页面能自适应，不会出现布局散乱问题；或页面是否限制了只支持横或竖屏。

（3）在手机上从list列表点击进入detail详情页面是在原窗口打开。目的是这样可以通过页头的返回按钮返回，而不需要通过手机的返回键返回，交互表现更友好。

（4）关注页面请求是否会有多余的请求，或者请求后有多余的数据返回。目的是精简的内容减少了流量的浪费。

（5）图片适配测试。根据不同屏幕和分辨率做适配，以及适配后的清晰度，高端机取双倍尺寸的图--app兼容测试。

H5的测试点可详见：接口测试、业务测试（功能测试）、UI界面测试、兼容性测试、权限测试、安全测试、性能测试、数据埋点测试（你对 “数据埋点测试” 知晓多少？）

小程序测试技术

小程序的有这种特点：（1）类似WEB，但非HTML5；（2）即用即得；（3）拥有离线能力；（4）基于微信跨平台；（5）媲美原生操作体验

小程序的架构：微信小程序的框架包含两部分：一部分是View视图层（为了渲染页面结构，一般用WebView渲染），另一部分是AppSerive 逻辑层（用来逻辑处理、数据请求、接口调用，该层是使用JSCore运行），这两部分是分别在2个线程里进行运行，是通过系统层的JSBrigdage进行通信，AppSerive逻辑层把数据变化通知到WebView渲染，触发WebView渲染页面更新，WebView渲染把触发的事件通知到App Serive逻辑层进行业务处理。

小程序的测试点

小程序的测试点可详见：微信小程序测试点

除此上面列出的小程序测试点，还补充一下几点：

性能测试：除了（1）页面的白屏时间；（2）首屏时间；（3）资源占用；（4）页面渲染时间；还需要考虑耗电量、滑动帧率的测试

安全测试：危险账号授权、与小程序的app账号关联，以及接口测试中涉及传递的数据的安全性；

其他补充事项：（1）小程序目前不支持分享至朋友圈，但是可以用图片的方式分享至朋友圈；（2）小程序的添加删除功能；（3）微信端取消授权登录；（4）小程序升级更新（一般情况是强制升级更新）；（5）是否支持离线操作；

正文结束

h5和小程序的区别

上一篇：小程序商城、公众号和H5微商城的区别?
下一篇：微信小程序跟H5区别在哪?（小程序和h5的优缺点）

H5和小程序的测试点，从哪方面分析?

运行环境区分

H5优势与劣势：

H5功能验证

小程序测试技术

小程序的测试点

相关推荐

idea本地配置连接远程hadoop集群的一些网络问题解决汇总

无缓存不行?例行升级的入门级阿斯加特AN2 SSD装机点评

Ceph运维手册(基于P版本)

大数据开发前要做什么准备?8台Hadoop服务器进行集群规划前配置

Tensorflow分类loss函数总结 tensorflow绘制loss曲线

R语言学习笔记(七) -离散型数据的模型预测2

iOS Runtime详解

7 个对 Java 意义重大的性能指标，你知道几个?

PHP 远程调试最佳实践

Laravel框架使用图片处理简单教程