Merge pull request #9128 from ahocevar/less-render-cycles

Use less render cycles for vector tile layers

examples/mapbox-style.js

@@ -1,3 +1,3 @@
 import apply from 'ol-mapbox-style';
 
-apply('map', 'https://maps.tilehosting.com/styles/bright/style.json?key=ER67WIiPdCQvhgsUjoWK');
+apply('map', 'https://maps.tilehosting.com/styles/topo/style.json?key=ER67WIiPdCQvhgsUjoWK');

package.json

@@ -75,7 +75,7 @@
     "loglevelnext": "^3.0.0",
     "marked": "0.6.0",
     "mocha": "5.2.0",
-    "ol-mapbox-style": "^3.6.2",
+    "ol-mapbox-style": "^3.6.3",
     "pixelmatch": "^4.0.2",
     "pngjs": "^3.3.3",
     "proj4": "2.5.0",

src/ol/renderer/canvas/VectorTileLayer.js

@@ -524,12 +524,10 @@ class CanvasVectorTileLayerRenderer extends CanvasTileLayerRenderer {
    * @param {import('../../PluggableMap.js').FrameState} frameState Frame state.
    */
   renderTileImages_(hifi, frameState) {
-    // Even when we have time to render hifi, do not spend more than 100 ms in this render frame,
-    // to avoid delays when the user starts interacting again with the map.
-    // When we don't have time to render hifi, only render lowres tiles until we have used up
+    // When we don't have time to render hifi, only render tiles until we have used up
     // half of the frame budget of 16 ms
     for (const uid in this.renderTileImageQueue_) {
-      if (Date.now() - frameState.time > (hifi ? 100 : 8)) {
+      if (!hifi && Date.now() - frameState.time > 8) {
         break;
       }
       const tile = this.renderTileImageQueue_[uid];