I am writing an app that contains a dijit/tree. The tree interacts with map selections such that users select features in the map, the selection gets interrogated and child nodes in the dijit/tree get created and populated.
In other words the dijit/tree observes changes to its underlying dojo/store/Memory using dojo/store/Observable (dojo/store/Observable — The Dojo Toolkit - Reference Guide ).
The pattern is below:
<SPAN class="keyword token">var</SPAN> myStore <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Observable</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">Memory</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>data<SPAN class="punctuation token">:</SPAN> someData<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">ObjectStoreModel</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>store<SPAN class="punctuation token">:</SPAN> myStore<SPAN class="punctuation token">,</SPAN> query<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">{</SPAN>id<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">'SomeParentNodes'</SPAN><SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="keyword token">var</SPAN> myTree<SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">TreeView</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
model<SPAN class="punctuation token">:</SPAN> myModel
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"someNode"</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>Then, after map selections:
array<SPAN class="punctuation token">.</SPAN><SPAN class="token function">forEach</SPAN><SPAN class="punctuation token">(</SPAN>selectedFeatureStuff<SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>selectedFeatureValue<SPAN class="punctuation token">,</SPAN> i<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN>
myTree<SPAN class="punctuation token">.</SPAN>model<SPAN class="punctuation token">.</SPAN>store<SPAN class="punctuation token">.</SPAN><SPAN class="token function">add</SPAN><SPAN class="punctuation token">(</SPAN>selectedFeatureValue<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="comment token">// ADD</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>That's pretty slick, except my dijit/tree will typically have hundreds of child nodes (under 5-10 parent nodes). in this scenario, the addition of each child node takes ~0.5 seconds, which means for hundreds of nodes it takes many minutes to fully hydrate the dijit/tree. Unacceptable.
My question is: Is there a way to improve performance here? e.g., turning off Observable just long enough for all the nodes to be created? Or perhaps bulk loading the data store? Or something else entirely. None of the solutions to these options is apparent to me.
TIA
