From ec85c7b458786187a462f91b3780060cb2fb4447 Mon Sep 17 00:00:00 2001
From: Will Thompson <will@willthompson.co.uk>
Date: Tue, 3 May 2016 18:19:37 +0100
Subject: [PATCH] Element: faster tooltip event binding

Even when there is no tooltip, setTooltip() accounts for about 5% of the
time spent setting the values on an ArrayEditable, of which about 2% is
Ox.filter.

There only a few possible sets of events, so use object identity rather
than calculating the set difference. In particular, this is a lot faster
when self.options.tooltip is false-y.

(I think it was actually wrong before, anyway:

    bindTooltipEvents({mouseenter, mouseleave})
    bindTooltipEvents({mousemove, mouseleave})

would (correctly) unbind mouseenter and bind mousemove, but would set
boundTooltipEvents = {mousemove} even though mouseleave is still bound.)
---
 source/UI/js/Core/Element.js | 34 ++++++++++++++++++----------------
 1 file changed, 18 insertions(+), 16 deletions(-)

diff --git a/source/UI/js/Core/Element.js b/source/UI/js/Core/Element.js
index 0c6d089c..db09ea16 100644
--- a/source/UI/js/Core/Element.js
+++ b/source/UI/js/Core/Element.js
@@ -1,6 +1,7 @@
 'use strict';
 
 (function(_) {
+    var noTooltipEvents = {};
 
     /*@
     Ox.Element <f> Basic UI element object
@@ -88,7 +89,7 @@
 
         // create private object
         self = self || {};
-        self.boundTooltipEvents = {}; // FIXME?
+        self.boundTooltipEvents = noTooltipEvents;
         self.defaults = {};
         self.eventCallbacks = self.eventCallbacks || {};
         // allow for Ox.Element('<tagname>') or Ox.Element('cssSelector')
@@ -147,14 +148,22 @@
             });
         }
 
+        var constantTooltipEvents = {
+                mouseenter: onMouseenter,
+                mouseleave: onMouseleave
+            },
+            dynamicTooltipEvents = {
+                mousemove: onMousemove,
+                mouseleave: onMouseleave
+            };
+
         setTooltip();
 
         function bindTooltipEvents(events) {
-            that.off(Ox.filter(self.boundTooltipEvents, function(value, key) {
-                return !events[key];
-            })).on(self.boundTooltipEvents = Ox.filter(events, function(value, key) {
-                return !self.boundTooltipEvents[key];
-            }));
+            if (self.boundTooltipEvents !== events) {
+                that.off(self.boundTooltipEvents).on(events);
+                self.boundTooltipEvents = events;
+            }
         }
 
         function onMousedown(e) {
@@ -322,26 +331,20 @@
         function setTooltip() {
             if (self.options.tooltip) {
                 if (Ox.isString(self.options.tooltip)) {
-                    bindTooltipEvents({
-                        mouseenter: onMouseenter,
-                        mouseleave: onMouseleave
-                    });
+                    bindTooltipEvents(constantTooltipEvents);
                     that.$tooltip && that.$tooltip.options({
                         title: self.options.tooltip,
                         animate: true
                     });
                 } else {
                     that.$tooltip = Ox.Tooltip({animate: false});
-                    bindTooltipEvents({
-                        mousemove: onMousemove,
-                        mouseleave: onMouseleave
-                    });
+                    bindTooltipEvents(dynamicTooltipEvents);
                 }
             } else {
                 if (that.$tooltip) {
                     that.$tooltip.remove();
                 }
-                bindTooltipEvents({});
+                bindTooltipEvents(noTooltipEvents);
             }
         }
 
@@ -841,4 +844,3 @@
     };
 
 }({}));
-