loading.io生成的SVG背景动画在Firefox浏览器CPU占用过高问题咨询

我使用SVG背景生成工具制作了动画SVG背景，此前了解到background-position这类动画会大幅消耗CPU，而使用translate属性则可以调用GPU算力降低负载。

但我无法理解当前SVG的异常表现：该背景会让我的Firefox浏览器CPU占用从3%升至28%，而Chrome浏览器表现正常，CPU占用仅上升1%。我暂无条件测试Safari，使用Mac设备的用户可反馈相关测试结果。

<!-- CIRCLE SPOTLIGHT SVG - START -->
<?xml version="1.0" encoding="utf-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="margin: auto; background: rgb(255, 255, 255); display: block; z-index: 1; position: relative; shape-rendering: auto;" width="2480" height="1440" preserveAspectRatio="xMidYMid" viewBox="0 0 2480 1440">
<g transform="translate(1240,720) scale(1,1) translate(-1240,-720)"><defs>

<radialGradient id="ldbk-r9105pcf9r" r="1" cx="0.46" cy="0.5" fx="0.54" fy="0.5" fr="0">
  <animate attributeName="fy" repeatCount="indefinite" dur="4.761904761904762s" keyTimes="0;0.5;1" values="0.32;0.6799999999999999;0.32" keySplines="0.5 0 0.5 1;0.5 0 0.5 1" calcMode="spline"></animate>
  <animate attributeName="cy" repeatCount="indefinite" dur="7.142857142857143s" keyTimes="0;0.5;1" values="0.6799999999999999;0.32;0.6799999999999999" keySplines="0.5 0 0.5 1;0.5 0 0.5 1" calcMode="spline"></animate>
  <stop stop-color="#cac2ea" offset="0%"></stop>
  <stop stop-color="#7462bb" offset="33%"></stop>
  <stop stop-color="#221b41" offset="66%"></stop>
  <stop stop-color="#6147c6" offset="100%"></stop>
</radialGradient>

</defs>
<g transform="translate(1240 720)">
<circle cx="0" cy="0" r="1433.8758663147937" fill="url(#ldbk-r9105pcf9r)">
<animateTransform attributeName="transform" type="rotate" dur="14.285714285714286s" keyTimes="0;1" values="0;360" repeatCount="indefinite"></animateTransform>
</circle>
</g></g>
</svg>
<!-- CIRCLE SPOTLIGHT SVG - END -->

内容的提问来源于stack exchange，提问作者Keviin Cosmos