構建不凍結的javascript對象

Question

我目前正在開發一個管理面板，用於添加和刪除圖形中的頂點。 我有三個大型的「網絡」 - 每個節點大約有500個節點，我加載並構建時沒有任何問題。 現在，只有一個以HTML5圖形顯示。爲圖形創建所有HTML5對象非常耗時（大約5秒鐘）。這些圖表未來可能會增長，而這一次可能會增加。在構建圖形用戶界面時，網站沒有響應，我正在努力解決這個問題。 我已經使用了'setTimeout'，但沒有得到預期的結果。

我想知道是否有可能在外部文件中構建一個javascript-Object，然後可以用ajax調用它？請注意，我要構建的對象來自JavaScript函數和基於HTML5的！

謝謝。

Answer 1

您可以使用nodejs在服務器上運行處理器密集型代碼，並通過簡單的ajax調用返回JSON結果。

沒有看到任何代碼，很難給出更多關於如何實現這一點的細節。但是，如果該對象已經在JS中構建，則卸載到節點應該不會很困難。

也許看這個答案如何創建節點一個簡單的服務器響應： Basic Ajax send/receive with node.js

Answer 2

我對這個問題的假設是： 1）你得到的數據沒有任何問題 2）它的呈現到HTML導致放緩。

DOM並不是世界上最響應的事情。這聽起來很奇怪，但建立一個巨大的HTML字符串其實很快，然後通過調用div.innerHTML或$（'＃graph'）。html（）來設置它。

原因是，一旦字符串被建立，複雜的字符串處理和DOM操作發生在瀏覽器中，這是用高度優化的C或C++編寫的，而不是JavaScript引擎。

另一種方法是將渲染分割成幾部分，並嘗試使用setTimeout「屈服」其他事件。使用此功能，您可以一次迭代500個節點，然後調用setTimeout（next，0）繼續下一個50個節點。這可以在做太多工作之前處理其他事件。

一個副作用可能是圖形分階段顯示，因爲setTimeout將允許DOM在繼續之前渲染該部分。