diff --git a/js/module/array1d.js b/js/module/array1d.js
index 82068e0dd5cad2d1de240a4e168c7b3679d6c2c6..7c0cdf3189bbf7b6f49d7f188ce7ec692ce56deb 100644
--- a/js/module/array1d.js
+++ b/js/module/array1d.js
@@ -4,9 +4,6 @@ function Array1DTracer(module) {
 
 Array1DTracer.prototype = $.extend(true, Object.create(Array2DTracer.prototype), {
     constructor: Array1DTracer,
-    _setData: function (D) {
-        return Array2DTracer.prototype._setData.call(this, [D]);
-    },
     _notify: function (idx1, idx2) {
         if (idx2 === undefined) {
             Array2DTracer.prototype._notify.call(this, 0, idx1);
@@ -47,6 +44,9 @@ Array1DTracer.prototype = $.extend(true, Object.create(Array2DTracer.prototype),
             });
         });
         Array2DTracer.prototype._deselectSet.call(this, coords);
+    },
+    setData: function (D) {
+        return Array2DTracer.prototype.setData.call(this, [D]);
     }
 });
 
diff --git a/js/module/array2d.js b/js/module/array2d.js
index 5d15b4cfe6a2b63858fd13741038096b06a0b28a..566ec8c8caa6cad287413cb0a16294f764b9a126 100644
--- a/js/module/array2d.js
+++ b/js/module/array2d.js
@@ -12,47 +12,6 @@ Array2DTracer.prototype = $.extend(true, Object.create(Tracer.prototype), {
         this.$table = this.capsule.$table = $('<div class="mtbl-table">');
         this.$container.append(this.$table);
     },
-    resize: function () {
-        Tracer.prototype.resize.call(this);
-
-        this.refresh();
-    },
-    clear: function () {
-        Tracer.prototype.clear.call(this);
-
-        this.clearColor();
-    },
-    _setData: function (D) {
-        this.D = D;
-        this.viewX = this.viewY = 0;
-        this.paddingH = 6;
-        this.paddingV = 3;
-        this.fontSize = 16;
-
-        if (Tracer.prototype._setData.call(this, arguments)) {
-            this.$table.find('.mtbl-row').each(function (i) {
-                $(this).children().each(function (j) {
-                    $(this).text(D[i][j]);
-                });
-            });
-            return true;
-        }
-
-        this.$table.empty();
-        for (var i = 0; i < D.length; i++) {
-            var $row = $('<div class="mtbl-row">');
-            this.$table.append($row);
-            for (var j = 0; j < D[i].length; j++) {
-                var $cell = $('<div class="mtbl-cell">')
-                    .css(this.getCellCss())
-                    .text(D[i][j]);
-                $row.append($cell);
-            }
-        }
-        this.resize();
-
-        return false;
-    },
     _notify: function (x1, y1, x2, y2) {
         var second = x2 !== undefined && y2 !== undefined;
         tm.pushStep(this.capsule, {
@@ -179,8 +138,51 @@ Array2DTracer.prototype = $.extend(true, Object.create(Tracer.prototype), {
                     this.paintColor(sx, sy, ex, ey, colorClass, addClass);
                 }
                 break;
+            default:
+                Tracer.prototype.processStep.call(this, step, options);
         }
     },
+    setData: function (D) {
+        this.D = D;
+        this.viewX = this.viewY = 0;
+        this.paddingH = 6;
+        this.paddingV = 3;
+        this.fontSize = 16;
+
+        if (Tracer.prototype.setData.apply(this, arguments)) {
+            this.$table.find('.mtbl-row').each(function (i) {
+                $(this).children().each(function (j) {
+                    $(this).text(D[i][j]);
+                });
+            });
+            return true;
+        }
+
+        this.$table.empty();
+        for (var i = 0; i < D.length; i++) {
+            var $row = $('<div class="mtbl-row">');
+            this.$table.append($row);
+            for (var j = 0; j < D[i].length; j++) {
+                var $cell = $('<div class="mtbl-cell">')
+                    .css(this.getCellCss())
+                    .text(D[i][j]);
+                $row.append($cell);
+            }
+        }
+        this.resize();
+
+        return false;
+    },
+    resize: function () {
+        Tracer.prototype.resize.call(this);
+
+        this.refresh();
+    },
+    clear: function () {
+        Tracer.prototype.clear.call(this);
+
+        this.clearColor();
+    },
     getCellCss: function () {
         return {
             padding: this.paddingV.toFixed(1) + 'px ' + this.paddingH.toFixed(1) + 'px',
diff --git a/js/module/directed_graph.js b/js/module/directed_graph.js
index 6def46a4e33f6452ac85fdc9479f5373d6bcd7bc..bb176eff0796f5d861148fc9a9b1649eb9cdee4f 100644
--- a/js/module/directed_graph.js
+++ b/js/module/directed_graph.js
@@ -46,6 +46,39 @@ DirectedGraphTracer.prototype = $.extend(true, Object.create(Tracer.prototype),
         this.graph = this.capsule.graph = this.s.graph;
     },
     _setTreeData: function (G, root) {
+        tm.pushStep(this.capsule, {type: 'setTreeData', arguments: arguments});
+    },
+    _visit: function (target, source) {
+        tm.pushStep(this.capsule, {type: 'visit', target: target, source: source});
+    },
+    _leave: function (target, source) {
+        tm.pushStep(this.capsule, {type: 'leave', target: target, source: source});
+    },
+    processStep: function (step, options) {
+        switch (step.type) {
+            case 'setTreeData':
+                this.setTreeData.apply(this, step.arguments);
+                break;
+            case 'visit':
+            case 'leave':
+                var visit = step.type == 'visit';
+                var targetNode = this.graph.nodes(this.n(step.target));
+                var color = visit ? this.color.visited : this.color.left;
+                targetNode.color = color;
+                if (step.source !== undefined) {
+                    var edgeId = this.e(step.source, step.target);
+                    var edge = this.graph.edges(edgeId);
+                    edge.color = color;
+                    this.graph.dropEdge(edgeId).addEdge(edge);
+                }
+                var source = step.source;
+                if (source === undefined) source = '';
+                break;
+            default:
+                Tracer.prototype.processStep.call(this, step, options);
+        }
+    },
+    setTreeData: function (G, root) {
         var tracer = this;
 
         root = root || 0;
@@ -62,7 +95,7 @@ DirectedGraphTracer.prototype = $.extend(true, Object.create(Tracer.prototype),
         };
         getDepth(root, 1);
 
-        if (this._setData(G, root)) return true;
+        if (this.setData.apply(this, arguments)) return true;
 
         var place = function (node, x, y) {
             var temp = tracer.graph.nodes(tracer.n(node));
@@ -87,8 +120,8 @@ DirectedGraphTracer.prototype = $.extend(true, Object.create(Tracer.prototype),
 
         this.refresh();
     },
-    _setData: function (G) {
-        if (Tracer.prototype._setData.call(this, arguments)) return true;
+    setData: function (G) {
+        if (Tracer.prototype.setData.apply(this, arguments)) return true;
 
         this.graph.clear();
         var nodes = [];
@@ -132,31 +165,6 @@ DirectedGraphTracer.prototype = $.extend(true, Object.create(Tracer.prototype),
 
         return false;
     },
-    _visit: function (target, source) {
-        tm.pushStep(this.capsule, {type: 'visit', target: target, source: source});
-    },
-    _leave: function (target, source) {
-        tm.pushStep(this.capsule, {type: 'leave', target: target, source: source});
-    },
-    processStep: function (step, options) {
-        switch (step.type) {
-            case 'visit':
-            case 'leave':
-                var visit = step.type == 'visit';
-                var targetNode = this.graph.nodes(this.n(step.target));
-                var color = visit ? this.color.visited : this.color.left;
-                targetNode.color = color;
-                if (step.source !== undefined) {
-                    var edgeId = this.e(step.source, step.target);
-                    var edge = this.graph.edges(edgeId);
-                    edge.color = color;
-                    this.graph.dropEdge(edgeId).addEdge(edge);
-                }
-                var source = step.source;
-                if (source === undefined) source = '';
-                break;
-        }
-    },
     resize: function () {
         Tracer.prototype.resize.call(this);
 
diff --git a/js/module/tracer.js b/js/module/tracer.js
index e4a2fd9a9590f308d6e26872616511a68b78d51b..c4d98b64d9f903a5fa47c884f32f80970b376396 100644
--- a/js/module/tracer.js
+++ b/js/module/tracer.js
@@ -7,11 +7,8 @@ var Tracer = function (module) {
 };
 
 Tracer.prototype = {
-    _setData: function (arguments) {
-        var data = JSON.stringify(arguments);
-        if (!this.new && this.lastData == data) return true;
-        this.capsule.lastData = data;
-        return false;
+    _setData: function () {
+        tm.pushStep(this.capsule, {type: 'setData', arguments: arguments});
     },
     _clear: function () {
         tm.pushStep(this.capsule, {type: 'clear'});
@@ -21,11 +18,21 @@ Tracer.prototype = {
     },
     processStep: function (step, options) {
         switch (step.type) {
+            case 'setData':
+                this.setData.apply(this, step.arguments);
+                break;
             case 'clear':
                 this.clear();
                 break;
         }
     },
+    setData: function () {
+        var data = JSON.stringify(arguments);
+        if (!this.new && this.lastData == data) return true;
+        this.new = this.capsule.new = false;
+        this.lastData = this.capsule.lastData = data;
+        return false;
+    },
     resize: function () {
     },
     refresh: function () {
diff --git a/js/module/tracer_manager.js b/js/module/tracer_manager.js
index 3ff251eb3cb7594047ae417ad6d9af9220d490d5..370edb86c0909a93080f158f794d8d80634a737b 100644
--- a/js/module/tracer_manager.js
+++ b/js/module/tracer_manager.js
@@ -4,6 +4,7 @@ var stepLimit = 1e6;
 var TracerManager = function () {
     this.pause = false;
     this.capsules = [];
+    this.interval = 500;
 };
 
 TracerManager.prototype = {
@@ -37,10 +38,7 @@ TracerManager.prototype = {
         return selectedCapsule;
     },
     deallocateAll: function () {
-        this.interval = 500;
-        this.traces = [];
-        this.traceIndex = -1;
-        this.stepCnt = 0;
+        this.reset();
         $.each(this.capsules, function (i, capsule) {
             capsule.allocated = false;
         });
@@ -82,9 +80,9 @@ TracerManager.prototype = {
     },
     reset: function () {
         this.traces = [];
+        this.traceIndex = -1;
         this.stepCnt = 0;
         if (timer) clearTimeout(timer);
-        $('#tab_trace .wrapper').empty();
         this.command('clear');
     },
     pushStep: function (capsule, step) {
@@ -132,12 +130,11 @@ TracerManager.prototype = {
         }, this.interval);
     },
     prevStep: function () {
-        $('#tab_trace .wrapper').empty();
         this.command('clear');
         var finalIndex = this.traceIndex - 1;
         if (finalIndex < 0) {
             this.traceIndex = -1;
-            this.refresh();
+            this.command('refresh');
             return;
         }
         for (var i = 0; i < finalIndex; i++) {
diff --git a/js/module/undirected_graph.js b/js/module/undirected_graph.js
index 21cda2ac125084bb949a7f6b085467aa2ebf366f..2bad9d4ceebc4d5d4cab823c029544a38148eb56 100644
--- a/js/module/undirected_graph.js
+++ b/js/module/undirected_graph.js
@@ -19,8 +19,8 @@ UndirectedGraphTracer.prototype = $.extend(true, Object.create(DirectedGraphTrac
             }
         });
     },
-    _setData: function (G) {
-        if (Tracer.prototype._setData.call(this, arguments)) return true;
+    setData: function (G) {
+        if (Tracer.prototype.setData.apply(this, arguments)) return true;
 
         this.graph.clear();
         var nodes = [];
diff --git a/js/module/weighted_directed_graph.js b/js/module/weighted_directed_graph.js
index ff664492ae3c5dc054bbf91481c5c0e1dd99fe26..bcc74dba5ad14bb18fe0a0656a293e67afddc9e5 100644
--- a/js/module/weighted_directed_graph.js
+++ b/js/module/weighted_directed_graph.js
@@ -29,8 +29,43 @@ WeightedDirectedGraphTracer.prototype = $.extend(true, Object.create(DirectedGra
             }
         });
     },
-    _setData: function (G) {
-        if (Tracer.prototype._setData.call(this, arguments)) return true;
+    _weight: function (target, weight, delay) {
+        tm.pushStep(this.capsule, {type: 'weight', target: target, weight: weight}, delay);
+    },
+    _visit: function (target, source, weight) {
+        tm.pushStep(this.capsule, {type: 'visit', target: target, source: source, weight: weight});
+    },
+    _leave: function (target, source, weight) {
+        tm.pushStep(this.capsule, {type: 'leave', target: target, source: source, weight: weight});
+    },
+    processStep: function (step, options) {
+        switch (step.type) {
+            case 'weight':
+                var targetNode = this.graph.nodes(this.n(step.target));
+                if (step.weight !== undefined) targetNode.weight = step.weight;
+                break;
+            case 'visit':
+            case 'leave':
+                var visit = step.type == 'visit';
+                var targetNode = this.graph.nodes(this.n(step.target));
+                var color = visit ? this.color.visited : this.color.left;
+                targetNode.color = color;
+                if (step.weight !== undefined) targetNode.weight = step.weight;
+                if (step.source !== undefined) {
+                    var edgeId = this.e(step.source, step.target);
+                    var edge = this.graph.edges(edgeId);
+                    edge.color = color;
+                    this.graph.dropEdge(edgeId).addEdge(edge);
+                }
+                var source = step.source;
+                if (source === undefined) source = '';
+                break;
+            default:
+                DirectedGraphTracer.prototype.processStep.call(this, step, options);
+        }
+    },
+    setData: function (G) {
+        if (Tracer.prototype.setData.apply(this, arguments)) return true;
 
         this.graph.clear();
         var nodes = [];
@@ -76,41 +111,6 @@ WeightedDirectedGraphTracer.prototype = $.extend(true, Object.create(DirectedGra
 
         return false;
     },
-    _weight: function (target, weight, delay) {
-        tm.pushStep(this.capsule, {type: 'weight', target: target, weight: weight}, delay);
-    },
-    _visit: function (target, source, weight) {
-        tm.pushStep(this.capsule, {type: 'visit', target: target, source: source, weight: weight});
-    },
-    _leave: function (target, source, weight) {
-        tm.pushStep(this.capsule, {type: 'leave', target: target, source: source, weight: weight});
-    },
-    processStep: function (step, options) {
-        switch (step.type) {
-            case 'weight':
-                var targetNode = this.graph.nodes(this.n(step.target));
-                if (step.weight !== undefined) targetNode.weight = step.weight;
-                break;
-            case 'visit':
-            case 'leave':
-                var visit = step.type == 'visit';
-                var targetNode = this.graph.nodes(this.n(step.target));
-                var color = visit ? this.color.visited : this.color.left;
-                targetNode.color = color;
-                if (step.weight !== undefined) targetNode.weight = step.weight;
-                if (step.source !== undefined) {
-                    var edgeId = this.e(step.source, step.target);
-                    var edge = this.graph.edges(edgeId);
-                    edge.color = color;
-                    this.graph.dropEdge(edgeId).addEdge(edge);
-                }
-                var source = step.source;
-                if (source === undefined) source = '';
-                break;
-            default:
-                DirectedGraphTracer.prototype.processStep.call(this, step, options);
-        }
-    },
     clear: function () {
         DirectedGraphTracer.prototype.clear.call(this);
 
diff --git a/js/module/weighted_undirected_graph.js b/js/module/weighted_undirected_graph.js
index 2a1ec09fd5543f686b900d08c2fe8a8c1815e109..7c8b4b712c4e9ff8f8934598cc702a4bb638c621 100644
--- a/js/module/weighted_undirected_graph.js
+++ b/js/module/weighted_undirected_graph.js
@@ -20,8 +20,8 @@ WeightedUndirectedGraphTracer.prototype = $.extend(true, Object.create(WeightedD
             }
         });
     },
-    _setData: function (G) {
-        if (Tracer.prototype._setData.call(this, arguments)) return true;
+    setData: function (G) {
+        if (Tracer.prototype.setData.apply(this, arguments)) return true;
 
         this.graph.clear();
         var nodes = [];
diff --git a/js/script.js b/js/script.js
index 240daea3b75fd9c93b3ac141c9337603094f6ed4..9ad3574a3df41e0e82f4ed3383d77e466c5c443d 100644
--- a/js/script.js
+++ b/js/script.js
@@ -41,7 +41,7 @@ dataEditor.on('change', function () {
     } catch (err) {
         console.error(err);
     } finally {
-        tm.reset();
+        tm.visualize();
         tm.removeUnallocated();
     }
 });
@@ -218,7 +218,6 @@ $('#btn_run').click(function () {
     try {
         tm.deallocateAll();
         eval(dataEditor.getValue());
-        tm.reset();
         eval(codeEditor.getValue());
         tm.visualize();
     } catch (err) {