我從數據庫中拉出數百行並創建一個JSON對象,然後通過jQuery進行渲染。但我目前正在渲染所有減緩頁面加載速度的數據對象。在即時渲染JSON塊的最佳方式是什麼?另外,當用戶滾動渲染的顯示時,添加和刪除渲染的chunck是否有意義?以大塊渲染JSON對象?
回答
通常,當您創建並添加大量DOM節點時,應該使用文檔片段(document.createDocumentFragment
)。如果您避免在每個數據元素上重排,而是將其中的20個包裝在一個片段中,並通過一次操作將其插入到主DOM中,那麼您的代碼可能會從此得到a significant performance gain。
不知道細節,「懶插入」數據似乎是一個好主意。您應該解析您的JSON對象並將其保存在數組中,然後監視滾動位置(use a timer to avoid event overkill),並根據需要插入數組中的更多元素。我想我會盡量不刪除它們,但保留你(昂貴)插入的東西。
除此之外,請提供一些更詳細的信息:如何渲染和插入元素,它們的標記有多複雜?
偉大的建議!我實際上有兩個JSON對象已經從一個DB返回,一個是「類別」,另一個是「項目」。我希望能夠以幾種方式對數據進行排序和顯示,這似乎是最好的方法。目前,我正在遍歷每個類別,然後遞歸遍歷這些項目以查找匹配並呈現它們。 (其他顯示方式按字母順序排列,按項目子類型分類(有更好的方法可以提供任何建議嗎?)無論如何,按類別渲染需要很長時間。 – 2012-07-22 21:28:33
「數百行」聽不到當你說「按類別渲染」時,你的意思是「過濾數據,對它進行排序並將其插入到DOM中」?只要你不觸摸DOM,過濾/排序不應該花太長時間。當你有你的數據時,將它插入到塊中,請顯示示例數據和過濾器/呈現代碼 – Wolfram 2012-07-22 21:41:28
感謝您提供了很好的反饋,以下是我的意思是通過呈現一個類別 - 首先查詢「Categories」表並返回所有活動行。查詢「Items」表並返回所有行。最後,循環查找類別數據並查找項目中的匹配項,以便像這樣顯示... Category 1:item,item item Category-2:item,item等。百個類別和幾百個項目意味着巨大的嵌套循環需要很長時間才能在客戶端執行。尋找更好的方法。 – 2012-07-25 14:29:46
- 1. Javascript - 大量渲染對象
- 2. 將jinja2塊渲染爲json
- 3. 渲染JSON對象轉換成HTML,渲染功能不會使深對象
- 4. 軌道對象關係&JSON渲染
- 5. Rails的渲染問題與JSON對象
- 6. 渲染JSON用於多個Rails對象
- 7. Rails對象關係和JSON渲染
- 8. 禁用對象的JSON渲染
- 9. 渲染軌對象
- 10. 對象不渲染
- 11. 從Json對象渲染AngularJS中的HighCharts對象
- 12. JavaScript渲染塊
- 13. JSRender不渲染對象
- 14. JsRender如何渲染對象
- 15. glsl fragmentshader渲染對象ID
- 16. 導出對象渲染opengl
- 17. ReactJS:渲染多個對象
- 18. 渲染與另一對象
- 19. 未渲染的3D對象
- 20. AngularJS中的「渲染」對象
- 21. SWF(flash)對象渲染
- 22. Angular2:JSON渲染
- 23. Grails JSON渲染
- 24. 將jbuilder json對象渲染爲json時的問題
- 25. 使用$ .getJSON拉軌渲染JSON到JavaScript(如JSON對象)
- 26. 在Angular2應用程序中渲染JSON對象導致「對象對象」
- 27. js使用json渲染大量的html
- 28. 模塊不渲染
- 29. SonataAdmin - 頁/塊渲染
- 30. SoundPool play()塊渲染
一定要檢查slickgrid:https://github.com/mleibman/SlickGrid/ – pb2q 2012-07-22 20:35:33
1)他們是什麼樣的塊?它是一個對象數組嗎?還是它深深地嵌套在一起,你必須通過編程來深入研究,而不僅僅是一兩個循環? 2)你如何渲染?你只是增加'「