--- a/devtools/client/inspector/boxmodel/box-model.js
+++ b/devtools/client/inspector/boxmodel/box-model.js
@@ -1,25 +1,23 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 "use strict";
 
-const { getCssProperties } = require("devtools/shared/fronts/css-properties");
-
-const { InplaceEditor } = require("devtools/client/shared/inplace-editor");
-
 const {
   updateGeometryEditorEnabled,
   updateLayout,
   updateOffsetParent,
 } = require("./actions/box-model");
 
-const EditingSession = require("./utils/editing-session");
+loader.lazyRequireGetter(this, "EditingSession", "devtools/client/inspector/boxmodel/utils/editing-session");
+loader.lazyRequireGetter(this, "InplaceEditor", "devtools/client/shared/inplace-editor", true);
+loader.lazyRequireGetter(this, "getCssProperties", "devtools/shared/fronts/css-properties", true);
 
 const NUMERIC = /^-?[\d\.]+$/;
 
 /**
  * A singleton instance of the box model controllers.
  *
  * @param  {Inspector} inspector
  *         An instance of the Inspector currently loaded in the toolbox.

--- a/devtools/client/inspector/boxmodel/utils/editing-session.js
+++ b/devtools/client/inspector/boxmodel/utils/editing-session.js
@@ -1,15 +1,15 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 "use strict";
 
-const { getCssProperties } = require("devtools/shared/fronts/css-properties");
+loader.lazyRequireGetter(this, "getCssProperties", "devtools/shared/fronts/css-properties", true);
 
 /**
  * An instance of EditingSession tracks changes that have been made during the
  * modification of box model values. All of these changes can be reverted by
  * calling revert.
  *
  * @param  {InspectorPanel} inspector
  *         The inspector panel.
@@ -17,22 +17,30 @@ const { getCssProperties } = require("de
  *         A DOM document that can be used to test style rules.
  * @param  {Array} rules
  *         An array of the style rules defined for the node being
  *         edited. These should be in order of priority, least
  *         important first.
  */
 function EditingSession({inspector, doc, elementRules}) {
   this._doc = doc;
+  this._inspector = inspector;
   this._rules = elementRules;
   this._modifications = new Map();
-  this._cssProperties = getCssProperties(inspector.toolbox);
 }
 
 EditingSession.prototype = {
+  get cssProperties() {
+    if (!this._cssProperties) {
+      this._cssProperties = getCssProperties(this._inspector.toolbox);
+    }
+
+    return this._cssProperties;
+  },
+
   /**
    * Gets the value of a single property from the CSS rule.
    *
    * @param  {StyleRuleFront} rule
    *         The CSS rule.
    * @param  {String} property
    *         The name of the property.
    * @return {String} the value.
@@ -107,18 +115,17 @@ EditingSession.prototype = {
    * @return {Promise} Resolves when the modifications are complete.
    */
   async setProperties(properties) {
     for (let property of properties) {
       // Get a RuleModificationList or RuleRewriter helper object from the
       // StyleRuleActor to make changes to CSS properties.
       // Note that RuleRewriter doesn't support modifying several properties at
       // once, so we do this in a sequence here.
-      let modifications = this._rules[0].startModifyingProperties(
-        this._cssProperties);
+      let modifications = this._rules[0].startModifyingProperties(this.cssProperties);
 
       // Remember the property so it can be reverted.
       if (!this._modifications.has(property.name)) {
         this._modifications.set(property.name,
           this.getPropertyFromRule(this._rules[0], property.name));
       }
 
       // Find the index of the property to be changed, or get the next index to
@@ -142,18 +149,17 @@ EditingSession.prototype = {
    * Reverts all of the property changes made by this instance.
    *
    * @return {Promise} Resolves when all properties have been reverted.
    */
   async revert() {
     // Revert each property that we modified previously, one by one. See
     // setProperties for information about why.
     for (let [property, value] of this._modifications) {
-      let modifications = this._rules[0].startModifyingProperties(
-        this._cssProperties);
+      let modifications = this._rules[0].startModifyingProperties(this.cssProperties);
 
       // Find the index of the property to be reverted.
       let index = this.getPropertyIndex(property);
 
       if (value != "") {
         // If the property doesn't exist anymore, insert at the beginning of the
         // rule.
         if (index === -1) {
@@ -169,15 +175,19 @@ EditingSession.prototype = {
         modifications.removeProperty(index, property);
       }
 
       await modifications.apply();
     }
   },
 
   destroy: function() {
+    this._modifications.clear();
+
+    this._cssProperties = null;
     this._doc = null;
+    this._inspector = null;
+    this._modifications = null;
     this._rules = null;
-    this._modifications.clear();
   }
 };
 
 module.exports = EditingSession;