檢查系統是否能順利顯示JS效果

我想知道是否有簡單的方法在瀏覽器上實現快速基準測試的渲染速度？檢查系統是否能順利顯示JS效果

很高興有漂亮的動畫效果，但只有當機器可以處理它。有了SVG和所有的效果，jQuery爲大衆提供了可視化顯示大量數據和動畫的可能性。然而，沒有簡單的方法（我可以找到）來檢查用戶代理是否應該交付數據的'浮動動畫svg'，'靜態svg'或'表格'版本。

謝謝

來源

2011-06-03 nak

我知道這樣做的唯一方法就是實際運行一個代表性的動畫並測量其速度，要麼是及時渲染x幀，要麼是每個固定時間的總幀數。 jQuery和YUI中的動畫庫根據呈現每幀的速度調整渲染幀的數量。你可以看看他們是如何做到這一點，以獲得一些想法如何衡量這一點，或者如果你正在使用這些庫中的一個，你甚至可以在動畫之後從中獲取信息。

您可以運行此測試動畫，然後對結果進行cookie，然後只在您未找到cookie時重新運行測試動畫。或者，您可以在應用程序的正常過程中運行所需的動畫，但要測量它的運行效果，以及它是否太慢或不穩定，那麼下次需要更快地使用cookie。

來源

2011-06-27 02:05:46 jfriend00

到目前爲止最好的答案是，我將查看jQuery，並嘗試查找您所說的代碼。太棒了！ – nak 2011-06-27 15:46:35

嘗試使用Firebug中的Net選項卡。只需加載想要測試的頁面，打開Firebug，點擊網絡標籤中的向下箭頭，然後選擇啓用，然後刷新頁面。您可以獲得頁面上每個元素加載時間的漂亮圖形。

來源

2011-06-03 18:23:26 PHLAK

謝謝，我是新來的螢火蟲，所以這有助於此，但這仍然不是一個解決方案。我只知道我的電腦如何加載某些元素。真的很整潔，但試過了！ – nak 2011-06-03 18:44:50

我用Enhance.js前

做到這一點看看加載CSS和JS的例子專爲屏幕和移動設備

enhance({ 
     loadStyles: [ 
       {media: 'screen', excludemedia: 'screen and (max-device-width: 480px)', href: 'css/screen.css'}, 
       {media: 'screen and (max-device-width: 480px)', href: 'css/handheld.css'} 
     ], 
     loadScripts: [ 
       {media: 'screen', excludemedia: 'screen and (max-device-width: 480px)', src: 'js/screen.js'}, 
       {media: 'screen and (max-device-width: 480px)', src: 'js/handheld.js'} 
     ]  
});

Enhance.js也有其他類型的檢查，你也可以添加或自定義的檢查，如果有必要

在Filament Group page，還有更多關於它

來源

2011-06-03 19:49:46 Andre

檢查系統是否能順利顯示JS效果

回答

相關問題