Merge pull request #437 from twpayne/throttle-image-loads

Throttle image requests

src/ol/map.js

@@ -77,6 +77,18 @@ ol.ENABLE_DOM = true;
 ol.ENABLE_WEBGL = true;
 
 
+/**
+ * @define {number} Maximum number of simultaneously loading tiles.
+ */
+ol.MAXIMUM_TILES_LOADING = 8;
+
+
+/**
+ * @define {number} Maximum new tile loads per frame.
+ */
+ol.MAXIMUM_NEW_TILE_LOADS_PER_FRAME = 2;
+
+
 /**
  * @enum {string}
  */
@@ -273,7 +285,9 @@ ol.Map = function(mapOptions) {
    * @private
    * @type {ol.TileQueue}
    */
-  this.tileQueue_ = new ol.TileQueue(goog.bind(this.getTilePriority, this),
+  this.tileQueue_ = new ol.TileQueue(
+      ol.MAXIMUM_TILES_LOADING,
+      goog.bind(this.getTilePriority, this),
       goog.bind(this.handleTileChange_, this));
 
   goog.events.listen(this, ol.Object.getChangedEventType(ol.MapProperty.VIEW),
@@ -555,7 +569,7 @@ ol.Map.prototype.handleMapBrowserEvent = function(mapBrowserEvent) {
  */
 ol.Map.prototype.handlePostRender = function() {
   this.tileQueue_.reprioritize(); // FIXME only call if needed
-  this.tileQueue_.loadMoreTiles();
+  this.tileQueue_.loadMoreTiles(ol.MAXIMUM_NEW_TILE_LOADS_PER_FRAME);
 
   var postRenderFunctions = this.postRenderFunctions_;
   var i;

src/ol/tilequeue.js

@@ -18,12 +18,15 @@ ol.TilePriorityFunction;
 /**
  * @constructor
  * @extends {ol.structs.PriorityQueue}
+ * @param {number} maxTilesLoading Maximum number of simultaneously loading
+ *     tiles.
  * @param {ol.TilePriorityFunction} tilePriorityFunction
  *     Tile priority function.
  * @param {Function} tileChangeCallback
  *     Function called on each tile change event.
  */
-ol.TileQueue = function(tilePriorityFunction, tileChangeCallback) {
+ol.TileQueue =
+    function(maxTilesLoading, tilePriorityFunction, tileChangeCallback) {
 
   goog.base(
       this,
@@ -52,7 +55,7 @@ ol.TileQueue = function(tilePriorityFunction, tileChangeCallback) {
    * @private
    * @type {number}
    */
-  this.maxTilesLoading_ = 8;
+  this.maxTilesLoading_ = maxTilesLoading;
 
   /**
    * @private
@@ -74,15 +77,18 @@ ol.TileQueue.prototype.handleTileChange = function() {
 
 
 /**
- *  FIXME empty description for jsdoc
+ * @param {number} limit Maximum number of new tiles to load.
  */
-ol.TileQueue.prototype.loadMoreTiles = function() {
+ol.TileQueue.prototype.loadMoreTiles = function(limit) {
   var tile;
-  while (!this.isEmpty() && this.tilesLoading_ < this.maxTilesLoading_) {
+  while (limit > 0 &&
+         !this.isEmpty() &&
+         this.tilesLoading_ < this.maxTilesLoading_) {
     tile = /** @type {ol.Tile} */ (this.dequeue()[0]);
     goog.events.listenOnce(tile, goog.events.EventType.CHANGE,
         this.handleTileChange, false, this);
     tile.load();
     ++this.tilesLoading_;
+    --limit;
   }
 };