2019-09-24小程序 与 App 与 H5 之间的区别

小程序的实现原理

根据微信官方的说明,微信小程序的运行环境有 3 个平台,iOS 的 WebKit(苹果开源的浏览器内核),Android 的 X5 (QQ 浏览器内核),开发时用的 nw.js(C++ 实现的 web 转桌面应用)。

平台

渲染

js 运行环境

iOS

WKWebView

JavaScriptCore

Android

X5 基于 Mobile Chrome 37 内核

X5 JSCore

开发工具

Chrome WebView

nw.js

小程序运行时会创建两个线程:View Thread 和 AppService Thread,相互隔离,通过桥接协议 WeixinJsBridage 进行通信(包括 setData 调用、canvas 指令和各种 DOM 事件)。

下述表格展示了两个线程的区别:

线程名称

所属模块

运行代码

原理

说明

View

视图层

WXML/WXSS

WebView 渲染

wxml 编译器把 wxml 文件转为 js 并构建 virtual dom;wxss 编译器把 wxss 文件转化为 js。

AppService

逻辑层

JS

JavascriptCore 运行

无法访问 window / document 对象

两个线程是通过系统层的 JSBridage 来通信的,逻辑层把数据变化通知到视图层,触发视图层页面更新,视图层把触发的事件通知到逻辑层进行业务处理。

小程序与 App 的区别

运行环境

原生 App 直接运行在操作系统的单独进程中(在 Android 中还可以开启多进程),而小程序只能运行在微信的进程中。

开发成本

原生 App 的开发涉及到 Android/iOS 多个平台、开发工具、开发语言、不同设备的适配等问题;而小程序只需要开发一个就可以在 Android/iOS 等不同平台不同设备上运行。

原生 App 需要在商店上架(Android 需要上架各种商店);小程序只能在微信平台发布。

系统权限

原生 App 调用的是系统资源,也就是说系统提供给开发的的 API 都可以使用;而小程序是基于微信的,小程序所有的功能都受限于微信,也就是说微信给开发者提供 API 才可以使用,不能绕过微信直接使用系统提供的 API。

原生 App 可以给用户推送消息;小程序不允许主动给用户发送消息,只能回复模版消息 。

原生 App 有独立的数据库,可以做离线存储;小程序只能存储到 LocalStorage,无法做离线存储。

原生 App 需要下载,安装包比较大;小程序无需下载,可以通过小程序码等方式通过微信直接打开。

运行流畅度

原生 App 运行在操作系统中,所有的原生组件可以直接调用 GPU 进行渲染;而小程序运行在微信的进程中,只能通过 WebView 进行渲染。

小程序与 H5 的区别

运行环境

简单来说,小程序是一种应用,运行的环境是微信(App);H5 是一种技术,依附的外壳是是浏览器。

H5 的运行环境是浏览器,包括 WebView,而微信小程序的运行环境并非完整的浏览器,因为小程序的开发过程中只用到一部分H5 技术。

小程序的运行环境是微信开发团队基于浏览器内核完全重构的一个内置解析器,针对性做了优化,配合自己定义的开发语言标准,提升了小程序的性能。

小程序中无法使用浏览器中常用的 window 对象和 document 对象,H5 可以随意使用。

开发成本

H5 的开发,涉及开发工具(vscode、Atom等)、前端框架(Angular、react等)、模块管理工具(Webpack 、Browserify 等)、任务管理工具(Grunt、Gulp等),还有 UI 库选择、接口调用工具(ajax、Fetch Api等)、浏览器兼容性等等。

尽管这些工具可定制化非常高,大部分开发者也有自己的配置模板,但对于项目中各种外部库的版本迭代、版本升级,这些成本加在一起那就是个不小数目了。

而开发一个微信小程序,由于微信团队提供了开发者工具,并且规范了开发标准,则简单得多。前端常见的 HTML、CSS 变成了微信自定义的 WXML、WXSS,官方文档中都有明确的使用介绍,开发者按照说明专注写程序就可以了。

需要调用后端接口时,调用发起请求API;需要上传下载时,调用上传下载API;需要数据缓存时,调用本地存储API;引入地图、使用罗盘、调用支付、调用扫码等等功能都可以直接使用;UI 库方面,框架带有自家 weui 库加成。

并且在使用这些 API 时,不用考虑浏览器兼容性,不用担心出现 BUG,显而易见微信小程序的开发成本相对低很多。

系统权限

微信小程序相对于 H5 能获得更多的系统权限,比如:网络通信状态、数据缓存能力等,这些系统级权限都可以和微信小程序无缝衔接。

而这一点恰巧是 H5 被诟病的地方,这也是 H5 的大多应用场景被定位在业务逻辑简单、功能单一的原因。

运行流畅度

这条无论对于用户还是开发者来说,都是最直观的感受。长久以来,当HTML5应用面对复杂的业务逻辑或者丰富的页面交互时,它的体验总是不尽人意,需要不断的对项目优化来提升用户体验。但是由于微信小程序运行环境独立,尽管同样用 HTML +CSS + JS 去开发,但配合微信的解析器最终渲染出来的是原生组件的效果,自然体验上将会更进一步。

————————————————

版权声明:本文为CSDN博主「jeanboydev」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。

原文链接:https://blog.csdn.net/freekiteyu/article/details/84316183

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 218,386评论 6 506
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,142评论 3 394
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 164,704评论 0 353
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,702评论 1 294
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,716评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,573评论 1 305
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,314评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,230评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,680评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,873评论 3 336
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,991评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,706评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,329评论 3 330
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,910评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,038评论 1 270
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,158评论 3 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,941评论 2 355

推荐阅读更多精彩内容

  • Swift1> Swift和OC的区别1.1> Swift没有地址/指针的概念1.2> 泛型1.3> 类型严谨 对...
    cosWriter阅读 11,101评论 1 32
  • 今天上了公开课,对于我来说,这是一节常态课,也是一节传统课。由于我们班的一体机不能正常使用,所以,我们从开学至今一...
    天高云淡_10303阅读 228评论 0 1
  • 01 突然下了一场大雨,空气里都是凉凉的泥味。春天的雨都是伴着雷的,一道闪电把云朵点亮,下一秒就是轰鸣。 小时候打...
    上帝板板阅读 415评论 3 5
  • 这本书用了1个多星期看完的。 其实,我对整本书的时间构建上有些不太容易接受,书里描写的时间跨度其实挺大的,刚开始看...
    Tina育儿阅读 321评论 0 0