Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Javascript engine executes functions one by one by taking them from sort of a queue. Functions can be put there either by your script or as result of user's actions (event handlers). So idea is to split long-running task into small short-running subtasks and feed them into this 'queue' in the manner so they can be mixed with functions responding to user's action.<br/> This can be done by calling window's setTimeout with zero delay and passing your sub-task as a function. Thus you will give a chance for UI event handler to be executed earlier</p> <pre><code>function plotSpot(spot) { // adding spots to map }; var spots = [1,2,3,4,5,6,7,8,9,10,11,12]; var plotSpotsBatch; plotSpotsBatch = function() { var spotsInBatch = 10; while(spots.length &gt; 0 &amp;&amp; spotsInBatch--) { var spot = spots.shift(); plotSpot(spot); } if (spots.length &gt; 0) { setTimeout(plotSpotsBatch, 0); } }; plotSpotsBatch(); </code></pre> <p>Here is extension for Array prototype:</p> <pre><code>Array.prototype.forEachInBatches = function(batchSize, func) { var arr = this; var i = 0; var doer; doer = function() { setTimeout(function() { for (var stopBatch = i + batchSize; i &lt; stopBatch &amp;&amp; i &lt; arr.length; i++) { func(arr[i], i); } if (i &lt; arr.length) { doer(); } }, 0); }; doer(); }; </code></pre> <p>Usage example (you have to have div with id 'spots' somewhere in document). To see the difference, set batch size equal to number of spots:</p> <pre><code>var spots = []; for (var i = 0; i &lt; 10000; i++) { spots.push('{x: ' + Math.ceil(Math.random() * 180) + ', y: ' + Math.ceil(Math.random() * 180) + '}'); } spots.forEachInBatches(10, function(spot, i) { document.getElementById('spots').innerHTML += spot + (i &lt; spots.length ? '; ' : ''); }); </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload