React-Native webview 缓存

背景

活动页第一次加载过于缓慢，有些大的页面需要10s

分析

1.webview创建时间，经过实验基本可以忽略，不知道是不是react-native webview本身做了优化

2.html模版加载时间，加载本地spa页面，用时4s，加载服务器端的ssr页面，用时1s。分析，js生成dom耗费时间比较多。

3.对于服务器，第一次加载10s，第二次加载1s，猜测是下载html模版耗费时间比较多。webview本身会对静态资源做缓存。

结论

在服务端直接生成html模版，然后能走缓存的走缓存。react-native可以预先用webview把需要加载的活动页先下拉到本地，这样第二次加载会快很多。比如在didmount阶段来获取活动页配置然后创建webview先加载一波。图片资源使用base64编码，也能利用上webview的缓存。

把html直接放在rn项目里也是种方案，但是活动页每次发布rn也需要重新发布。

componentDidMount 
const preload = <WebView
        style={{ width: 0, height: 0 }}
        startInLoadingState={true}
        javaScriptEnabled={true}
        src='...'
/>