Chrome的渲染時間，事件響應時間太差

Chrome的渲染時間和事件響應時間太糟糕。Chrome的渲染時間，事件響應時間太差

我創建其中包含約5000樣本HTML - 10,000行和這裏的結果：

5000行，它需要FireFox的5S渲染，它需要的Chrome 11S渲染。 10000行，它需要火狐787-8渲染，它需要的Chrome3.5分鐘渲染

我也可通過以下腳本測試：

$(window).load(function() { 
    $("div.click-test").click(function() { 
     $(this).text("clicked"); 
    }); 
});

5000行，在Firefox中，事件的點擊響應在中間，但在Chrome中，它在大約3秒後響應。在Chrome中有10,000行，我無法耐心等待回覆

有人能幫助我重組我的html以使Chrome渲染時間更好嗎？

PS：你可以在這裏下載我的樣本http://www.mediafire.com/?x2h0nsldo90m642。感謝您的任何提前

來源

2012-11-02 user929794

1,000行或10,000行用於* long *渲染？ – bouke

如何使用[fiddle]（http://jsfiddle.net/）或甚至[jsperf]（http://jsperf.com/） – Bruno

$(window).load(function() { 
    // On every single element, add a click handler. 
    $("div.click-test").click(function() { 
     $(this).text("clicked"); 
    }); 
});

你在每一個元素添加不同的事件處理程序。改用事件委派。它允許你有一個一個事件處理程序來照顧你所有的元素。

$('body').on('click', '.click-test', function() { 
    $(this).text('clicked'); 
});

此外，避免像div.click-test這樣的緩慢選擇器。 .click-test速度更快。

來源

2012-11-02 10:26:57

的示例謝謝。你的經驗非常有用。但是響應時間是0.5s（Firefox）-3s（Chrome）。 Chrome的這個問題？ – user929794

@ user929794如果對於相同的代碼，一個更慢，這是一個Chrome的問題:)我很驚訝這是如此緩慢，但5K行。 –

Chrome的渲染時間，事件響應時間太差

回答

相關問題