这是我参与「第五届青训营 」伴学笔记创作活动的第 10 天。
跨端技术方案目标
Hybrid方案
基于webview渲染，通过JS Bridge把一部分系统能力开放给JS调用
WebViwe容器的工作原理是基于Web技术来实现界面和功能，通过将原生的接口封装、暴露给js调用，js编写的页面可以运行在系统自带的webview中。这样可以很快地实现页面跨端，同时保留了调用原生的能力，通过搭建桥接层和原生能力打通。但是，跨端的能力受限于桥接层，当调用之前没有的原生能力时，就需要增加桥。
原生渲染方案
使用js开发，通过中间层桥接后使用原生组件来渲染UI界面 原生组件：在安卓开发中使用Kotlin/java来编写视图；在IOS开发中使用Swift或Objective-C来编写视图。在React Native中，则使用React组件通过js来调用这些视图。运行时，React Native为这些组件创建相应的安卓和IOS视图。由于React Native组件就是对原生视图的封装，因此使用React Native编写的应用外观、感觉和性能与其他任何原生应用一样。将这些平台支持的组件称为原生组件。
- JSI：一个用C++写成的轻量级框架，其作用是通过JSI，JS对象可以直接C++对象引用，并调用对应方法。有了JSI，JS和Native可以直接通信。JSI是整个架构的核心和基石，所有的一切都是建立在它上面
- Fabric：是新的渲染系统，它将取代当前的UI Manager
- Turbo Modules:其基本上是对这些旧的Native模块的增强，所以JS代码可以仅在需要时才加载对应的模块，这样可以显著缩短RN应用的启动时间。
自渲染方案
利用Skia重新实现渲染管线，不依赖原生组件
小程序方案
使用小程序DSL+JS开发，通过中间层桥接后调用原生能力，使用webview来渲染UI界面
跨端技术方案对比
基于小程序跨端实践
- 下载小程序开发者工具
- 小程序开发、调试
- 小程序上传
性能优化意义
- 留住用户
- 提升转化率
- 提升用户体验
