improve rendering performance

Improve rendering performance by drawing background only to the clip area, resulting in less memory overhead when zoomed. The same technique is applied to polygons. Improve polygon creation on a Path to simplify code and improve reuse.
greensopinion · Dec 20, 2021 · 548c0cc · 548c0cc
1 parent a3c11cb
commit 548c0cc
Show file tree

Hide file tree

Showing 5 changed files with 23 additions and 46 deletions.
diff --git a/lib/src/features/line_renderer.dart b/lib/src/features/line_renderer.dart
@@ -10,6 +10,7 @@ import '../logger.dart';
 import '../themes/style.dart';
 import 'feature_geometry.dart';
 import 'feature_renderer.dart';
+import 'points_extension.dart';
 
 class LineRenderer extends FeatureRenderer {
   final Logger logger;
@@ -30,18 +31,7 @@ class LineRenderer extends FeatureRenderer {
       logger.log(() => 'rendering linestring');
       final path = Path();
       lines.forEach((line) {
-        line.asMap().forEach((index, point) {
-          if (point.length < 2) {
-            throw Exception('invalid point ${point.length}');
-          }
-          final x = (point[0] / layer.extent) * tileSize;
-          final y = (point[1] / layer.extent) * tileSize;
-          if (index == 0) {
-            path.moveTo(x, y);
-          } else {
-            path.lineTo(x, y);
-          }
-        });
+        path.addPolygon(line.toPoints(layer.extent, tileSize), false);
       });
       if (!_isWithinClip(context, path)) {
         return;

diff --git a/lib/src/features/points_extension.dart b/lib/src/features/points_extension.dart
@@ -0,0 +1,9 @@
+import 'dart:ui';
+
+extension PointsExtension on List<List<double>> {
+  List<Offset> toPoints(int extent, int tileSize) => map((point) {
+        final x = (point[0] / extent) * tileSize;
+        final y = (point[1] / extent) * tileSize;
+        return Offset(x, y);
+      }).toList();
+}
diff --git a/lib/src/features/polygon_renderer.dart b/lib/src/features/polygon_renderer.dart
@@ -1,14 +1,15 @@
+import 'dart:ui';
+
 import 'package:vector_tile/vector_tile.dart';
 import 'package:vector_tile/vector_tile_feature.dart';
 
-import 'dart:ui';
-
 import '../../vector_tile_renderer.dart';
+import '../constants.dart';
 import '../context.dart';
 import '../logger.dart';
 import '../themes/style.dart';
-import '../constants.dart';
 import 'feature_renderer.dart';
+import 'points_extension.dart';
 
 class PolygonRenderer extends FeatureRenderer {
   final Logger logger;
@@ -47,36 +48,24 @@ class PolygonRenderer extends FeatureRenderer {
       List<List<List<double>>> coordinates) {
     final path = Path();
     coordinates.forEach((ring) {
-      ring.asMap().forEach((index, point) {
-        if (point.length < 2) {
-          throw Exception('invalid point ${point.length}');
-        }
-        final x = (point[0] / layer.extent) * tileSize;
-        final y = (point[1] / layer.extent) * tileSize;
-        if (index == 0) {
-          path.moveTo(x, y);
-        } else {
-          path.lineTo(x, y);
-        }
-        if (index == (ring.length - 1)) {
-          path.close();
-        }
-      });
+      path.addPolygon(ring.toPoints(layer.extent, tileSize), true);
     });
     if (!_isWithinClip(context, path)) {
       return;
     }
+    final clipPath = Path()..addRect(context.tileClip.inflate(20));
+    final clippedPath = Path.combine(PathOperation.intersect, path, clipPath);
     final fillPaint = style.fillPaint == null
         ? null
         : style.fillPaint!.paint(zoom: context.zoom);
     if (fillPaint != null) {
-      context.canvas.drawPath(path, fillPaint);
+      context.canvas.drawPath(clippedPath, fillPaint);
     }
     final outlinePaint = style.outlinePaint == null
         ? null
         : style.outlinePaint!.paint(zoom: context.zoom);
     if (outlinePaint != null) {
-      context.canvas.drawPath(path, outlinePaint);
+      context.canvas.drawPath(clippedPath, outlinePaint);
     }
   }
 

diff --git a/lib/src/features/symbol_line_renderer.dart b/lib/src/features/symbol_line_renderer.dart
@@ -11,6 +11,7 @@ import '../logger.dart';
 import '../themes/style.dart';
 import 'feature_geometry.dart';
 import 'feature_renderer.dart';
+import 'points_extension.dart';
 import 'text_abbreviator.dart';
 import 'text_renderer.dart';
 
@@ -37,18 +38,7 @@ class SymbolLineRenderer extends FeatureRenderer {
       if (text != null) {
         final path = Path();
         lines.forEach((line) {
-          line.asMap().forEach((index, point) {
-            if (point.length < 2) {
-              throw Exception('invalid point ${point.length}');
-            }
-            final x = (point[0] / layer.extent) * tileSize;
-            final y = (point[1] / layer.extent) * tileSize;
-            if (index == 0) {
-              path.moveTo(x, y);
-            } else {
-              path.lineTo(x, y);
-            }
-          });
+          path.addPolygon(line.toPoints(layer.extent, tileSize), false);
         });
         final metrics = path.computeMetrics().toList();
         if (metrics.length > 0) {

diff --git a/lib/src/themes/theme_layers.dart b/lib/src/themes/theme_layers.dart
@@ -47,7 +47,6 @@ class BackgroundLayer extends ThemeLayer {
     final paint = Paint()
       ..style = PaintingStyle.fill
       ..color = fillColor;
-    context.canvas.drawRect(
-        Rect.fromLTRB(0, 0, tileSize.toDouble(), tileSize.toDouble()), paint);
+    context.canvas.drawRect(context.tileClip, paint);
   }
 }