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..c4dacfa3f4993715710ba5a82fed2ea60aebc333 |
--- /dev/null |
+++ b/tools/binary_size/template/index.html |
@@ -0,0 +1,108 @@ |
+<!DOCTYPE html> |
+<html> |
+<head> |
+ <title>Binary Size Analysis</title> |
+ <link rel='stylesheet' href='webtreemap.css'> |
+ <style> |
+ body { font-family: sans-serif; } |
+ tt, pre { font-family: WebKitWorkaround, monospace; } |
+ #map { |
+ width: 95%; |
+ margin: 0 auto; |
+ height: 500px; |
+ position: relative; |
+ cursor: pointer; |
+ -webkit-user-select: none; |
+ } |
+ #table { |
+ border: 1px solid black; |
+ } |
+ </style> |
+ <script src='webtreemap.js'></script> |
+ <script src='treemap-dump.js'></script> |
+ <script src='largest-symbols.js'></script> |
+ <script src='largest-sources.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> |
+</div> |
+<div id='report'></div> |
+<script> |
+function escape(str) { |
+ return str.replace(/&/g, '&') |
+ .replace(/"/g, '"') |
+ .replace(/</g, '<') |
+ .replace(/>/g, '>'); |
+} |
+ |
+function show_report_treemap() { |
+ console.log('displaying treemap') |
+ var div = document.getElementById('report'); |
+ div.innerHTML = '<div style=\'text-align: center;\'>' + |
+ '<em>Click on a box to zoom in. ' + |
+ 'Click on the outermost box to zoom out.</em>' + |
+ '<div id=\'map\'></div></div>'; |
+ var map = document.getElementById('map'); |
+ appendTreemap(map, kTree); |
+} |
+ |
+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>' + 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>'; |
+ } |
+} |
+</script> |
+</body> |
+</html> |