Laggy transform：在 Android 上翻译，在 iOS 上流畅答案

【问题标题】：Laggy transform: translate on Android, smooth on iOSLaggy transform：在 Android 上翻译，在 iOS 上流畅
【发布时间】：2018-04-15 02:55:14
【问题描述】：

我有一个可以左右拖动的卡片元素。当你这样做时，transform: translate CSS 属性被设置。

这在 iPhone 7 上非常流畅，但在三星 Galaxy S8 上却滞后。考虑到这两款手机都是高端手机，我认为性能会很棒。

我正在为水平拖动“卡片”设置动画。然而，它在三星 Galaxy S8 上是滞后的，但在 iPhone 7 上却超级流畅。这是为什么呢？

这是执行此操作的实际代码：

this.card.nativeElement.style.setProperty('transform', 'translate(' + translateX + 'px)');

【问题讨论】：

【解决方案1】：

在被移动的元素上应用我以前不知道的 CSS 属性 will-change: transform; 就可以了。

【讨论】：