與Firefox和IE相比，Chrome令人難以置信

Question

我正在開發一個網絡瀏覽器游戲，隨着我的進步，我在動畫過程中發現很多FPS下降-特別是在Chrome中可拖動。 我擔心不得不重寫它，並且它變得越來越沉重，但是當我在Firefox甚至IE11中運行該應用程序時，它運行得盡可能流暢，沒有任何明顯的延遲！

我不敢相信Chrome無法處理這種類型的渲染，是否有可能我在控制台中打開了某些東西，使chrome變得遲鈍？ 一些記錄等？

該應用程序使用了安靜的許多不透明度，文本和框陰影等。

謝謝

狐狸

-配置文件更新-

所以這是發生了什么

用戶打開庫存時

_theatre('sub', '.character-panel', 1);
$('.character-panel').show()
_loadInventory();
_loadPlayerStats();
_loadEquipment();

我認為有一個問題是_theatre（）函數。 它的作用是創建不透明度為0.8的整頁固定div。

function _theatre(t, e, a){

if(a == 1){

    window.paused = 1;

    $('html').css('overflow', 'hidden');

    $(e).wrap('<div class="theatre-' + t + '"></div>');

}
else{

    window.paused = 0;

    $('html').css('overflow', 'auto');

    $(e).unwrap('<div class="theatre-' + t + '"></div>');

}

}

如果我將_theatre（）函數注釋掉，則拖動會更加平滑。

我嘗試從div移除不透明度，但是沒有更好的結果。 這是怎么回事？ ：/

div.theatre-sub {top:0; left:0; right:0; bottom:0; position:fixed; z-index:9996; background-color:rgba(0,0,0,0.8)}
div.theatre-dom {top:0; left:0; right:0; bottom:0; position:fixed; z-index:9998; background-color:rgba(0,0,0,0.8)}

探查器數據http://imageshack.com/a/img819/8601/jbf2.png

Answer 1

不知道具體是什么問題，我建議您開始使用console.profile()測試代碼的性能。 這應該有助於查明問題。

例如：

console.profile("Profile One");

function yourCode()
{
   // some code
}

console.profileEnd("Profile One");

DEMO：

http://jsfiddle.net/NMbG4/5/

與此類似，您也可以使用相同格式的console.time()來跟蹤函數花費的時間（以毫秒為單位）。