飞猪上的doraemon一直对过度绘制和布局深度有监控，不合理的布局和过深得过度绘制影响页面渲染速度。虽然发现了不少问题，多处可见如下图的红红的页面，但是一直很难推动解决，主要有两个原因。
让开发找到具体的位置需要从根布局一层层遍历分析下去，确实麻烦，所以不想改；
修改后，会不会影响到其他控件的显示效果，光靠大脑想象难保万全，所以不敢改；
<a></a>
感谢@睿牧提供的外部开源参考工具
于是doraemon里就多了一样新的工具，将当前页面的布局3d化，有点像xcode上的view ui hierarchy工具，如下图所示。新工具可以辅助分析页面布局的合理性和影响过度绘制的关键点：
在3d化的页面上将每个有名字的控件的名字（id）都写上了，便于直接看出是哪个控件（或者控件的爸爸）导致问题，以便快速定位到具体的控件；
在3d化的页面上通过拖拽和多点触摸放大来直观的看出每一个控件在整体布局里所处的位置，和对相关控件的影响，便于下结论能不能改；
按照上面的打开方式，然后进入门票首页，再点击“3d”icon，可以看到如下图。可以看到所有控件的背景色都被涂上了标识过度绘制深度的颜色。
从最外层布局向内看，导致背景色突变的控件是设置了背景色，如下图标记。其中5和6的背景色变化是因为加载了图片，这种情况可以不修改。我们主要看下1、2、3、4这4个地方。
如下代码，在根布局里刷了一次全屏的白色。不合理性：标题栏本身也是白色，所在标题栏的像素区域内，根布局的全屏白色是多余的。
整个页面的布局可以看成是上面一个标题栏，下面一个列表控件（listview），代码中为这个列表控件再一次刷了白色，如下代码所示：
list的cell单元代码中再次刷了个白色底色，很显然这是多余的
又一个list的cell单元这里也刷了个白色底色，很显然这也是多余的，前面的e6透明度更是多此一举。
去掉根布局的白色底色，保留listview的白色底色
去掉listview中的cell的白色底色
过度绘制数值由原先的4.04降低到2.63，提升53.6%。下图是初步优化前后颜色对比。
如下黄色箭头指向的位置，4个图片控件（imageview）并排放着，用了3层布局，对此表示质疑。
3d布局工具结合过渡绘制开关可以有效地提升定位过度绘制问题，此外还容易发现多余的不合理的布局，以提升native的性能体验。
下面是源码，欢迎讨论共建。