--- a/devtools/client/performance/performance-view.js
+++ b/devtools/client/performance/performance-view.js
@@ -15,35 +15,41 @@ var PerformanceView = {
   // that the server has support for determining buffer status.
   _bufferStatusSupported: false,
 
   // Mapping of state to selectors for different properties and their values,
   // from the main profiler view. Used in `PerformanceView.setState()`
   states: {
     "unavailable": [
       { sel: "#performance-view", opt: "selectedPanel", val: () => $("#unavailable-notice") },
+      { sel: "#performance-view-content", opt: "hidden", val: () => true },
     ],
     "empty": [
-      { sel: "#performance-view", opt: "selectedPanel", val: () => $("#empty-notice") }
+      { sel: "#performance-view", opt: "selectedPanel", val: () => $("#empty-notice") },
+      { sel: "#performance-view-content", opt: "hidden", val: () => true },
     ],
     "recording": [
       { sel: "#performance-view", opt: "selectedPanel", val: () => $("#performance-view-content") },
-      { sel: "#details-pane-container", opt: "selectedPanel", val: () => $("#recording-notice") }
+      { sel: "#performance-view-content", opt: "hidden", val: () => false },
+      { sel: "#details-pane-container", opt: "selectedPanel", val: () => $("#recording-notice") },
     ],
     "console-recording": [
       { sel: "#performance-view", opt: "selectedPanel", val: () => $("#performance-view-content") },
-      { sel: "#details-pane-container", opt: "selectedPanel", val: () => $("#console-recording-notice") }
+      { sel: "#performance-view-content", opt: "hidden", val: () => false },
+      { sel: "#details-pane-container", opt: "selectedPanel", val: () => $("#console-recording-notice") },
     ],
     "recorded": [
       { sel: "#performance-view", opt: "selectedPanel", val: () => $("#performance-view-content") },
-      { sel: "#details-pane-container", opt: "selectedPanel", val: () => $("#details-pane") }
+      { sel: "#performance-view-content", opt: "hidden", val: () => false },
+      { sel: "#details-pane-container", opt: "selectedPanel", val: () => $("#details-pane") },
     ],
     "loading": [
       { sel: "#performance-view", opt: "selectedPanel", val: () => $("#performance-view-content") },
-      { sel: "#details-pane-container", opt: "selectedPanel", val: () => $("#loading-notice") }
+      { sel: "#performance-view-content", opt: "hidden", val: () => false },
+      { sel: "#details-pane-container", opt: "selectedPanel", val: () => $("#loading-notice") },
     ]
   },
 
   /**
    * Sets up the view with event binding and main subviews.
    */
   initialize: Task.async(function* () {
     this._recordButton = $("#main-record-button");