故事背景：
昨天工作的时候遇到一个有意思的bug，在 Windows10 Chrome V70.x浏览器上，项目使用的是 Vue，在一个同事的电脑上出现了这样一幕，一个表格(Table)中有一个 添加按钮 ，点击添加一行数据，数据渲染在表格中，有不同的控件组成，下拉，输入框，复选框等。
然而，在添加到一定数量后，表格及页面中的一部分UI，不见了
在远程查看调试的过程中，发现当超过一定数量后，页面会出现滚动条，此时就会出现页面部分白屏，最开始我以为是不是报错了，然后检查了控制台，发现没有报错，又检查了DOM渲染的节点，发现DOM节点是存在的，但是没有渲染到浏览器上，在找到某个节点后，随便改变一个样式，页面又能渲染出来，到这里我有想到是不是跟浏览器渲染有关，但是也没有遇到过这样的问题啊，没思路！
随后我又重新编译了代码，并加上了打印添加节点的数据，即 data 的值，也是正常的。期间也排除了是不是浏览器插件或者滚动条引起的问题，剩下就在纠结是不是浏览器版本或者Vue的bug，在网上一顿搜索，无解
随后问了一个同事有没遇到过这样的问题，他说了一个回答 transform:translateZ(0)，这个不是3D动画的时候用的吗，我之前也用来解决过防止抖动的问题，但这个跟页面不渲染有啥关系，然后我又在网上搜索一通，说 translate3D 是会开启GPU的硬件加速，存在 translateX 属性的节点会是单独的一个渲染层，因此不会导致整个页面的回流和重绘，也就减小了浏览器计算压力
抱着试一试的态度去调试后，发现居然能解决这个问题！TMD 难道真的是渲染阻塞了吗