重度使用Flutter研发模式下的页面性能优化实践

摘要

淘宝特价版是集团内应用Flutter技术场景比较多，且用户量一亿人以上的应用了。目前我们首页、详情、店铺、我的，看看短视频，及评价，设置等二级页面都在用Flutter技术搭建。

我们发现使用Flutter经常会遇到性能问题。因为Flutter严格意义上仅是一种“UI渲染框架”，它通过异步来来实现子线程渲染UI，并且通过Skia保证两端“渲染的一致性”。但子线程执行并渲染，且动态库打包这些策略并非“一片通吃”，会导致损耗页面打开性能及可交互时长的增加。试想，app启动时动态库加载的dynamic binding（影响启动时长），页面启动时主线程启动了页面，但ui渲染却需要等待Flutter的子线程执行并渲染，低端机上页面会短暂白屏（页面未渲染影响可交互时长，虽然fps欺骗性的提高了）。

Flutter有性能瓶颈，但重度使用Flutter研发的我们是如何做到性能优化的？