ios - CSSでボックスシャドウアニメーションをハードウェアアクセラレーションする方法は?

Question

CSSでボックスシャドウをアニメーション化しています。Instrumentsプログラムを使用して、このアニメーションだけで iOS Safariの CPU の 35% を使用していることを発見しました! ページを実行したままにしておくと、iPhone がどんどん熱くなっていきます。アニメーションをコメントアウトすると、CPU 使用率が正常に戻ります。CPU に負担をかけないように、このアニメーションをハードウェア アクセラレーションするにはどうすればよいですか?

jsFiddle : http://jsfiddle.net/tokyotech/TutLh/

@-webkit-keyframes pulseGlow {
    0% {
        box-shadow: none;
    }
    10% {
        box-shadow: 0 0 1.4em rgba(255,0,0,1),
            0 0 1em rgba(255,0,0,1) inset;
        border-color: rgba(255,0,0,0.5);
    }
}

#recordButton {
    display: block;
    width: 5em;
    height: 5em;
    background: salmon;
    border-radius: 50%;
    -webkit-animation: pulseGlow 1s ease-in-out 1s infinite;
}