summaryrefslogtreecommitdiffstats
path: root/devtools/client/performance/performance.xul
diff options
context:
space:
mode:
Diffstat (limited to 'devtools/client/performance/performance.xul')
-rw-r--r--devtools/client/performance/performance.xul368
1 files changed, 368 insertions, 0 deletions
diff --git a/devtools/client/performance/performance.xul b/devtools/client/performance/performance.xul
new file mode 100644
index 000000000..c30104b74
--- /dev/null
+++ b/devtools/client/performance/performance.xul
@@ -0,0 +1,368 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- 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/. -->
+<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+<?xml-stylesheet href="chrome://devtools/content/shared/widgets/widgets.css" type="text/css"?>
+<?xml-stylesheet href="chrome://devtools/skin/widgets.css" type="text/css"?>
+<?xml-stylesheet href="chrome://devtools/skin/performance.css" type="text/css"?>
+<?xml-stylesheet href="chrome://devtools/skin/jit-optimizations.css" type="text/css"?>
+<?xml-stylesheet href="chrome://devtools/skin/components-frame.css" type="text/css"?>
+<!DOCTYPE window [
+ <!ENTITY % performanceDTD SYSTEM "chrome://devtools/locale/performance.dtd">
+ %performanceDTD;
+]>
+
+<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+ xmlns:html="http://www.w3.org/1999/xhtml">
+ <script src="chrome://devtools/content/shared/theme-switching.js"/>
+ <script type="application/javascript" src="performance-controller.js"/>
+ <script type="application/javascript" src="performance-view.js"/>
+ <script type="application/javascript" src="views/overview.js"/>
+ <script type="application/javascript" src="views/toolbar.js"/>
+ <script type="application/javascript" src="views/details-abstract-subview.js"/>
+ <script type="application/javascript" src="views/details-waterfall.js"/>
+ <script type="application/javascript" src="views/details-js-call-tree.js"/>
+ <script type="application/javascript" src="views/details-js-flamegraph.js"/>
+ <script type="application/javascript" src="views/details-memory-call-tree.js"/>
+ <script type="application/javascript" src="views/details-memory-flamegraph.js"/>
+ <script type="application/javascript" src="views/details.js"/>
+ <script type="application/javascript" src="views/recordings.js"/>
+
+ <popupset id="performance-options-popupset">
+ <menupopup id="performance-filter-menupopup" position="before_start"/>
+ <menupopup id="performance-options-menupopup" position="before_end">
+ <menuitem id="option-show-platform-data"
+ type="checkbox"
+ data-pref="show-platform-data"
+ label="&performanceUI.showPlatformData;"
+ tooltiptext="&performanceUI.showPlatformData.tooltiptext;"/>
+ <menuitem id="option-show-jit-optimizations"
+ class="experimental-option"
+ type="checkbox"
+ data-pref="show-jit-optimizations"
+ label="&performanceUI.showJITOptimizations;"
+ tooltiptext="&performanceUI.showJITOptimizations.tooltiptext;"/>
+ <menuitem id="option-enable-memory"
+ class="experimental-option"
+ type="checkbox"
+ data-pref="enable-memory"
+ label="&performanceUI.enableMemory;"
+ tooltiptext="&performanceUI.enableMemory.tooltiptext;"/>
+ <menuitem id="option-enable-allocations"
+ type="checkbox"
+ data-pref="enable-allocations"
+ label="&performanceUI.enableAllocations;"
+ tooltiptext="&performanceUI.enableAllocations.tooltiptext;"/>
+ <menuitem id="option-enable-framerate"
+ type="checkbox"
+ data-pref="enable-framerate"
+ label="&performanceUI.enableFramerate;"
+ tooltiptext="&performanceUI.enableFramerate.tooltiptext;"/>
+ <menuitem id="option-invert-call-tree"
+ type="checkbox"
+ data-pref="invert-call-tree"
+ label="&performanceUI.invertTree;"
+ tooltiptext="&performanceUI.invertTree.tooltiptext;"/>
+ <menuitem id="option-invert-flame-graph"
+ type="checkbox"
+ data-pref="invert-flame-graph"
+ label="&performanceUI.invertFlameGraph;"
+ tooltiptext="&performanceUI.invertFlameGraph.tooltiptext;"/>
+ <menuitem id="option-flatten-tree-recursion"
+ type="checkbox"
+ data-pref="flatten-tree-recursion"
+ label="&performanceUI.flattenTreeRecursion;"
+ tooltiptext="&performanceUI.flattenTreeRecursion.tooltiptext;"/>
+ </menupopup>
+ </popupset>
+
+ <hbox id="body" class="theme-body performance-tool" flex="1">
+
+ <!-- Sidebar: controls and recording list -->
+ <vbox id="recordings-pane">
+ <hbox id="recordings-controls">
+ <html:div id='recording-controls-mount'/>
+ </hbox>
+ <vbox id="recordings-list" class="theme-sidebar" flex="1">
+ <html:div id="recording-list-mount"/>
+ </vbox>
+ </vbox>
+
+ <!-- Main panel content -->
+ <vbox id="performance-pane" flex="1">
+
+ <!-- Top toolbar controls -->
+ <toolbar id="performance-toolbar"
+ class="devtools-toolbar">
+ <hbox id="performance-toolbar-controls-other"
+ class="devtools-toolbarbutton-group">
+ <toolbarbutton id="filter-button"
+ class="devtools-toolbarbutton"
+ popup="performance-filter-menupopup"
+ tooltiptext="&performanceUI.options.filter.tooltiptext;"/>
+ </hbox>
+ <hbox id="performance-toolbar-controls-detail-views"
+ class="devtools-toolbarbutton-group">
+ <toolbarbutton id="select-waterfall-view"
+ class="devtools-toolbarbutton devtools-button"
+ label="&performanceUI.toolbar.waterfall;"
+ hidden="true"
+ data-view="waterfall"
+ tooltiptext="&performanceUI.toolbar.waterfall.tooltiptext;" />
+ <toolbarbutton id="select-js-calltree-view"
+ class="devtools-toolbarbutton devtools-button"
+ label="&performanceUI.toolbar.js-calltree;"
+ hidden="true"
+ data-view="js-calltree"
+ tooltiptext="&performanceUI.toolbar.js-calltree.tooltiptext;" />
+ <toolbarbutton id="select-js-flamegraph-view"
+ class="devtools-toolbarbutton devtools-button"
+ label="&performanceUI.toolbar.js-flamegraph;"
+ hidden="true"
+ data-view="js-flamegraph"
+ tooltiptext="&performanceUI.toolbar.js-flamegraph.tooltiptext;" />
+ <toolbarbutton id="select-memory-calltree-view"
+ class="devtools-toolbarbutton devtools-button"
+ label="&performanceUI.toolbar.memory-calltree;"
+ hidden="true"
+ data-view="memory-calltree"
+ tooltiptext="&performanceUI.toolbar.allocations.tooltiptext;" />
+ <toolbarbutton id="select-memory-flamegraph-view"
+ class="devtools-toolbarbutton devtools-button"
+ label="&performanceUI.toolbar.memory-flamegraph;"
+ hidden="true"
+ data-view="memory-flamegraph" />
+ </hbox>
+ <spacer flex="1"></spacer>
+ <hbox id="performance-toolbar-controls-options"
+ class="devtools-toolbarbutton-group">
+ <toolbarbutton id="performance-options-button"
+ class="devtools-toolbarbutton devtools-option-toolbarbutton"
+ popup="performance-options-menupopup"
+ tooltiptext="&performanceUI.options.gear.tooltiptext;"/>
+ </hbox>
+ </toolbar>
+
+ <!-- Recording contents and general notice messages -->
+ <deck id="performance-view" flex="1">
+
+ <!-- A default notice, shown while initially opening the tool.
+ Keep this element the first child of #performance-view. -->
+ <hbox id="tool-loading-notice"
+ class="notice-container"
+ flex="1">
+ </hbox>
+
+ <!-- "Unavailable" notice, shown when the entire tool is disabled,
+ for example, when in private browsing mode. -->
+ <vbox id="unavailable-notice"
+ class="notice-container"
+ align="center"
+ pack="center"
+ flex="1">
+ <hbox pack="center">
+ <html:div class='recording-button-mount'/>
+ </hbox>
+ <description class="tool-disabled-message">
+ &performanceUI.unavailableNoticePB;
+ </description>
+ </vbox>
+
+ <!-- "Empty" notice, shown when there's no recordings available -->
+ <hbox id="empty-notice"
+ class="notice-container"
+ align="center"
+ pack="center"
+ flex="1">
+ <hbox pack="center">
+ <html:div class='recording-button-mount'/>
+ </hbox>
+ </hbox>
+
+ <!-- Recording contents -->
+ <vbox id="performance-view-content" flex="1">
+
+ <!-- Overview graphs -->
+ <vbox id="overview-pane">
+ <hbox id="markers-overview"/>
+ <hbox id="memory-overview"/>
+ <hbox id="time-framerate"/>
+ </vbox>
+
+ <!-- Detail views and specific notice messages -->
+ <deck id="details-pane-container" flex="1">
+
+ <!-- "Loading" notice, shown when a recording is being loaded -->
+ <hbox id="loading-notice"
+ class="notice-container devtools-throbber"
+ align="center"
+ pack="center"
+ flex="1">
+ <label value="&performanceUI.loadingNotice;"/>
+ </hbox>
+
+ <!-- "Recording" notice, shown when a recording is in progress -->
+ <vbox id="recording-notice"
+ class="notice-container"
+ align="center"
+ pack="center"
+ flex="1">
+ <hbox pack="center">
+ <html:div class='recording-button-mount'/>
+ </hbox>
+ <label class="realtime-disabled-message"
+ value="&performanceUI.disabledRealTime.nonE10SBuild;"/>
+ <label class="realtime-disabled-on-e10s-message"
+ value="&performanceUI.disabledRealTime.disabledE10S;"/>
+ <label class="buffer-status-message"
+ tooltiptext="&performanceUI.bufferStatusTooltip;"/>
+ <label class="buffer-status-message-full"
+ value="&performanceUI.bufferStatusFull;"/>
+ </vbox>
+
+ <!-- "Console" notice, shown when a console recording is in progress -->
+ <vbox id="console-recording-notice"
+ class="notice-container"
+ align="center"
+ pack="center"
+ flex="1">
+ <hbox class="console-profile-recording-notice">
+ <label value="&performanceUI.console.recordingNoticeStart;" />
+ <label class="console-profile-command" />
+ <label value="&performanceUI.console.recordingNoticeEnd;" />
+ </hbox>
+ <hbox class="console-profile-stop-notice">
+ <label value="&performanceUI.console.stopCommandStart;" />
+ <label class="console-profile-command" />
+ <label value="&performanceUI.console.stopCommandEnd;" />
+ </hbox>
+ <label class="realtime-disabled-message"
+ value="&performanceUI.disabledRealTime.nonE10SBuild;"/>
+ <label class="realtime-disabled-on-e10s-message"
+ value="&performanceUI.disabledRealTime.disabledE10S;"/>
+ <label class="buffer-status-message"
+ tooltiptext="&performanceUI.bufferStatusTooltip;"/>
+ <label class="buffer-status-message-full"
+ value="&performanceUI.bufferStatusFull;"/>
+ </vbox>
+
+ <!-- Detail views -->
+ <deck id="details-pane" flex="1">
+
+ <!-- Waterfall -->
+ <hbox id="waterfall-view" flex="1">
+ <html:div xmlns="http://www.w3.org/1999/xhtml" id="waterfall-tree" />
+ <splitter class="devtools-side-splitter"/>
+ <vbox id="waterfall-details"
+ class="theme-sidebar"/>
+ </hbox>
+
+ <!-- JS Tree and JIT view -->
+ <hbox id="js-profile-view" flex="1">
+ <vbox id="js-calltree-view" flex="1">
+ <hbox class="call-tree-headers-container">
+ <label class="plain call-tree-header"
+ type="duration"
+ crop="end"
+ value="&performanceUI.table.totalDuration;"
+ tooltiptext="&performanceUI.table.totalDuration.tooltip;"/>
+ <label class="plain call-tree-header"
+ type="percentage"
+ crop="end"
+ value="&performanceUI.table.totalPercentage;"
+ tooltiptext="&performanceUI.table.totalPercentage.tooltip;"/>
+ <label class="plain call-tree-header"
+ type="self-duration"
+ crop="end"
+ value="&performanceUI.table.selfDuration;"
+ tooltiptext="&performanceUI.table.selfDuration.tooltip;"/>
+ <label class="plain call-tree-header"
+ type="self-percentage"
+ crop="end"
+ value="&performanceUI.table.selfPercentage;"
+ tooltiptext="&performanceUI.table.selfPercentage.tooltip;"/>
+ <label class="plain call-tree-header"
+ type="samples"
+ crop="end"
+ value="&performanceUI.table.samples;"
+ tooltiptext="&performanceUI.table.samples.tooltip;"/>
+ <label class="plain call-tree-header"
+ type="function"
+ crop="end"
+ value="&performanceUI.table.function;"
+ tooltiptext="&performanceUI.table.function.tooltip;"/>
+ </hbox>
+ <vbox class="call-tree-cells-container" flex="1"/>
+ </vbox>
+ <splitter class="devtools-side-splitter"/>
+ <!-- Optimizations Panel -->
+ <vbox id="jit-optimizations-view"
+ class="hidden">
+ </vbox>
+ </hbox>
+
+ <!-- JS FlameChart -->
+ <hbox id="js-flamegraph-view" flex="1">
+ </hbox>
+
+ <!-- Memory Tree -->
+ <vbox id="memory-calltree-view" flex="1">
+ <hbox class="call-tree-headers-container">
+ <label class="plain call-tree-header"
+ type="self-size"
+ crop="end"
+ value="Self Bytes"
+ tooltiptext="&performanceUI.table.totalAlloc.tooltip;"/>
+ <label class="plain call-tree-header"
+ type="self-size-percentage"
+ crop="end"
+ value="Self Bytes %"
+ tooltiptext="&performanceUI.table.totalAlloc.tooltip;"/>
+ <label class="plain call-tree-header"
+ type="self-count"
+ crop="end"
+ value="Self Count"
+ tooltiptext="&performanceUI.table.totalAlloc.tooltip;"/>
+ <label class="plain call-tree-header"
+ type="self-count-percentage"
+ crop="end"
+ value="Self Count %"
+ tooltiptext="&performanceUI.table.totalAlloc.tooltip;"/>
+ <label class="plain call-tree-header"
+ type="size"
+ crop="end"
+ value="Total Size"
+ tooltiptext="&performanceUI.table.totalAlloc.tooltip;"/>
+ <label class="plain call-tree-header"
+ type="size-percentage"
+ crop="end"
+ value="Total Size %"
+ tooltiptext="&performanceUI.table.totalAlloc.tooltip;"/>
+ <label class="plain call-tree-header"
+ type="count"
+ crop="end"
+ value="Total Count"
+ tooltiptext="&performanceUI.table.totalAlloc.tooltip;"/>
+ <label class="plain call-tree-header"
+ type="count-percentage"
+ crop="end"
+ value="Total Count %"
+ tooltiptext="&performanceUI.table.totalAlloc.tooltip;"/>
+ <label class="plain call-tree-header"
+ type="function"
+ crop="end"
+ value="&performanceUI.table.function;"/>
+ </hbox>
+ <vbox class="call-tree-cells-container" flex="1"/>
+ </vbox>
+
+ <!-- Memory FlameChart -->
+ <hbox id="memory-flamegraph-view" flex="1"></hbox>
+ </deck>
+ </deck>
+ </vbox>
+ </deck>
+ </vbox>
+ </hbox>
+</window>