这是我参与「第五届青训营 」伴学笔记创作活动的第 9 天
科技在发展，时代在进步。电子设备种类变多，产品业务也逐渐变多，进而产生了许许多多的“端”。PC端有Mac、Windows端，移动端有iOS、安卓，还有类似手表、车载设备等奇奇怪怪的端。
跨端是什么
上面说到业务线变多，这就产生了很多问题：
- 不同端功能基本一致，但需专人负责
- 开发及维护成本高
- 安卓、iOS发版周期长
- 。。。
而跨端技术的目的也很明确：
- 高研发/学习效率
- 好的用户体验
- 动态化（扩展性？）
跨端技术方案
hybrid方案（webview + webview JS thread）
基于浏览器(webview)，通过js(js bridge)调用一部分系统。
原生渲染方案（原生组件 + JS Engine）
js开发，中间层桥接后使用原生组件渲染UI界面。 比如React Native，使用js和react来开发移动应用。
react -> js -> fabric(UI), turbo modules(逻辑) -> native
自渲染方案（Skia + Dart VM）
使用Skia重新渲染管线，不依赖原生组件，更自由。 比如Flutter，google发布的框架，一套代码构建原生平台编译的多平台应用。
framework -> engine -> embedder
小程序方案（webview, 原生组件 + JS Engine）
使用小程序DSL+js开发，通过中间层桥接调用原生能力，使用webview渲染UI。 比如字节小程序，在宿主（包括抖音，头条等app）使用、传播。
渲染层webview + 逻辑层jsc -> native <--> 第三方服务器
能做的事情不多，比如DOM会在jsc中调用，开发者并不能直接操作DOM。
综合情况小程序会更好，除了性能相对较差以外。实际应用中会综合考虑使用场景，合理选择技术方案。
小程序的实践
快速开发一个小程序
- 开发者工具
- 小程序开发、调试
- 上传小程序
性能优化
意义
- 留住用户
- 提升转化率
- 提升用户体验
就是让用户愿意使用你的小程序～
性能指标
loading -> FP(first paint) -> LCP(largest content paint)
平台指标看板中的数据，比如错误日志、自定义分析、性能体验（加载耗时、卡死占比、取消率……）根据情况进行优化。
比较大抽象的部分可以分为启动性能和运行时性能优化。
