剖析RN与小程序的底层实现
基于react框架(虚拟dom)
基于JSCore实现js与java/oc交互
优势
劣势
页面渲染 1.在渲染层,宿主环境会把WXML可以先转成JS对象,然后再渲染出真正的Dom树。 2.在逻辑层发生数据变更的时候,需要通过宿主环境提供的setData方法把数据从逻辑层传递到渲染层 3.对比前后差异,把差异应用在原来的Dom树上,渲染出正确的UI界面
组件系统 Exparser组件框架+原生组件 原生组件渲染时 1.渲染层webview创建组件,插入到DOM树中后计算布局(位置与宽高) 2.通过通信机制通知Native,Native会根据布局插入一块原生区域并渲染 3.当webview得知位置或宽高发生变化时,通知Native做相应的调整
视图层<->客户端(大部分原生组件涉及)
逻辑层<->客户端
优势:渲染层和逻辑层分离->渲染快、加载快 劣势:线程通信延时,setData没有diff操作,频繁操作会有明显性能问题
渲染