diff options
Diffstat (limited to 'devtools/client/performance/index.xhtml')
| -rw-r--r-- | devtools/client/performance/index.xhtml | 354 |
1 files changed, 354 insertions, 0 deletions
diff --git a/devtools/client/performance/index.xhtml b/devtools/client/performance/index.xhtml new file mode 100644 index 0000000000..4ef54d0662 --- /dev/null +++ b/devtools/client/performance/index.xhtml @@ -0,0 +1,354 @@ +<?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/global.css" type="text/css"?> +<?xml-stylesheet href="chrome://devtools/content/shared/widgets/widgets.css" type="text/css"?> +<?xml-stylesheet href="chrome://devtools/content/shared/toolbarbutton.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 src="resource://devtools/client/performance/initializer.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" + label="&performanceUI.toolbar.waterfall;" + hidden="true" + data-view="waterfall" + tooltiptext="&performanceUI.toolbar.waterfall.tooltiptext;" /> + <toolbarbutton id="select-js-calltree-view" + class="devtools-toolbarbutton" + 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" + 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" + 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" + 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-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-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> |