text: /**
   * @author mrdoob / http://mrdoob.com/
   * @author jetienne / http://jetienne.com/
   * @author paulirish / http://paulirish.com/
   */
  var MemoryStats = function () {
    var msMin = 100;
    var msMax = 0;
  
    var container = document.createElement('div');
    container.id = 'stats';
    container.style.cssText = 'width:80px;opacity:0.9;cursor:pointer';
  
    var msDiv = document.createElement('div');
    msDiv.id = 'ms';
    msDiv.style.cssText = 'padding:0 0 3px 3px;text-align:left;background-color:#020;';
    container.appendChild(msDiv);
  
    var msText = document.createElement('div');
    msText.id = 'msText';
    msText.style.cssText = 'color:#0f0;font-family:Helvetica,Arial,sans-serif;font-size:9px;font-weight:bold;line-height:15px';
    msText.innerHTML = 'Memory';
    msDiv.appendChild(msText);
  
    var msGraph = document.createElement('div');
    msGraph.id = 'msGraph';
    msGraph.style.cssText = 'position:relative;width:74px;height:30px;background-color:#0f0';
    msDiv.appendChild(msGraph);
  
    while (msGraph.children.length < 74) {
      var bar = document.createElement('span');
      bar.style.cssText = 'width:1px;height:30px;float:left;background-color:#131';
      msGraph.appendChild(bar);
    }
  
    var updateGraph = function (dom, height, color) {
      var child = dom.appendChild(dom.firstChild);
      child.style.height = height + 'px';
      if (color) child.style.backgroundColor = color;
    };
  
    var perf = window.performance || {};
    // polyfill usedJSHeapSize
    if (!perf && !perf.memory) {
      perf.memory = { usedJSHeapSize: 0 };
    }
    if (perf && !perf.memory) {
      perf.memory = { usedJSHeapSize: 0 };
    }
  
    // support of the API?
    if (perf.memory.totalJSHeapSize === 0) {
      console.warn('totalJSHeapSize === 0... performance.memory is only available in Chrome .');
    }
  
    // TODO, add a sanity check to see if values are bucketed.
    // If so, reminde user to adopt the --enable-precise-memory-info flag.
    // open -a "/Applications/Google Chrome.app" --args --enable-precise-memory-info
  
    var lastTime = Date.now();
    var lastUsedHeap = perf.memory.usedJSHeapSize;
    return {
      domElement: container,
  
      update: function () {
        // refresh only 30time per second
        if (Date.now() - lastTime < 1000 / 30) return;
        lastTime = Date.now();
  
        var delta = perf.memory.usedJSHeapSize - lastUsedHeap;
        lastUsedHeap = perf.memory.usedJSHeapSize;
        var color = delta < 0 ? '#830' : '#131';
  
        var ms = perf.memory.usedJSHeapSize;
        msMin = Math.min(msMin, ms);
        msMax = Math.max(msMax, ms);
        msText.textContent = 'Mem: ' + bytesToSize(ms, 2);
  
        var normValue = ms / (30 * 1024 * 1024);
        var height = Math.min(30, 30 - normValue * 30);
        updateGraph(msGraph, height, color);
  
        function bytesToSize(bytes, nFractDigit) {
          var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
          if (bytes == 0) return 'n/a';
          nFractDigit = nFractDigit !== undefined ? nFractDigit : 0;
          var precision = Math.pow(10, nFractDigit);
          var i = Math.floor(Math.log(bytes) / Math.log(1024));
          return Math.round((bytes * precision) / Math.pow(1024, i)) / precision + ' ' + sizes[i];
        }
      },
    };
  };
  
  (function () {
    var stats = new MemoryStats();
    stats.domElement.style.position = 'fixed';
    stats.domElement.style.right = '0px';
    stats.domElement.style.bottom = '0px';
    document.body.appendChild(stats.domElement);
    requestAnimationFrame(function rAFloop() {
      stats.update();
      requestAnimationFrame(rAFloop);
    });
  
    return {
      memoryStats: stats,
      renderRate: renderRate,
    };
  })();
  