这是我参与「第四届青训营 」笔记创作活动的的第4天
一、本堂课重点内容：
- 小程序发展历程
- 小程序业务价值
- 小程序技术解析
- 相关拓展内容
二、小程序发展历程：
发展历程
核心数据
小程序生态
三、小程序业务价值：
与Web的区别 ：
-
有着固定的语法以及统一的版本管理，平台可以更方便的进行审核
-
平台能的够控制各个入口，如二维码，文章内嵌，端内分享入口上也能带来更好的用户体验
-
小程序基于特殊的架构，在流畅度上比WEB更好，有更优秀的跳转体验
三大价值：
-
渠道价值：依托于许多超级平台，如美团和美团优选小程序带来的流量占比分别是40%和80%
-
业务探索价值：相对于原生App,开发成本低
-
数字升级价值：从线下到线上
四、小程序技术解析：
小程序原理
第三方开发应用最简单最方便的方式: WebView + JSBridge
WebView可以简单理解为App内置的浏览器，在App内展示网页，但是除了Web本身，我们想让开发者能够通过JS调用更多App上的功能怎么办？
App上的功能比如打开相机，打开地图等，这些单靠Web Api本身做不到，这就需要用到JSBridge
顾名思义，JSBridge就是JS和Native代码之间的桥梁，让两者能相互沟通和调用，实现JSBridge的方式有很多，如代码注入，url拦截等
提出三个目标：
- 开发门槛低：HTML + JS + CSS
- 接近原生的使用体验：资源加载 + 渲染 + 页面切换
多层Webview
- 保证安全可控：独立JS沙箱（分开逻辑层和渲染层）
逻辑层：
那不操作DOM如何控制页面渲染呢？
系统预留了setData函数，
仅需关系数据流：
graph LR
Data --> 根据数据处理DOM --> 页面
三个目标结合的方案——小程序
小程序语法
实现番茄时钟
小程序预览图：
部分代码参考：
五、相关拓展内容：
跨端框架介绍
为了解决两个问题：
- 复杂应用构建
- 一次开发跨多端
常见框架：
跨端框架原理
编译时：
AST抽象语法树 （拓展阅读：AST详解与运用）
就是把我们写的代码按照一定的规则转换成一种树形结构。
然后再转换为小程序代码。
缺陷：无法完全抹平差异，背离了一次开发跨多端初衷
运行时：
依赖于两部分：
- 虚拟DOM（逻辑->真实DOM）
- Template组件（渲染->实际元素树）
一些场景下相比小程序原生语法性能差：例如长列表。
