| Chris Craik | 44c2820 | 2015-05-12 17:25:16 -0700 | [diff] [blame^] | 1 | <!DOCTYPE html> |
| 2 | <!-- |
| 3 | Copyright (c) 2015 The Chromium Authors. All rights reserved. |
| 4 | Use of this source code is governed by a BSD-style license that can be |
| 5 | found in the LICENSE file. |
| 6 | --> |
| 7 | |
| 8 | <link rel="import" href="/base/ui/color_legend.html"> |
| 9 | <link rel="import" href="/core/analysis/memory_dump_sub_view_util.html"> |
| 10 | <link rel="import" href="/core/analysis/size_span.html"> |
| 11 | <link rel="import" href="/core/analysis/table_builder.html"> |
| 12 | <link rel="import" href="/core/trace_model/attribute.html"> |
| 13 | |
| 14 | <polymer-element name="tv-c-memory-dump-overview-pane"> |
| 15 | <template> |
| 16 | <style> |
| 17 | :host { |
| 18 | display: flex; |
| 19 | flex-direction: column; |
| 20 | } |
| 21 | |
| 22 | #label { |
| 23 | flex: 0 0 auto; |
| 24 | padding: 8px; |
| 25 | |
| 26 | background-color: #eee; |
| 27 | border-bottom: 1px solid #8e8e8e; |
| 28 | border-top: 1px solid white; |
| 29 | |
| 30 | font-size: 15px; |
| 31 | font-weight: bold; |
| 32 | } |
| 33 | |
| 34 | #table { |
| 35 | flex: 1 1 auto; |
| 36 | align-self: stretch; |
| 37 | } |
| 38 | </style> |
| 39 | <div id="label">Overview</div> |
| 40 | <tracing-analysis-nested-table id="table"> |
| 41 | </tracing-analysis-nested-table> |
| 42 | </template> |
| 43 | <script> |
| 44 | 'use strict'; |
| 45 | |
| 46 | Polymer({ |
| 47 | // TODO(petrcermak): Consider sharing more code between |
| 48 | // tv-c-memory-dump-overview-pane and tv-c-memory-dump-process pane |
| 49 | // (e.g. by defining a common base class tv-c-memory-dump-pane). |
| 50 | |
| 51 | created: function() { |
| 52 | this.processMemoryDumps_ = undefined; |
| 53 | }, |
| 54 | |
| 55 | ready: function() { |
| 56 | this.$.table.supportsSelection = true; |
| 57 | this.$.table.cellSelectionMode = true; |
| 58 | this.$.table.addEventListener('selection-changed', function(tableEvent) { |
| 59 | tableEvent.stopPropagation(); |
| 60 | var paneEvent = new Event('selected-memory-dump-changed', false, false); |
| 61 | this.dispatchEvent(paneEvent); |
| 62 | }.bind(this)); |
| 63 | }, |
| 64 | |
| 65 | set processMemoryDumps(processMemoryDumps) { |
| 66 | this.processMemoryDumps_ = processMemoryDumps; |
| 67 | this.updateContents_(); |
| 68 | }, |
| 69 | |
| 70 | get processMemoryDumps() { |
| 71 | return this.processMemoryDumps_; |
| 72 | }, |
| 73 | |
| 74 | get selectedMemoryDump() { |
| 75 | var selectedTableRow = this.$.table.selectedTableRow; |
| 76 | if (!selectedTableRow) |
| 77 | return undefined; |
| 78 | |
| 79 | var selectedColumnIndex = this.$.table.selectedColumnIndex; |
| 80 | if (selectedColumnIndex === undefined) |
| 81 | return undefined; |
| 82 | |
| 83 | var selectedColumn = this.$.table.tableColumns[selectedColumnIndex]; |
| 84 | var selectedCell = selectedColumn.cell(selectedTableRow); |
| 85 | if (!selectedCell) |
| 86 | return undefined; |
| 87 | |
| 88 | return selectedCell.dump; |
| 89 | }, |
| 90 | |
| 91 | updateContents_: function() { |
| 92 | var processMemoryDumps = this.processMemoryDumps_ || []; |
| 93 | |
| 94 | var rows = processMemoryDumps.map(function(processMemoryDump) { |
| 95 | // Used memory (proportional, private, and shared resident) |
| 96 | var usedMemorySizes = {}; |
| 97 | function addUsedMemorySize(columnKey, dumpKey) { |
| 98 | var value = processMemoryDump[dumpKey]; |
| 99 | if (value !== undefined) { |
| 100 | usedMemorySizes[columnKey] = new tv.c.analysis.MemoryCell( |
| 101 | new tv.c.trace_model.ScalarAttribute('bytes', value)); |
| 102 | } |
| 103 | } |
| 104 | addUsedMemorySize('proportional_resident', |
| 105 | 'mostRecentTotalProportionalResidentSizeInBytes'); |
| 106 | addUsedMemorySize('private_resident', |
| 107 | 'mostRecentTotalPrivateResidentSizeInBytes'); |
| 108 | addUsedMemorySize('shared_resident', |
| 109 | 'mostRecentTotalSharedResidentSizeInBytes'); |
| 110 | |
| 111 | // Allocator memory (v8, oilpan, ...). |
| 112 | var allocatorSizes = {}; |
| 113 | if (processMemoryDump.memoryAllocatorDumps !== undefined) { |
| 114 | processMemoryDump.memoryAllocatorDumps.forEach(function(dump) { |
| 115 | var cell = new tv.c.analysis.MemoryCell( |
| 116 | dump.attributes['outer_size']); |
| 117 | cell.dump = dump; |
| 118 | allocatorSizes[dump.fullName] = cell; |
| 119 | }, this); |
| 120 | } |
| 121 | |
| 122 | return { |
| 123 | title: processMemoryDump.process.userFriendlyName, |
| 124 | usedMemorySizes: usedMemorySizes, |
| 125 | allocatorSizes: allocatorSizes |
| 126 | }; |
| 127 | }, this); |
| 128 | this.$.table.tableRows = rows; |
| 129 | |
| 130 | this.updateColumns_(rows); |
| 131 | |
| 132 | this.$.table.rebuild(); |
| 133 | }, |
| 134 | |
| 135 | updateColumns_: function(rows) { |
| 136 | var titleColumn = { |
| 137 | title: 'Process', |
| 138 | value: function(row) { |
| 139 | var titleEl = document.createElement('tv-b-color-legend'); |
| 140 | titleEl.label = row.title; |
| 141 | return titleEl; |
| 142 | }, |
| 143 | width: '200px', |
| 144 | cmp: function(rowA, rowB) { |
| 145 | return rowA.title.localeCompare(rowB.title); |
| 146 | }, |
| 147 | supportsCellSelection: false |
| 148 | }; |
| 149 | |
| 150 | var usedMemorySizeColumns = tv.c.analysis.MemoryColumn.fromRows( |
| 151 | rows, 'usedMemorySizes'); |
| 152 | var allocatorSizeColumns = tv.c.analysis.MemoryColumn.fromRows( |
| 153 | rows, 'allocatorSizes'); |
| 154 | |
| 155 | var sizeColumns = usedMemorySizeColumns.concat(allocatorSizeColumns); |
| 156 | tv.c.analysis.MemoryColumn.spaceEqually(sizeColumns); |
| 157 | |
| 158 | var columns = [titleColumn].concat(sizeColumns); |
| 159 | this.$.table.tableColumns = columns; |
| 160 | } |
| 161 | }); |
| 162 | </script> |
| 163 | </polymer-element> |