小程序学习笔记（一）构建对小程序的完整认识

1.小程序与webView（小程序发展历史）

随着公众号的出现和繁荣，WebView 的使用频率也越来越高。不少的企业或是小商家、外包公司开始做 H5 页面，各式各样的 H5 活动页、小商城、小游戏满天飞。但H5 的劣势也很明显，体验太渣，甚至还不能获取很多 APP底层拥有的功能。微信团队也因此提供了一些 JS-SDK 给 Web 开发使用，包括拍摄、录音、语音识别、二维码、地图、支付、分享等能力。但webView仍然由于单线程经常会出现业务逻辑执行过长影响页面渲染的问题，造成页面切换的生硬和点击的迟滞感。如下场景

微信面临的问题是如何设计一个比较好的系统，使得所有开发者在微信中都能获得比较好的体验。这个问题是之前的 JS-SDK 所处理不了的，需要一个全新的系统来完成，它需要使得所有的开发者都能做到：

（1）快速的加载

（2）更强大的能力

（3）原生的体验

（4）易用且安全的微信数据开放

（5）简单和高效的开发

于是，符合以上特点的小程序就出现了

2.认识小程序及其应用

从产品角度来看小程序

小程序的特点是小而快，又能有接近原生APP的体验，用完即走，且开发快捷，产品上线周期短，迭代迅速，扫码打开，便于推广，且依托于微信巨大的流量入口，小程序拥有着天然的流量优势。相较于naive APP，小程序的适用场景多是用户的刚需低频服务，如一些工具类，低频生活服务类服务，小程序扫码就能用，用完就可以关掉，不会一直占用手机内存，不想用了还可以删掉。还有在餐馆酒店等线下消费场景下，扫码使用小程序就能完成包括点菜付款在内的各项服务，不必下载APP关注公众号。

从技术角度来看小程序

小程序的主要开发语言是 JavaScript。小程序用的是一套全新的技术规范和技术架构,它是微信自有的，与W3C规范的那个html5+css3没有关系。与普通网页开发的区别：

（1）网页开发渲染线程和脚本线程是互斥的，这也是为什么长时间的脚本运行可能会导致页面失去响应，而在小程序中，二者是分开的，分别运行在不同的线程中。

（2）网页开发者可以使用到各种浏览器暴露出来的 DOM API，进行 DOM 选中和操作，而小程序的逻辑层和渲染层是分开的，逻辑层运行在 JSCore 中，并没有一个完整浏览器对象，因而缺少相关的DOM API和BOM API，这一区别导致了前端开发非常熟悉的一些库，例如 jQuery、 Zepto 等，在小程序中是无法运行的。（小程序逻辑层与渲染层如何通信在后续博文介绍）

（3）小程序的标签不是html,它是借鉴react理念定义出来的一整套新的标签库,它只能运行在微信的浏览器下，与H5的各种标签理念很相似，细节却相差巨大。

（4）小程序的页面是基于本地的,无需通过服务端请求.任何页面跳转都可以不通过服务端交互.这无疑比起服务号/企业号等基于h5的模式拥有更佳的用户体验,拥有接近原生app的体验.

（5）小程序可以使用webSocket，实现与服务器的实时交互。

（6）网页开发者需要面对的环境是各式各样的浏览器，PC 端需要面对 IE、Chrome、火狐浏览器等，在移动端需要面对Safari、Chrome以及 iOS、Android 系统中的各式 WebView 。小程序开发过程中需要面对的是两大操作系统 iOS 和 Android 的微信客户端，以及用于辅助开发的小程序开发者工具。

安卓与IOS上的微信客户端中的JSCore是不一样的，渲染层也不一样。

3.小程序的整体认识

可以把微信客户端理解为相对于小程序的“操作系统”，小程序借助该“操作系统”提供的API获得更多能力。小程序拥有自己的一套框架、语法以及开发上的设计，与传统的H5开发有联系但区别巨大不可等同。

参考资料：

《小程序开发指南》

《小程序的诞生》