2010-10-21 57 views
1

我一直在使用jQuery插件的數據表(http://www.datatables.net)進行搜索,排序和分頁客戶端上的表格數據被上分頁大型數據集。實現的簡單性和流暢的用戶體驗是一個巨大的勝利。搜索,分類和客戶

現在我有一個要求在一個更大的數據集上實現相同的功能(搜索,排序,分頁),max 1000記錄。我希望爲此使用相同的插件,但是當表中記錄的數量增加時,DataTables的性能似乎急劇下降。在IE8上,500 tr s表已導致「此頁面上的腳本運行緩慢」警報。

因爲數據集是不是那麼大的,我非常希望如果可能的話在客戶端上這樣做。

有沒有什麼辦法通過改變呈現的標記來提高DataTables插件的性能,禁用某些功能,以JSON形式提供數據而不是HTML,或者以其他方式配置它以實現1000個客戶端記錄的合理性能瀏覽器(IE7 +,FF2 +,Chrome)。

備選地,是否有任何其他JavaScript庫,優選的jQuery,這可能提供類似的功能?

+0

在谷歌可視化API有數據表支持,雖然我不是確定你的1000條記錄要求。應該很容易測試。 – Sharun 2010-10-21 13:14:04

+0

Klerk - 似乎Google可視化API表格不支持在表格上進行搜索。否則它看起來不錯,我肯定會考慮將來的項目。 – jevakallio 2010-10-22 13:58:09

回答

0

此被固定在最近的數據表的版本(v1.7.5 +)。作者將排序實現更改爲不使用eval或$ .inArray()。

直接下載鏈接:http://datatables.net/download/build/jquery.dataTables.nightly.js

從更改日誌中: 性能:重新編寫的排序實現,因此它不使用$ .inArray任的eval()()。 inArray被發現對IE有嚴重的負面影響,它會計算出'腳本運行緩慢'的錯誤信息 - 新的實現使用值/鍵反向映射使查找速度與單個對象參數回覆一樣快。

抓住構建具有以下信息(或更高版本) 每晚:1.7.5.dev 28日2010年11月,14:42下載下載分鐘注意事項

+0

感謝您的領導!我已經將此網站部署到關閉的排序中,但似乎最新版本確實提高了性能。將DataTable更新到最新版本後,會考慮將其打開。 – jevakallio 2010-12-13 15:08:00

+0

太好了 - 祝你好運! – DarrellNorton 2010-12-13 17:52:29

0

我更喜歡flexigrid的:

http://www.flexigrid.info/

記錄的數量是沒有問題的,因爲它是實現的每一頁。所以我們一次不管理1000條記錄。

+0

似乎FlexiGrid會支持所有我會尋找的功能(功能列表引用了搜索作爲新功能之一),但似乎沒有任何地方記錄在案!多可惜。 – jevakallio 2010-10-22 14:00:01

1

經過進一步的性能測試,事實證明,排序導致性能問題。 jQuery DataTables不僅可以在IE6上對多達3000條記錄進行分頁和搜索,而且還可以在最新版本的瀏覽器上進行搜索。

所有你需要做的是與"bSort":false初始化數據表,它會把它像一個冠軍。