diff --git a/beakerx/beakerx/static/html/settings_tab.html b/beakerx/beakerx/static/html/settings_tab.html
index 6a7b9aac90..dcbd024e18 100644
--- a/beakerx/beakerx/static/html/settings_tab.html
+++ b/beakerx/beakerx/static/html/settings_tab.html
@@ -27,6 +27,14 @@
         #beakerx_info .beakerx_site_link img {
             height: 35px;
         }
+
+        #sync_indicator .saving {
+            color: #f0ad4e;
+        }
+
+        #sync_indicator .saved {
+            color: #5cb85c;
+        }
     </style>
     <div id="beakerx_env_toolbar" class="list_toolbar row">
         <div class="col-xs-12 no-padding">
@@ -73,8 +81,11 @@
                         <div class="col-xs-8">
                             <div class="pull-right">
                                 <label for="add_option_jvm_sett">add option: </label>
-                                <button type="button" id="add_option_jvm_sett" title="" class="btn btn-default btn-xs"
-                                        data-original-title="add new"><i class="fa fa-plus"></i></button>
+                                <button type="button"
+                                        id="add_option_jvm_sett"
+                                        class="btn btn-default btn-xs"
+                                        data-original-title="add new">
+                                    <i class="fa fa-plus"></i>
                                 </button>
                             </div>
                         </div>
@@ -83,10 +94,12 @@
                 </div>
             </fieldset>
             <div class="form-group text-primary">
-                <span>Result: java </span><span id="result"></span>
+                <span id="sync_indicator">
+                    <span class="saving hidden"><i class="fa fa-spinner"></i></span>
+                    <span class="saved hidden"><i class="fa fa-check"></i></span>
+                </span><span>Result: java </span><span id="result"></span>
             </div>
             <div id="errors" style="color: red"></div>
-            <button type="button" id="jvm_settings_submit" class="btn btn-primary">OK</button>
         </form>
     </div>
 </div>
diff --git a/beakerx/beakerx/static/tree.js b/beakerx/beakerx/static/tree.js
index b4fb8296d8..42595f3c02 100644
--- a/beakerx/beakerx/static/tree.js
+++ b/beakerx/beakerx/static/tree.js
@@ -14,12 +14,22 @@
  *  limitations under the License.
  */
 
