"我的"TabBar的实现中，Tab是父widget，TabItem是子widget，在原来的实现中，Tab是StatefulWidget，TabItem是StatelessWidget。
然后看到了一篇文章：
[链接] https://lizhaoxuan.github.io/2019/01/02/Flutter-你还在滥用StatefulWidget吗
文章给了我一个优化的方向，StatefulWidget尽量出现在widget tree的叶子节点，这样能使state变化带来的影响降到最小，因为StatefulWiget状态改变会导致子widget都重建，滥用的话不仅会导致对象冗余创建，也有可能会导致卡顿。
反观Tabar原来的实现，可以用下图表示，Root是StatefulWidget，Leaf是StatelessWidget，这样导致的问题是，每次选中一个tab，改变的都是Root中的state，然后导致整个widget tree都要重建，但实际上选中tab只有两个tab会发生变化，其他tab的重建是多余的，不过这里的tree很小，卡顿什么的一般不存在。
image
基于上面的观点，我把原来的结构反过来，Root变成StatelessWidget，Leaf为StatelessWidget，但是这样有存在另一个问题，在上一份日报有写过，就是tab之间的状态是互斥的，需要父widget来保持互斥，所以在Leaf管理state不太可能，我的做法是把state交给Root去控制：
//Leaf
class MineTabItemState extends State<StatefulWidget> {
...
bool _selected = false;
//控制状态
void setSelected(bool selected) => setState(() {
_selected = selected;
});
...
}
//Root
class MineTab extends StatelessWidget {
...
void setSelected(MineTabItem tab) {
...
//父widget控制state
if (selected != -1) tabs[selected].state.setSelected(false);
tabs[index].state.setSelected(true);
...
}
...
}
修改前每次点击tab，全部重建：
image.png
修改后只重建两个：
image.png
TabBar的widget tree都很小，优不优化区别也不明显，为了实践我强行优化了一下。
