当前位置：首页 > news >正文

【测试理论基础之小程序/h5】

news 来源：原创 2024/5/8 15:45:08

近年来，由于社交电商的火爆程度，相较于传统的电商淘宝、京东、天猫这种第三方平台，其余平台的发展也势不可挡。并且第三方平台的竞争过大，成本过高，抢流量越来越难之后，越来越多的商家企业开始转战H5微商城和小程序，微信小程序等平台。

小程序

小程序其实就是内嵌在某一APP，不需要安装和卸载的一种新应用形态。不能脱离其所在的平台进行单独运行。它具备的两个强属性：提高效率，用完即走！因此小程序的设计以轻便、快捷为原则，鼓励用户“即用即走”。

H5，也就是“HTML5”，指“HTML”的第 5 个版本。众所周知“HTML”是”超文本标记语言”，是一门描述网页的标准语言，所以 HTML5 也是一种网页技术，而且是更高级的网页技术，包括 HTML、CSS 和 JavaScript 在内的一套技术组合。

所以，H5 本质上可以理解为是一个网页！可以简单地认为是网页，用在移动端或者PC端的网页开发技术。

既然可以说 H5 是网页，那么依赖的主体就主要是浏览器了，因此只要有浏览器，就可以使用了。像是手机内置的浏览器、APP 的 web-view 组件，以及小程序提供的 web-view 组件，以上就都可以打开 H5 页面。

既然 H5 是网页，那么依赖的外壳主要是浏览器，因此只要有浏览器，就可以使用。比如手机内置的浏览器，APP 的 web-view 组件，以及小程序提供的 web-view 组件，都可以打开 H5 页面。

小程序和H5区别：

一、开发的成本不同

小程序因为是在特定的环境中去开发，所以它的组件、UI都是确定好了的，也不用去考虑兼容问题，修改的次数就会减少，这样成本会低一些，只是很多标签是小程序特有的需要修改。

H5在开发时会有开发工具的选择、框架的选择、UI的选择等问题，还要兼顾到浏览器是否兼容的问题，可能会面临多次修改，这样会增加成本。

二、呈现方式

H5：就是网页，主要在网页为依托，靠浏览器来呈现内容的，并且可以以微信为转接，通过链接跳转来使用。因为H5是网页的原因，所以如果有很多功能或者图片需要加载的话，可能会比较慢一些。

小程序：小程序与H5的主要区别就在于小程序需要和微信绑定，不能独立的存在。好处也在可以与微信一键绑定微信用户的手机号。在速度上，小程序依然基于APP端去实现，这样在使用时就感到很流畅。

三、运行环境

了小程序只能在特定的平台内运行，所以没有不能单独使用小程序。

H5是网页，只要有浏览器就可以使用，手机自身的浏览器就可以使用。

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

四、系统权限

因为微信能获取到更多的系统权限，如网络通信状态、数据缓存能力等，这些系统级权限都能与微信小程序无缝衔接，这也就是官方宣称的微信小程序能够拥有 Native App（原生 APP）的流畅性能。

而 H5 Web 应用对系统本身的权限的获取则相对少了很多，这一点恰巧是 H5 Web 应用经常被诟病的地方。也因此，H5 的大多数应用被圈定在业务逻辑简单、功能单一的范围上。

五、用户体验

1）性能体验

我们在打开一个 H5 页面的时候，实际上就是打开一个 Web 网页，之前在 PC 上浏览网页没区别，每次要请求各种图片样式资源，在浏览器内核里渲染，这个过程叫做加载，无论加载的时间的长短，都会给用户一种”卡“或者“不灵敏”的感觉，体验是会比较差一些的；

而小程序是微信内的云端应用，通过 WebSocket 双向通信（保证无需刷新即时通信）、本地缓存（一旦首次打开小程序可以直接缓存很多资源和图片，降低与服务器交互延时）以及微信底层技术优化实现了小程序接近原生 APP 的体验。

所以在使用小程序的时候，同等网络条件下几乎不用等待，可以像操作普通 app 一样流畅。

小程序的优越性体现在既保留了 H5 开发的便利和灵活性，又可以达到媲美 Native 体验。

2) 视觉体验

H5 的动画效果更丰富，自由度更高一些，功能更强

六、使用场景

1）打开的方式：就如上面概念里提到的，小程序只能在微信里打开，而 H5 页面可以借助微信的环境下扫码或点击链接打开在任何浏览器里打开，所以，如果产品需要通过短信通知用户带上访问地址，就无法用小程序实现了；而 H5 可以在短信正文中直接用手机内置浏览器打开。

2）分享的方式：由于微信本身的策略的限制，H5 在微信里可以直接分享到朋友圈；而小程序就只能生成带小程序码的图片发到朋友圈，不如 H5 便捷；但是对于分享到好友或群，小程序提供了卡片式的分享界面，信息多而且看起来很高端，这个效果 H5 是无法做到。

3）支付能力：因为小程序是内嵌在微信里的，所以支付只支持微信支付；而 H5 里可以选择使用其他支付平台提供的支付方式，因此 H5 的支付方式更加的多样化。

4）导流量功能：APP用户都在APP上，愿意花钱的用户也在微信上那我把我的服务也做到微信上就可以获取更多客户了；小程序依附于微信，配合微信 11 亿用户的社交网络，越来越开发者选择微信小程序的技术的。

据小程序团队透露，目前已经 50 万 + 的开发者在从事实际的开发，小程序已经成为移动互联网领域“事实”的标准。伴随着这种趋势，阿里、百度分别在 2017 年的 8 月和 2018 年的 3 月启动了自己的小程序项目，围绕着支付宝和手机百度 APP 几个超级 APP 在移动互联网领域再次攻城略地。小程序已然成为近几年最炙手可热“现象级”技术。

5）追踪用户行为：小程序还有一个优势，就是通过小程序的分享转发，每一次谁转发了，到了哪里，谁点开看了这些信息我们都是可以知道的，通过此可以知道用户和身边朋友对品牌的喜好。这个信息是过去 APP 电商、PC 互联网电商做不到的，基于社群化的分享和交流可以知道社群消费力是怎么样的情况，喜欢什么样的品牌，什么样的方式更合适。通过这样的信息收集背后有算法可以比较精确地推荐计算，这些东西的确是在 APP 上、H5 上做不到的。