Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(19)

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: tools/binary_size/template/index.html

Issue 119083006: Add tool to help analyze binary size (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Rebase onto master for a clean commit of gyp change Created 6 years, 11 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
« tools/binary_size/run_binary_size_analysis.py ('K') | « tools/binary_size/template/.gitignore ('k') | no next file » | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: tools/binary_size/template/index.html
diff --git a/tools/binary_size/template/index.html b/tools/binary_size/template/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..f361c9d237ba16565f96a68faaa4f1a8134e6661
--- /dev/null
+++ b/tools/binary_size/template/index.html
@@ -0,0 +1,190 @@
+<!DOCTYPE html>
+<!--
+ Copyright 2014 The Chromium Authors. All rights reserved.
+ Use of this source code is governed by a BSD-style license that can be
+ found in the LICENSE file.
+-->
+<html>
+<head>
+ <title>Binary Size Analysis</title>
+ <link rel='stylesheet' href='webtreemap/webtreemap.css'>
+ <style>
+ body { font-family: sans-serif; }
+ tt, pre { font-family: WebKitWorkaround, monospace; }
+ #map {
+ margin: 0 auto;
+ position: relative;
+ cursor: pointer;
+ -webkit-user-select: none;
+ }
+ #table {
+ border: 1px solid black;
+ }
+ .treemaplegend {
+ margin: 0 auto;
+ position: relative;
+ }
+ .webtreemap-symbol-vtable {
+ background: #FFFFAA;
+ }
+ .webtreemap-node:hover {
+ border-color: red;
+ background: linear-gradient(rgb(240,240,200), rgb(180,180,200));
+ }
+ </style>
+ <script src='webtreemap/webtreemap.js'></script>
+ <script src='treemap-dump.js'></script>
+ <script src='largest-symbols.js'></script>
+ <script src='largest-sources.js'></script>
+ <script src='largest-vtables.js'></script>
+</head>
+<body onload='show_report_treemap()'>
+<div style='text-align: center; margin-bottom: 2em;'>
+ <h1>Binary Size Analysis</h1>
+ <a href='#' onclick='show_report_treemap()'>Spatial Treemap</a>
+ ~
+ <a href='#' onclick='show_report_largest_sources()'>Largest Sources</a>
+ ~
+ <a href='#' onclick='show_report_largest_symbols()'>Largest Symbols</a>
+ ~
+ <a href='#' onclick='show_report_largest_vtables()'>Largest VTables</a>
+</div>
+<div id='report'></div>
+<script>
+function escape(str) {
+ return str.replace(/&/g, '&amp;')
+ .replace(/"/g, '&quot;')
+ .replace(/</g, '&lt;')
+ .replace(/>/g, '&gt;');
+}
+
+var treemap_width = 800;
+var treemap_height = 450;
+function show_report_treemap() {
+ console.log('displaying treemap')
+ var div = document.getElementById('report');
+ var w = window.treemap_width;
+ var h = window.treemap_height;
+ div.innerHTML = '<div style=\'text-align: center;\'>' +
+ '<button onclick=\'zoomInTreemap()\'>Zoom In</button>' +
+ ', <button onclick=\'zoomOutTreemap()\'>Zoom Out</button>' +
+ ' or resize to: ' +
+ '<input type=text size=5 id=treemap_width value=' + w + '>x' +
+ '<input type=text size=5 id=treemap_height value=' + h + '>' +
+ '<button onclick=\'resizeTreemap()\'>Go</button>' +
+ '<br><em>Click on a box to zoom in. ' +
+ 'Click on the outermost box to zoom out.</em>' +
+ '<br>Legend: <table border=1 class=\'treemaplegend\' cellborder=1><tr>' +
+ '<td class=\'webtreemap-symbol-bss\'>BSS</td>' +
+ '<td class=\'webtreemap-symbol-data\'>Data</td>' +
+ '<td class=\'webtreemap-symbol-code\'>Code</td>' +
+ '<td class=\'webtreemap-symbol-read-only_data\'>RO Data</td>' +
+ '<td class=\'webtreemap-symbol-weak_symbol\'>Weak</td>' +
+ '<td class=\'webtreemap-symbol-vtable\'>VTable</td>' +
+ '</tr></table>' +
+ '<br>' +
+ '<div id=\'map\' ' +
+ 'style=\'width: ' + w + 'px; height: ' + h + 'px;\'>' +
+ '</div></div>';
+ var map = document.getElementById('map');
+ appendTreemap(map, kTree);
+}
+
+function zoomInTreemap() {
+ window.treemap_width = Math.round(window.treemap_width * 1.25);
+ window.treemap_height = Math.round(window.treemap_height * 1.25);
+ show_report_treemap();
+}
+
+function zoomOutTreemap() {
+ window.treemap_width = Math.round(window.treemap_width / 1.25);
+ window.treemap_height = Math.round(window.treemap_height / 1.25);
+ show_report_treemap();
+}
+
+function resizeTreemap() {
+ window.treemap_width = document.getElementById('treemap_width').value;
+ window.treemap_height = document.getElementById('treemap_height').value;
+ show_report_treemap();
+}
+
+function show_report_largest_symbols() {
+ console.log('displaying largest-symbols report')
+ var div = document.getElementById('report');
+ div.innerHTML = '<div><table id=\'list\' border=1><tr>' +
+ '<th>Rank</th><th>Size</th><th>Type</th><th>Source</th>' +
+ '</tr></table>';
+ var list = document.getElementById('list');
+ for (var i = 0; i < largestSymbols.length; i++) {
+ var record = largestSymbols[i];
+ var link;
+ if (record.location.indexOf('out') == 0) {
+ link = record.location;
+ } else {
+ link = '<a href="https://code.google.com/p/chromium/codesearch#chromium/src/'
+ + record.location + '">' + escape(record.location) + '</a>';
+ }
+ list.innerHTML += '<tr>'
+ + '<td>' + (i+1) + '</td>'
+ + '<td>' + escape(record.size) + '</td>'
+ + '<td style=\'white-space: nowrap;\'>' + escape(record.type) + '</td>'
+ + '<td>' + link + ':<br>'
+ + escape(record.symbol) + '</td>'
+ + '</tr>';
+ }
+}
+
+function show_report_largest_sources() {
+ console.log('displaying largest-sources report')
+ var div = document.getElementById('report');
+ div.innerHTML = '<div><table id=\'list\' border=1><tr>' +
+ '<th>Rank</th><th>Size</th><th>Symbol Count</th><th>Source</th>' +
+ '</tr></table>';
+ var list = document.getElementById('list');
+ for (var i = 0; i < largestSources.length; i++) {
+ var record = largestSources[i];
+ var link;
+ if (record.location.indexOf('out') == 0) {
+ link = record.location;
+ } else {
+ link = '<a href="https://code.google.com/p/chromium/codesearch#chromium/src/'
+ + record.location + '">' + escape(record.location) + '</a>';
+ }
+
+ list.innerHTML += '<tr>'
+ + '<td>' + (i+1) + '</td>'
+ + '<td>' + escape(record.size) + '</td>'
+ + '<td>' + escape(record.symbol_count) + '</td>'
+ + '<td>' + link + '</td>'
+ + '</tr>';
+ }
+}
+
+function show_report_largest_vtables() {
+ console.log('displaying largest-vtables report')
+ var div = document.getElementById('report');
+ div.innerHTML = '<div><table id=\'list\' border=1><tr>' +
+ '<th>Rank</th><th>Size</th><th>Symbol</th><th>Source</th>' +
+ '</tr></table>';
+ var list = document.getElementById('list');
+ for (var i = 0; i < largestVTables.length; i++) {
+ var record = largestVTables[i];
+ var link;
+ if (record.location.indexOf('out') == 0) {
+ link = record.location;
+ } else {
+ link = '<a href="https://code.google.com/p/chromium/codesearch#chromium/src/'
+ + record.location + '">' + escape(record.location) + '</a>';
+ }
+
+ list.innerHTML += '<tr>'
+ + '<td>' + (i+1) + '</td>'
+ + '<td>' + escape(record.size) + '</td>'
+ + '<td>' + escape(record.symbol) + '</td>'
+ + '<td>' + link + '</td>'
+ + '</tr>';
+ }
+}
+</script>
+</body>
+</html>
« tools/binary_size/run_binary_size_analysis.py ('K') | « tools/binary_size/template/.gitignore ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698