d3.js - 高速遷移のためのD3.jsSVGドロップシャドウ

Question

高速遷移のためにドロップシャドウを実行するための最良の方法は何ですか？以下のコードでフィルターを使用してみましたが、トランジションが途切れ途切れになっているようです（おそらく、20個ほどの長方形が動き回っています）。

var shadow = vis.append("defs").append("filter")
    .attr("id","dropshadow")
    .attr("height","130%");

shadow.append("feGaussianBlur")
    .attr("in","SourceAlpha")
    .attr("stdDeviation","3");

shadow.append("feOffset")
    .attr("dx","2")
    .attr("dy","2")
    .attr("result","offsetblur");

最新のブラウザ用のクロスブラウザCSSドロップシャドウはありますか？（ie9 +、chrome、firefox ...他の人をサポートする必要はありません）

このタイプのシャドウでトランジションを高速化する方法はありますか？

別の方法はありますか？その後ろに別の長方形を描くだけでいいですか？