css - CSS3 动画会造成内存泄漏吗？

Question

http://jsfiddle.net/q5yncg61/

.vertical-line {
/*	will-change: transform; */
	stroke-dasharray: 2;
	-webkit-animation: dash 25s infinite linear;
	animation: dash 18s infinite linear;
	stroke-width: 2px;
}
.firstCircle {
  fill: #333333;
  stroke-width: 3px;
  stroke-color: #979797;
  transform: scale(1);
  transform-origin: center center;
  animation: pulse 5s linear infinite;
  animation-duration: 3s;
  animation-iteration-count: infinite;
}
.secondCircle {
  animation-delay: 2s;
}
@keyframes dash {
  from {
    stroke-dashoffset: 100;
  }
}
@keyframes pulse {
  0% {
    transform: scale(0.75);
    opacity: 1;
  }
  50% {
    transform: scale(1);
    opacity: 0.5;
  }
  100% {
    transform: scale(1.5);
    opacity: 0;
  }
}

<svg viewBox="0 0 100 179" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <g class="draw" stroke="black" stroke-width="5" fill="none" fill-rule="evenodd" stroke-linecap="square">
      <line x1="50%" y1="0%" x2="50%" y2="100%" id="vertical-line" stroke="#979797" stroke-width="0.5"></line>

  <circle class="firstCircle" stroke="#555555" stroke-width="5" r="25" cx="50" cy="50" fill="#777777"></circle>
  <circle class="secondCircle" stroke="#999999" r="25" cx="50" cy="50" fill="#999999"></circle>

    </g>
</svg>

在我的本地，它运行的是 jsfiddle 示例的稍微复杂的版本，但相同的元素重复了 5 次，而不是在循环中。在 Safari 上，风扇以惊人的速度运行后，我一直遇到内存问题。这是从 GPU 而不是 CPU 渲染的问题吗？这是内存泄漏问题吗？

如果不是，是否有任何可能导致问题的想法？我已经确认是 svg 导致了性能下降，因为我已经删除了它并且页面加载正常。任何见解都值得赞赏。

Answer 1

当然，CSS 的“转换”至少会在 Chrome 上导致明显的内存泄漏。