哪個更好：Jquery.animate（）或setTimeout的

可能重複CSS轉換：
Is it better to use jQuery fadeIn or CSS3 animations?
what’s faster? CSS3 transitions or jQuery animations?哪個更好：Jquery.animate（）或setTimeout的

我試圖做一個動畫和速度的本質。我已經嘗試過兩種方法，但是我想知道哪一種更有效。

方法1：使用Jquery.animate（）我的代碼看起來是這樣的：

$("div").animate({opacity: "show"}, 100, "linear", function() { 
    console.log("Animation Complete"); 
});

方法2：使用CSS過渡用的setTimeout：這是代碼的樣子：

$("div").addClass("hidden") //On Page load

然後動畫淡入：

setTimeout(function() { 
    $("div").removeClass('hidden'); 
}, 100);

隱藏有以下樣式屬性：

.hidden { opacity: 0 !important; }

工作都相當好，但我想知道哪一個更有效的/更好。

來源

2013-01-22 Charles Birdman Desouza

動畫方法可能更易於維護（所有代碼均位於同一位置），但在低功耗環境（移動/平板電腦）中，轉換可能會提供更好的性能。 –

不要使用'！important'。讓你的選擇更強。 – gilly3

不幸的是我不能自己添加答案，因爲這個問題已經關閉，但經過深入分析，動畫方法更好。爲什麼？那麼爲了真正理解這一點，我們需要記住Javascript在單線程上運行。當調用setTimeout時，即使在100 ms的時間內，它也會阻塞該線程，因爲每納秒的效率非常重要。動畫方法（通過檢查jquery源代碼）是通過使用「ticker」來實現的，ticker基本上是一個計數器，用於檢查激活時間與當前日期之間的差異。 –