2012-07-22 80 views
1

我從數據庫中拉出數百行並創建一個JSON對象,然後通過jQuery進行渲染。但我目前正在渲染所有減緩頁面加載速度的數據對象。在即時渲染JSON塊的最佳方式是什麼?另外,當用戶滾動渲染的顯示時,添加和刪除渲染的chunck是否有意義?以大塊渲染JSON對象?

+0

一定要檢查slickgrid:https://github.com/mleibman/SlickGrid/ – pb2q 2012-07-22 20:35:33

+0

1)他們是什麼樣的塊?它是一個對象數組嗎?還是它深深地嵌套在一起,你必須通過編程來深入研究,而不僅僅是一兩個循環? 2)你如何渲染?你只是增加'「

  • + object.title +
  • 」'或者我們在談論更詳細的東西?兩個快速的半答案:a)問題的答案最終是通過使用deference(認爲'setTimeout'具有大量數據) - 這是一個「如何」的問題b)刪除是可以的,但可以慢於if你做錯了... – Norguard 2012-07-22 20:38:16

    回答

    0

    通常,當您創建並添加大量DOM節點時,應該使用文檔片段document.createDocumentFragment)。如果您避免在每個數據元素上重排,而是將其中的20個包裝在一個片段中,並通過一次操作將其插入到主DOM中,那麼您的代碼可能會從此得到a significant performance gain

    不知道細節,「懶插入」數據似乎是一個好主意。您應該解析您的JSON對象並將其保存在數組中,然後監視滾動位置(use a timer to avoid event overkill),並根據需要插入數組中的更多元素。我想我會盡量不刪除它們,但保留你(昂貴)插入的東西。

    除此之外,請提供一些更詳細的信息:如何渲染和插入元素,它們的標記有多複雜?

    +0

    偉大的建議!我實際上有兩個JSON對象已經從一個DB返回,一個是「類別」,另一個是「項目」。我希望能夠以幾種方式對數據進行排序和顯示,這似乎是最好的方法。目前,我正在遍歷每個類別,然後遞歸遍歷這些項目以查找匹配並呈現它們。 (其他顯示方式按字母順序排列,按項目子類型分類(有更好的方法可以提供任何建議嗎?)無論如何,按類別渲染需要很長時間。 – 2012-07-22 21:28:33

    +0

    「數百行」聽不到當你說「按類別渲染」時,你的意思是「過濾數據,對它進行排序並將其插入到DOM中」?只要你不觸摸DOM,過濾/排序不應該花太長時間。當你有你的數據時,將它插入到塊中,請顯示示例數據和過濾器/呈現代碼 – Wolfram 2012-07-22 21:41:28

    +0

    感謝您提供了很好的反饋,以下是我的意思是通過呈現一個類別 - 首先查詢「Categories」表並返回所有活動行。查詢「Items」表並返回所有行。最後,循環查找類別數據並查找項目中的匹配項,以便像這樣顯示... Category 1:item,item item Category-2:item,item等。百個類別和幾百個項目意味着巨大的嵌套循環需要很長時間才能在客戶端執行。尋找更好的方法。 – 2012-07-25 14:29:46