From ec724ce417cfb7e9febda8dbbfe420f2c015b280 Mon Sep 17 00:00:00 2001
From: Chris Hill-Scott <me@quis.cc>
Date: Wed, 3 Aug 2016 08:06:22 +0100
Subject: [PATCH] Stop AJAX updater consuming ever-increasing memory
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The pages with AJAX on were feeling quite sluggish, and it felt like
they were making the whole browser slow down.

Looking at the performance stuff in Chrome, the number of DOM nodes was
going up and up, which is weird because the number of things on the page
wasn’t changing. This was causing the page to consume more and more
memory in order to store all these nodes.

This is kinda beyond my understanding, but I tried a few things and it
looks like the browser was having a hard time garbage collecting the
temporary bits of DOM used to update the page.

By assinging these bits of DOM to variables before using them it seems
that the browser has an easier time cleaning them up.
---
 app/assets/javascripts/updateContent.js | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/app/assets/javascripts/updateContent.js b/app/assets/javascripts/updateContent.js
index 41dd41ff5..2912cf9b1 100644
--- a/app/assets/javascripts/updateContent.js
+++ b/app/assets/javascripts/updateContent.js
@@ -3,11 +3,16 @@
 
   var queues = {};
   var dd = new diffDOM();
+  var timer;
 
-  var getRenderer = $component => response => dd.apply(
-    $component.get(0),
-    dd.diff($component.get(0), $(response[$component.data('key')]).get(0))
-  );
+  var getRenderer = $component => response => function() {
+    var component = $component.get(0);
+    var updated = $(response[$component.data('key')]).get(0);
+    var diff = dd.diff(component, updated);
+    dd.apply(
+      component, diff
+    );
+  };
 
   var getQueue = resource => (
     queues[resource] = queues[resource] || []
@@ -29,7 +34,7 @@
       () => clearQueue(queue)
     );
 
-    setTimeout(
+    timer = setTimeout(
       () => poll(...arguments), interval
     );