问任何一个大前端方向的同学，他应该都能说出自己所用的技术是如何搭建UI的。比如Android同学可能会说是用View树、Flutter同学说是用Widget树，大家对此应该都习以为常了，但是大家可否有想过为什么UI一定要用树状结构去表示，而不是用其他结构，比如链表或者图。其实越是习以为常的现象背后，越往往蕴含着某种深刻的真理。我们只有真正弄明白UI的树状结构，才能理解UI的绘制流程以及事件分发机制，因为二者都以前者为基础。
什么是UI
UI全称User Interface，是人机交互的界面。一方面要向用户展示机器内部的状态，一方面还需要接收用户的输入，包括触摸、按键、语音等各种方式的输入。我们这里只讨论狭义方面的UI，也就是屏幕显示的内容。而显示内容的目的，是让用户更简单方便有趣的接收信息。那人脑是如何处理视觉信息的呢？
分层抽象的人类视觉系统
人类视觉系统是这个世界上最为神奇的一个系统。科学家研究表明，视觉系统的信息处理在可视皮层是分级的，大脑的工作过程是一个不断迭代、不断抽象的过程。原始的像素信息首先经过一层处理，得到边缘和方向特征信息，然后再经过一层得到轮廓和形状特征信息，这样经过一层层的抽象从而得到事物的精细分类。这里面有两个关键词就是：分层和抽象。人类逻辑思维的一大特征就是经常使用高度抽象的概念。
树状结构就是从抽象到细节
表达信息与识别信息是两个相反的过程。识别信息是从细节到抽象，而表达信息是从抽象到细节。而树状结构天然就是从抽象到细节。所以用树状结构来表示UI就再合适不过了。
