Maximum call stack size exceeded when generating diffs on very large images

[lencioni]

I have an image that is roughly 300 x 20,000 pixels. On Happo 2.8.0, the diff generation takes a while and then finally I see in the console

Uncaught RangeError: Maximum call stack size exceeded

The stack trace isn't super clear, but I pretty-printed the minified code and it seems to be happening in this function:

r.lcs = function v() {
  function t(t, r) {
      return t.length + ":" + r.length
  }
  function r(i, u) {
      if (!i.length || !u.length)
          return [];
      if (n[t(i, u)])
          return n[t(i, u)];
      if (g(i[0], u[0]))
          return [e(i)].concat(r(a(i), a(u)));
      var f = r(a(i), u)
        , o = r(i, a(u));
      return n[t(i, u)] = f.length > o.length ? f : o
  }
  var n = {}
    , i = c(arguments)
    , u = i[0]
    , f = i[1];
  if (i.length > 2)
      return i.push(v(i.shift(), i.shift())),
      v(i);
  for (var o = 0, l = 0, s = 0; s < u.length && s < f.length && g(u[s], f[s]); s++)
      o = s + 1;
  if (u.length === o)
      return u.slice();
  for (var s = 0; s < u.length - o && s < f.length - o && g(u[u.length - 1 - s], f[f.length - 1 - s]); s++)
      l = s;
  var h = u.slice(o, u.length - l)
    , p = f.slice(o, f.length - l);
  return u.slice(0, o).concat(r(h, p)).concat(u.slice(u.length - l))
}

This code looks like it comes from adiff. https://github.com/dominictarr/adiff/blob/81425183f03dd2ddf509ebcae04a1c36e7245a11/index.js#L85-L146

I think this is happening because this function is recursive.

[lencioni]

Another issue is we don't surface this error in the UI at all, so I thought it was still loading even though it had errored out.

[lencioni]

I think we've resolved this with the LCS rewrite from #158.