为什么（似乎）不相关的div重新绘制在Chrome中？

Question

有人可以帮我理解为什么在LEFT上滚动容器时RIGHT上的滚动容器会被重新绘制？

以下是说明问题的gif：

请注意，右侧图层当前在图层面板中突出显示，并且在我向左滚动时正在重新绘制它。 这说明了我在一个更大的html中遇到的问题 - 更新图层树和组合成为主要瓶颈。

布局非常简单，请参阅jsfiddle。有两个绝对定位的div，每个内部都有一个带有一些内容的滚动div。

在Mac 10.10.5上测试Chrome 59.0.3071.115（官方版本）（64位），在Mac上测试Chrome 61.0.3159.0（官方版本）（64位）。

<div class="left panel">
  <div class="inner inside-left">
    <p>asdad</p><p>asdad</p>
  </div>
</div>

<div class="right panel">
  <div class="inner inside-right">
    <p>asdad</p><p>asdad</p>
  </div>
</div>