页面视图滚动上的颤动文本动画

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}

.shake {
  animation-name: shake;
  animation-duration: 0.5s;
  animation-timing-function: ease-in-out;
}

.shake {
  will-change: transform;
}

function adjustAnimation() {
  const devicePerformance = detectDevicePerformance(); // 自定义函数，检测设备性能
  if (devicePerformance === 'low') {
    // 降低动画复杂度或帧率
  }
}

function shakeAnimation() {
  // 动画逻辑
  requestAnimationFrame(shakeAnimation);
}
requestAnimationFrame(shakeAnimation);