avoid rendering small fields and links for improved perf. This change is experimental, so please report any rendering issues that could be related to this.

code/map_data.js

@@ -484,9 +484,19 @@ window.renderLink = function(ent) {
     weight:2,
     clickable: false,
     guid: ent[0],
-    smoothFactor: 10
+    smoothFactor: 0 // doesn’t work for two points anyway, so disable
   });
 
+  // determine which links are very short and don’t render them at all.
+  // in most cases this will go unnoticed, but improve rendering speed.
+  poly._map = window.map;
+  poly.projectLatlngs();
+  var op = poly._originalPoints;
+  var dist = Math.abs(op[0].x - op[1].x) + Math.abs(op[0].y - op[1].y);
+  if(dist <= 10) {
+    return;
+  }
+
   if(!getPaddedBounds().intersects(poly.getBounds())) return;
 
   poly.on('remove', function() { delete window.links[this.options.guid]; });
@@ -515,16 +525,27 @@ window.renderField = function(ent) {
     [reg.vertexB.location.latE6/1E6, reg.vertexB.location.lngE6/1E6],
     [reg.vertexC.location.latE6/1E6, reg.vertexC.location.lngE6/1E6]
   ];
+
   var poly = L.polygon(latlngs, {
     fillColor: COLORS[team],
     fillOpacity: 0.25,
     stroke: false,
     clickable: false,
-    smoothFactor: 10,
+    smoothFactor: 0, // hiding small fields will be handled below
-    vertices: ent[2].capturedRegion,
+    vertices: reg,
     lastUpdate: ent[1],
     guid: ent[0]});
 
+  // determine which fields are too small to be rendered and don’t
+  // render them, so they don’t count towards the maximum fields limit.
+  // This saves some DOM operations as well, but given the relatively
+  // low amount of fields there isn’t much to gain.
+  // The algorithm is the same as used by Leaflet.
+  poly._map = window.map;
+  poly.projectLatlngs();
+  var count = L.LineUtil.simplify(poly._originalPoints, 6).length;
+  if(count <= 2) return;
+
   if(!getPaddedBounds().intersects(poly.getBounds())) return;
 
   poly.on('remove', function() { delete window.fields[this.options.guid]; });