Defer texture loads until post render

src/ol/webgl/tilelayerrenderer.js

@@ -1,6 +1,5 @@
 // FIXME large resolutions lead to too large framebuffers :-(
 // FIXME animated shaders! check in redraw
-// FIXME defer texture uploads
 
 goog.provide('ol.webgl.TileLayerRenderer');
 goog.provide('ol.webgl.tilelayerrenderer');
@@ -285,6 +284,8 @@ ol.webgl.TileLayerRenderer.prototype.handleWebGLContextLost = function() {
  */
 ol.webgl.TileLayerRenderer.prototype.render = function() {
 
+  var animate = false;
+
   var mapRenderer = this.getMapRenderer();
   var map = this.getMap();
   var gl = mapRenderer.getGL();
@@ -369,12 +370,24 @@ ol.webgl.TileLayerRenderer.prototype.render = function() {
    */
   var tilesToDrawByZ = {};
 
+  /**
+   * @type {Array.<ol.Tile>}
+   */
+  var imagesToLoad = [];
+
   tilesToDrawByZ[z] = {};
   tileBounds.forEachTileCoord(z, function(tileCoord) {
+
     var tile = tileStore.getTile(tileCoord);
+
     if (goog.isNull(tile)) {
     } else if (tile.getState() == ol.TileState.LOADED) {
+      if (mapRenderer.isImageTextureLoaded(tile.getImage())) {
         tilesToDrawByZ[z][tileCoord.toString()] = tile;
+        return;
+      } else {
+        imagesToLoad.push(tile.getImage());
+      }
     } else {
       var tileKey = goog.getUid(tile);
       if (!(tileKey in this.tileChangeListenerKeys_)) {
@@ -383,6 +396,8 @@ ol.webgl.TileLayerRenderer.prototype.render = function() {
         this.tileChangeListenerKeys_[tileKey] = goog.events.listen(tile,
             goog.events.EventType.CHANGE, this.handleTileChange, false, this);
       }
+    }
+
     // FIXME this could be more efficient about filling partial holes
     tileGrid.forEachTileCoordParentTileBounds(
         tileCoord,
@@ -406,7 +421,7 @@ ol.webgl.TileLayerRenderer.prototype.render = function() {
           });
           return fullyCovered;
         });
-    }
+
   }, this);
 
   var zs = goog.object.getKeys(tilesToDrawByZ);
@@ -454,4 +469,22 @@ ol.webgl.TileLayerRenderer.prototype.render = function() {
       -0.5,
       0);
 
+  if (!goog.array.isEmpty(imagesToLoad)) {
+    goog.events.listenOnce(
+        map,
+        ol.MapEventType.POST_RENDER,
+        goog.partial(function(mapRenderer, imagesToLoad) {
+          if (goog.DEBUG) {
+            ol.webgl.tilelayerrenderer.logger.info('uploading textures');
+          }
+          goog.array.forEach(imagesToLoad, function(image) {
+            mapRenderer.bindImageTexture(
+                image, goog.webgl.LINEAR, goog.webgl.LINEAR);
+          });
+        }, mapRenderer, imagesToLoad));
+    animate = true;
+  }
+
+  return animate;
+
 };