From 0fdd2107410f79e9bc6b0ea455c9cdc70cbf28cc Mon Sep 17 00:00:00 2001
From: Jeff Avallone <jeff.avallone@gmail.com>
Date: Tue, 14 Apr 2015 21:46:14 -0400
Subject: [PATCH] Optimizing spaceHorizontall and spaceVertically methods

Each method was transforming each item twice, and I found that Snap
appears to generate at least one timer per transform. Reducing it to one
transform per item.
---
 src/js/util.js | 67 ++++++++++++++++++++++++--------------------------
 1 file changed, 32 insertions(+), 35 deletions(-)

diff --git a/src/js/util.js b/src/js/util.js
index 2f9d8d0..aebaf14 100644
--- a/src/js/util.js
+++ b/src/js/util.js
@@ -36,34 +36,32 @@ function normalizeBBox(box) {
 // - __items__ - Array of items to be positioned
 // - __options.padding__ - Number of pixels to leave between items
 function spaceHorizontally(items, options) {
-  var verticalCenter = 0;
+  var verticalCenter,
+      values;
 
   options = _.defaults(options || {}, {
     padding: 0
   });
 
-  // Set horizontal position of items with padding between them, and calculate
-  // where the axis points should be positioned vertically.
-  _.reduce(items, (offset, item) => {
-    var box;
+  values = _.map(items, item => {
+    return {
+      box: normalizeBBox(item.getBBox()),
+      item
+    };
+  });
 
+  // Calculate where the axis points should be positioned vertically.
+  verticalCenter = _.reduce(values, (center, { box }) => {
+    return Math.max(center, box.ay);
+  }, 0);
+
+  // Position items with padding between them and aligned their axis points.
+  _.reduce(values, (offset, { item, box }) => {
     item.transform(Snap.matrix()
-      .translate(offset, 0));
-
-    box = normalizeBBox(item.getBBox());
-    verticalCenter = Math.max(verticalCenter, box.ay);
+      .translate(offset, verticalCenter - box.ay));
 
     return offset + options.padding + box.width;
   }, 0);
-
-  // Set vertical position of items to align their axis points.
-  for (var item of items) {
-    let box = normalizeBBox(item.getBBox());
-
-    item.transform(Snap.matrix()
-      .add(item.transform().localMatrix)
-      .translate(0, verticalCenter - box.ay));
-  }
 }
 
 // Positions a collection of items centered horizontally in a vertical stack.
@@ -71,33 +69,32 @@ function spaceHorizontally(items, options) {
 // - __items__ - Array of items to be positioned
 // - __options.padding__ - Number of pixels to leave between items
 function spaceVertically(items, options) {
-  var horizontalCenter = 0;
+  var horizontalCenter,
+      values;
 
   options = _.defaults(options || {}, {
     padding: 0
   });
 
-  // Set vertical position of items with padding between them, and calculate
-  // where the center of each item should be positioned horizontally.
-  _.reduce(items, (offset, item) => {
-    var box;
+  values = _.map(items, item => {
+    return {
+      box: item.getBBox(),
+      item
+    };
+  });
 
+  // Calculate where the center of each item should be positioned horizontally.
+  horizontalCenter = _.reduce(values, (center, { box }) => {
+    return Math.max(center, box.cx);
+  }, 0);
+
+  // Position items with padding between them and align their centers.
+  _.reduce(values, (offset, { item, box }) => {
     item.transform(Snap.matrix()
-      .translate(0, offset));
-
-    box = item.getBBox();
-
-    horizontalCenter = Math.max(horizontalCenter, box.cx);
+      .translate(horizontalCenter - box.cx, offset));
 
     return offset + options.padding + box.height;
   }, 0);
-
-  // Set horizontal position of items to align their centers.
-  for (var item of items) {
-    item.transform(Snap.matrix()
-      .add(item.transform().localMatrix)
-      .translate(horizontalCenter - item.getBBox().cx, 0));
-  }
 }
 
 // Creates a Promise that will be resolved after a specified delay.