移动端滑动卡顿问题

-webkit-overflow-scrolling: touch

IOS 端特属属性，手指离开屏幕会保持滚动一段距离，继续滚动的速度和持续的时间和滚动手势的强烈程度成正比。

overflow: scroll; //该属性随着手指离开立即停止

-webkit-overflow-scrolling: touch;//该属性随着手指离开还会保持滚动

-webkit-transform: translateZ(0px);

面绘制的过程分为三个部分：layout、paint和合成。layout负责计算DOM元素的布局关系，paint 负责将 DOM 元素绘制成位图，合成则负责将位图发送给 GPU 绘制到屏幕上。 
当某个 DOM 元素开启硬件加速之后，浏览器会为此元素单独创建一个“层”。当有单独的层之后，此元素的repaint操作将只需要更新自己，不用影响到别人。 
能够单独提升层的 css 属性有

根元素

* position：absolute/relative ，+z-index(不为auto）

* display: flex|inline-flex +z-index(不为auto）

* position: fixed * transform 不为 "none"

* -webkit-overflow-scrolling：touch

* opacity属性值小于 1 的元素

* mix-blend-mode属性值不为 "normal"的元素

* filter值不为“none”的元素

* perspective值不为“none”的元素

* isolation 属性被设置为 "isolate"的元素

* will-change