-define(function (require) {
+// jscs:disable requireCamelCaseOrUpperCaseIdentifiers
+
+define(function(require) {
+  var _ = require('underscore');
   var $ = require('jquery');
   var Jupyter = require('base/js/namespace');
   var utils = require('base/js/utils');
   var urls = require('./urls');
 
+  var $beakerxEl;
+  var BeakerXTreeEvents = {
+    INPUT_CHANGED: 'beakerx:tree:input_changed',
+    SUBMIT_OPTIONS_START: 'beakerx:tree:submit_options_start',
+    SUBMIT_OPTIONS_STOP: 'beakerx:tree:submit_options_stop',
+  };
+
   function AjaxSettings(settings) {
     settings.cache = false;
     settings.dataType = 'json';
@@ -31,52 +41,54 @@ define(function (require) {
   }
 
   function SuccessWrapper(success_callback, error_callback) {
-    return function (data, status, xhr) {
+    return function(data, status, xhr) {
       if (data.error || data.message) {
         error_callback(xhr, status, data.error || data.message);
-      }
-      else {
+      } else {
         success_callback(data, status, xhr);
       }
-    }
+    };
   }
 
   function MakeErrorCallback(title, msg) {
-    return function (xhr, status, e) {
+    return function(xhr, status, e) {
       console.warn(msg + ' ' + e);
-    }
+    };
   }
 
-  function InpuChanged(e) {
-    var result = "";
-    var enable_button = true;
-
-    var val = $("#heap_GB").val().trim();
-
-    if (val.length > 0) {
-      if (!isNaN(val)) {
-        if (val % 1 === 0) {
-          result += '-Xmx' + val + 'g '
-        } else {
-          result += '-Xmx' + parseInt(val * 1024) + 'm '
-        }
+  function InputChanged(e, triggerBeakerXEvent) {
+    if (e && e.hasOwnProperty('key')) {
+      switch (e.key) {
+        case 'ArrowUp':
+        case 'ArrowDown':
+        case 'ArrowLeft':
+        case 'ArrowRight':
+        case 'Tab':
+          return;
       }
     }
+    if (false !== triggerBeakerXEvent) {
+      $beakerxEl.trigger(BeakerXTreeEvents.INPUT_CHANGED, e);
+    }
+    var result = '';
+    var errors = [];
+
+    var val = $('#heap_GB').val().trim();
+    try {
+      if (val !== '') {
+        var parsedVal = settings.normaliseHeapSize(val);
+        result += '-Xmx' + parsedVal + ' ';
+      }
+    } catch (e) {
+      errors.push(e.message);
+    }
 
-
-    var other_property = $('#other_property input');
-    other_property.each(function () {
+    $('#other_property').find('input').each(function() {
       var value = $(this).val().trim();
-      result += value + " ";
-
-      if (value.length < 1) {
-        enable_button = false
-      }
+      result += value + ' ';
     });
 
-    var java_property = $('#properties_property div');
-
-    java_property.each(function () {
+    $('#properties_property').find('div').each(function() {
       var children = $($(this).children());
       var value = $(children.get(1)).val().trim();
       var name = $(children.get(0)).val().trim();
@@ -84,33 +96,23 @@ define(function (require) {
       var value_combined = '-D' + name + '=' + value;
 
       if (name.length > 0) {
-        result += value_combined + " ";
-      }
-
-      if (value_combined.length < 1) {
-        enable_button = false
+        result += value_combined + ' ';
       }
     });
 
     $('#result').text(result);
-    $('#errors').empty();
+    var errorsEl = $('#errors');
+    errorsEl.empty();
 
-    if (val.length > 0 && isNaN(val)) {
-      $('#errors').append($('<span>').text("Heap Size must be a decimal number."));
-      enable_button = false;
-    }
-
-    if (enable_button) {
-      $('#jvm_settings_submit').removeAttr('disabled');
-    } else {
-      $('#jvm_settings_submit').prop('disabled', true);
+    if (errors.length > 0) {
+      errorsEl.append($('<span>').text(errors.join('\n')));
     }
   }
 
   var error_callback = MakeErrorCallback('Error', 'An error occurred while load Beakerx setings');
   var version = {
-    versionBox: "beakerx_info",
-    load: function () {
+    versionBox: 'beakerx_info',
+    load: function() {
       var that = this;
 
       function handle_response(data, status, xhr) {
@@ -172,74 +174,110 @@ define(function (require) {
   };
   var settings = {
     formId: 'beakerx_jvm_settings_form',
-    randId: function () {
+    randId: function() {
       return Math.random().toString(36).substr(2, 10);
     },
-    appendField: function (opts) {
+    appendField: function(opts) {
       var id = this.randId();
-      var input = $('<input>', {class: 'form-control'});
-      var wrapper = $('<div>', {class: 'form-group form-inline bko-spacing'});
-      wrapper.attr('id', id);
-      var remove_button = $('<button>');
-      remove_button.attr('type', 'button');
-      remove_button.attr('class', 'btn btn-default btn-sm');
-      remove_button.attr('data-original-title', 'remove row');
-      remove_button.append($('<i>').attr('class', 'fa fa-times'));
-      remove_button.click(function (event) {
-        $('#' + id).remove();
-        InpuChanged();
+      var wrapper = $('<div>', {
+        class: 'form-group form-inline bko-spacing',
+        id: id
       });
-
-      input.attr('id', this.randId());
-      input.val(opts.value);
-      input.attr('placeholder', 'value');
-      input.keyup(InpuChanged);
       if (opts.add_label) {
-        var label = $('<input>', {class: 'form-control'});
-        label.val(opts.name);
-        label.attr('id', this.randId());
-        label.attr('placeholder', 'name');
-        label.keyup(InpuChanged);
-        wrapper.append(label);
+        wrapper.append(this._createInput('name', opts.name));
       }
-      wrapper.append(input);
-      wrapper.append(remove_button);
+      wrapper
+        .append(this._createInput('value', opts.value))
+        .append(this._createRemoveButton(id));
       $(opts.parent).append(wrapper);
-      InpuChanged({});
+      InputChanged({}, false);
     },
 
-    load: function () {
+    _createRemoveButton: function(id) {
+      return $('<button>', {
+        'type': 'button',
+        'class': 'btn btn-default btn-sm',
+        'data-original-title': 'remove row',
+      }).append(
+        $('<i>', {'class': 'fa fa-times'}
+      )).click(function(event) {
+        $('#' + id).remove();
+        InputChanged();
+      });
+    },
+
+    _createInput: function(placeholder, value) {
+      return $('<input>', {
+        class: 'form-control',
+        id: this.randId(),
+        placeholder: placeholder,
+      }).val(value).keyup(InputChanged);
+    },
+
+    normaliseHeapSize: function(val) {
+      if (val === '') {
+        return '';
+      }
+
+      var parsedVal = parseFloat(val);
+
+      if (isNaN(parsedVal) || !isFinite(val) || parsedVal <= 0) {
+        throw new Error('Heap Size must be a positive decimal number.');
+      }
+
+      return (val % 1 === 0) ?
+        parsedVal + 'g' :
+        parseInt(parsedVal * 1024) + 'm';
+    },
+
+    load: function(payload) {
+      if (payload === undefined) {
+        payload = {
+          properties: [],
+          other: [],
+        };
+      }
+
       var that = this;
 
       function handle_response(response, status, xhr) {
         var data = response.beakerx.jvm_options;
-        $('#other_property').empty();
-        $('#properties_property').empty();
-
         var other_fieldset = $('#other_property');
-        for (var i = 0; i < data.other.length; i++) {
-          var opts = {
-            value: data.other[i],
-            parent: other_fieldset,
-            add_label: false
-          };
-          that.appendField(opts);
-        }
         var properties_fieldset = $('#properties_property');
+
+        if (data.heap_GB !== payload.heap_GB) {
+          $('#heap_GB').val(data.heap_GB);
+        }
+
         for (var key in data.properties) {
-          if (key == "-Xmx")
+          if (false === data.properties.hasOwnProperty(key)) {
+            continue;
+          }
+          if (key === '-Xmx') {
+            continue;
+          }
+          if (payload.properties.hasOwnProperty(key)) {
             continue;
-          var opts = {
+          }
+          that.appendField({
             name: data.properties[key].name,
             value: data.properties[key].value,
             parent: properties_fieldset,
             add_label: true
-          };
-          that.appendField(opts);
+          });
+        }
+
+        for (var i = 0; i < data.other.length; i++) {
+          if (-1 === payload.other.indexOf(data.other[i])) {
+            that.appendField({
+              value: data.other[i],
+              parent: other_fieldset,
+              add_label: false
+            });
+          }
         }
 
-        $('#heap_GB').val(data['heap_GB']);
-        InpuChanged({});
+        InputChanged({}, false);
       }
 
       var settings = AjaxSettings({
@@ -250,9 +288,10 @@ define(function (require) {
       return utils.ajax(urls.api_url + 'settings', settings);
     },
 
-    setVariables: function (data) {
+    setVariables: function(data) {
+      $beakerxEl.trigger(BeakerXTreeEvents.SUBMIT_OPTIONS_START);
       function handle_response(data, status, xhr) {
-
+        $beakerxEl.trigger(BeakerXTreeEvents.SUBMIT_OPTIONS_STOP);
       }
 
       var settings = AjaxSettings({
@@ -264,102 +303,145 @@ define(function (require) {
 
       return utils.ajax(urls.api_url + 'settings', settings);
     },
-    createField: function (parent) {
-      var that = this;
-      var opts = {
-        name: "",
-        value: "",
+
+    createField: function(parent) {
+      this.appendField({
+        name: '',
+        value: '',
         parent: parent,
         add_label: false
-      };
-      that.appendField(opts);
+      });
     }
   };
 
   function load() {
-    if (!Jupyter.notebook_list)
+    if (!Jupyter.notebook_list) {
       return;
+    }
     utils.ajax(urls.static_url + 'settings_tab.html', {
       dataType: 'html',
-      success: function (env_html, status, xhr) {
-        $(".tab-content").append($(env_html));
-        $("#tabs").append(
-          $('<li>')
-            .append(
-              $('<a>')
-                .attr('id', 'beakerx_tab')
-                .attr('href', '#beakerx')
-                .attr('data-toggle', 'tab')
-                .text('BeakerX')
-                .click(function (e) {
-                  window.history.pushState(null, null, '#beakerx');
-                  version.load();
-                  settings.load();
+      success: function(env_html, status, xhr) {
+        _createBeakerxTab(env_html);
+        $beakerxEl = $('#beakerx');
+        _setupFormEvents();
+        _setupContinuousSync();
 
-                })
-            )
-        );
-
-        $("#jvm_settings_submit").click(function (event) {
-          event.preventDefault();
-
-          var payload = {};
-          payload['jvm_options'] = {};
-          var values = [];
-          var other_property = $('#other_property input');
-          other_property.each(function () {
-            var value = $(this).val().trim();
-            if (value.length > 0) {
-              values.push(value);
-            }
-          });
-          payload['jvm_options']['other'] = values;
-          var java_values = [];
-          var java_property = $('#properties_property div');
-          java_property.each(function () {
-            var children = $($(this).children());
-            var value = $(children.get(1)).val().trim();
-            var name = $(children.get(0)).val().trim();
-            java_values.push({'name' : name,  'value': value})
-          });
-          var default_property = $('#default_options input');
-          default_property.each(function () {
-            var value = $(this).val().trim();
-              payload['jvm_options']['heap_GB'] = parseFloat(value)
-          });
-          payload['jvm_options']['properties'] = java_values;
-          payload['version'] = 2;
-          settings.setVariables(JSON.stringify({'beakerx': payload}));
+        if (window.location.hash === '#beakerx') {
+          $('#beakerx_tab').tab('show');
+          version.load();
           settings.load();
-        });
+        }
+      }
+    });
+  }
 
-        $("#add_property_jvm_sett").click(function (event) {
-          event.preventDefault();
-          var parent = $('#properties_property');
+  function _createBeakerxTab(tab_html) {
+    $('.tab-content').append($(tab_html));
+    $('#tabs').append(
+      $('<li>').append(
+        $('<a>', {
+          id: 'beakerx_tab',
+          href: '#beakerx',
+          'data-toggle': 'tab',
+          text: 'BeakerX'
+        }).click(function(e) {
+          if (window.location.hash === '#beakerx') {
+            return;
+          }
+
+          window.history.pushState(null, null, '#beakerx');
+          version.load();
+          settings.load();
+        })
+      )
+    );
+  }
+  function _setupFormEvents() {
+    $('#add_property_jvm_sett').click(_onJvmPropertyAddClickedHandler);
+    $('#add_option_jvm_sett').click(_onJvmOptionAddClickedHandler);
+    $('#heap_GB').keyup(InputChanged);
+  }
+  function _setupContinuousSync() {
+    $beakerxEl.on(BeakerXTreeEvents.INPUT_CHANGED, _.debounce(function(e) {
+      _submitOptions();
+    }, 1000));
+
+    var $syncIndicator = $('#sync_indicator');
+    $beakerxEl.on(BeakerXTreeEvents.SUBMIT_OPTIONS_START, function() {
+      $syncIndicator.empty().append($('<i>', {
+        class: 'saving fa fa-spinner'
+      }));
+    });
+    $beakerxEl.on(BeakerXTreeEvents.SUBMIT_OPTIONS_STOP, function() {
+      setTimeout(function() {
+        $syncIndicator.empty().append($('<i>', {
+          class: 'saved fa fa-check'
+        }));
+      }, 500);
+    });
+  }
 
-          var opts = {
-            name: "",
-            value: "",
-            parent: parent,
-            add_label: true
-          };
+  function _submitOptions() {
+    var payload = {
+      version: 2,
+      heap_GB: '',
+      jvm_options: {
+        other: [],
+        properties: [],
+      },
+    };
+    var other_property = $('#other_property').find('input');
+
+    other_property.each(function() {
+      var value = $(this).val().trim();
+      if (value.length > 0) {
+        payload.jvm_options.other.push(value);
+      }
+    });
 
-          settings.appendField(opts);
-        });
+    var java_property = $('#properties_property').find('div');
+    java_property.each(function() {
+      var children = $($(this).children());
+      var value = $(children.get(1)).val().trim();
+      var name = $(children.get(0)).val().trim();
 
-        $("#add_option_jvm_sett").click(function (event) {
-          event.preventDefault();
-          var fieldset = $('#other_property');
-          settings.createField(fieldset);
+      if (name.length > 0) {
+        payload.jvm_options.properties.push({
+          'name': name,
+          'value': value,
         });
-        $('#heap_GB').keyup(InpuChanged);
-        $(".tab-content").submit();
-
-        if (window.location.hash === '#beakerx') {
-          $('#beakerx_tab').click();
-        }
       }
+
     });
+
+    try {
+      var val = $('#heap_GB').val().trim();
+      settings.normaliseHeapSize(val);
+      payload.jvm_options.heap_GB = val;
+
+      settings.setVariables(JSON.stringify({
+        'beakerx': payload
+      }));
+      settings.load(payload.jvm_options);
+    } catch (e) {
+    }
+
+  }
+
+  function _onJvmPropertyAddClickedHandler(event) {
+    event.preventDefault();
+
+    settings.appendField({
+      name: '',
+      value: '',
+      parent: $('#properties_property'),
+      add_label: true
+    });
+  }
+
+  function _onJvmOptionAddClickedHandler(event) {
+    event.preventDefault();
+    settings.createField($('#other_property'));
   }
 
   return {