blob: a0ca89778411e826f5dabed969ae73b01805e8a1 [file] [log] [blame]
<!DOCTYPE html><html><head><script src="packages/shadow_dom/shadow_dom.debug.js"></script>
<script src="packages/custom_element/custom-elements.debug.js"></script>
<script src="packages/browser/interop.js"></script>
<title>Dart VM Observatory</title>
<meta charset="utf-8">
<link type="text/css" rel="stylesheet" href="bootstrap_css/css/bootstrap.min.css">
<script src="index.html_bootstrap.dart.js"></script>
</head>
<body><polymer-element name="observatory-element">
</polymer-element><polymer-element name="breakpoint-list" extends="observatory-element">
<template>
<template if="{{ msg['breakpoints'].isEmpty }}">
<div class="panel panel-warning">
<div class="panel-body">No breakpoints</div>
</div>
</template>
<template if="{{ msg['breakpoints'].isNotEmpty }}">
<ul class="list-group">
<template repeat="{{ bpt in msg['breakpoints'] }}">
<li class="list-group-item">
{{ bpt }}
</li>
</template>
</ul>
</template>
</template>
</polymer-element><polymer-element name="service-ref" extends="observatory-element">
</polymer-element><polymer-element name="class-ref" extends="service-ref">
<template>
<a title="{{ hoverText }}" href="{{ url }}">{{ name }}</a>
</template>
</polymer-element>
<polymer-element name="error-view" extends="observatory-element">
<template>
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-danger">
<div class="panel-heading">{{ error['errorType'] }}</div>
<div class="panel-body">
<p>{{ error['text'] }}</p>
</div>
</div>
</div>
</div>
</template>
</polymer-element><polymer-element name="field-ref" extends="service-ref">
<template>
<div>
<template if="{{ ref['final'] }}"> final </template>
<template if="{{ ref['const'] }}"> const </template>
<template if="{{ (ref['declared_type']['name'] == 'dynamic' &amp;&amp; !ref['final'] &amp;&amp; !ref['const']) }}">
var
</template>
<template if="{{ (ref['declared_type']['name'] != 'dynamic') }}">
<class-ref app="{{ app }}" ref="{{ ref['declared_type'] }}"></class-ref>
</template>
<a title="{{ hoverText }}" href="{{ url }}">{{ name }}</a>
</div>
</template> </polymer-element><polymer-element name="function-ref" extends="service-ref">
<template>
<a title="{{ hoverText }}" href="{{ url }}">{{ name }}</a>
</template>
</polymer-element><polymer-element name="instance-ref" extends="service-ref">
<template>
<div>
<template if="{{ (ref['type'] == 'null') }}">
{{ "null" }}
</template>
<template if="{{ (ref['type'] != 'null') }}">
<a href="{{ url }}">{{ name }} </a>
</template>
</div>
</template>
</polymer-element><polymer-element name="library-ref" extends="service-ref">
<template>
<a href="{{ url }}">{{ name }}</a>
</template>
</polymer-element><polymer-element name="class-view" extends="observatory-element">
<template>
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-warning">
<div class="panel-heading">
class <strong>{{ cls['user_name'] }}</strong>
<template if="{{ cls['super']['type'] != 'Null' }}">
extends
<class-ref app="{{ app }}" ref="{{ cls['super'] }}"></class-ref>
</template>
<library-ref app="{{ app }}" ref="{{ cls['library'] }}"></library-ref>
</div>
<div class="panel-body">
<table class="table table-hover">
<tbody>
<tr>
<td>Abstract</td><td>{{ cls['abstract'] }}</td>
</tr>
<tr>
<td>Const</td><td>{{ cls['const'] }}</td>
</tr>
<tr>
<td>Finalized</td><td>{{ cls['const'] }}</td>
</tr>
<tr>
<td>Implemented</td><td>{{ cls['implemented'] }}</td>
</tr>
<tr>
<td>Patch</td><td>{{ cls['patch'] }}</td>
</tr>
<tr>
<td>VM Name</td><td>{{ cls['name'] }}</td>
</tr>
</tbody>
</table>
<template if="{{ cls['error'] == null }}">
<blockquote><strong>Fields</strong></blockquote>
<table class="table table-hover">
<tbody>
<tr template="" repeat="{{ field in cls['fields'] }}">
<td><field-ref app="{{ app }}" ref="{{ field }}"></field-ref></td>
<td><instance-ref app="{{ app }}" ref="{{ field['value'] }}"></instance-ref></td>
</tr>
</tbody>
</table>
<blockquote><strong>Functions</strong></blockquote>
<table class="table table-hover">
<thead>
<tr>
<th>User Name</th>
<th>VM Name</th>
</tr>
</thead>
<tbody>
<tr template="" repeat="{{ function in cls['functions'] }}">
<td><function-ref app="{{ app }}" ref="{{ function }}"></function-ref></td>
<td><function-ref app="{{ app }}" ref="{{ function }}" internal=""></function-ref></td>
</tr>
</tbody>
</table>
</template>
<template if="{{ cls['error'] != null }}">
<error-view error_obj="{{ cls['error'] }}"></error-view>
</template>
</div>
</div>
</div>
</div>
</template>
</polymer-element>
<polymer-element name="code-ref" extends="service-ref">
<template>
<a href="{{ url }}">{{ name }}</a>
</template>
</polymer-element><polymer-element name="disassembly-entry" extends="observatory-element">
<template>
<div class="row">
<div class="col-md-2">{{ instruction.formattedTicks() }}</div>
<div class="col-md-2">{{ instruction.formattedAddress() }}</div>
<div class="col-md-4">
<code>{{ instruction.machine }} {{ instruction.human }}</code>
</div>
</div>
</template>
</polymer-element><polymer-element name="code-view" extends="observatory-element">
<template>
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="{{ cssPanelClass }}">
<div class="panel-heading">
<function-ref app="{{ app }}" ref="{{ code.functionRef }}"></function-ref>
</div>
<div class="panel-body">
<div class="row">
<div class="col-md-2"><strong>Samples</strong></div>
<div class="col-md-2"><strong>Address</strong></div>
<div><strong>Instruction</strong></div>
</div>
<template repeat="{{ instruction in code.instructions }}">
<disassembly-entry instruction="{{ instruction }}">
</disassembly-entry>
</template>
</div>
</div>
</div>
</div>
</template>
</polymer-element><polymer-element name="collapsible-content" extends="observatory-element">
<template>
<div class="well row">
<a on-click="toggleDisplay" class="btn muted unselectable">
Raw message... <i class="{{ iconClass }}"></i>
</a>
<div style="display: {{ displayValue }}" class="well">
<content></content>
</div>
</div>
</template>
</polymer-element><polymer-element name="field-view" extends="observatory-element">
<template>
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-warning">
<div class="panel-heading">
<template if="{{ field['static'] }}">static</template>
<template if="{{ field['final'] }}">final</template>
<template if="{{ field['const'] }}">const</template>
{{ field['user_name'] }} ({{ field['name'] }})
<class-ref app="{{ app }}" ref="{{ field['class'] }}"></class-ref>
</div>
<div class="panel-body">
<template if="{{ field['guard_class'] == 'dynamic'}}">
<div class="alert alert-danger">
Field has been assigned multiple types. If a field is only ever
assigned a single type, performance may improve.
</div>
</template>
<template if="{{ (field['guard_class'] != 'dynamic') &amp;&amp; (field['guard_class'] != 'unknown') }}">
<div class="alert alert-success">Field has monomorphic type</div>
<template if="{{ (field['guard_class'] != 'dynamic') &amp;&amp;
field['guard_nullable'] }}">
<div class="alert alert-info">
Field has been assigned null. If a field is never assigned null,
performance may improve.
</div>
</template>
<blockquote>
<class-ref app="{{ app }}" ref="{{ field['guard_class'] }}"></class-ref>
</blockquote>
</template>
</div>
</div>
</div>
</div>
</template>
</polymer-element><polymer-element name="function-view" extends="observatory-element">
<template>
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-warning">
<div class="panel-heading">
{{ function['user_name'] }} ({{ function['name'] }})
<class-ref app="{{ app }}" ref="{{ function['class'] }}"></class-ref>
</div>
<div class="panel-body">
<div>
<code-ref app="{{ app }}" ref="{{ function['code'] }}"></code-ref>
<code-ref app="{{ app }}" ref="{{ function['unoptimized_code'] }}"></code-ref>
</div>
<table class="table table-hover">
<tbody>
<tr>
<td>static</td><td>{{ function['is_static'] }}</td>
</tr>
<tr>
<td>Const</td><td>{{ function['is_const'] }}</td>
</tr>
<tr>
<td>Optimizable</td><td>{{ function['is_optimizable'] }}</td>
</tr>
<tr>
<td>Inlinable</td><td>{{ function['is_inlinable'] }}</td>
</tr>
<tr>
<td>Kind</td><td>{{ function['kind'] }}</td>
</tr>
<tr>
<td>Usage Count</td><td>{{ function['usage_counter'] }}</td>
</tr>
<tr>
<td>Optimized Call Site Count</td><td>{{ function['optimized_call_site_count'] }}</td>
</tr>
<tr>
<td>Deoptimizations</td><td>{{ function['deoptimizations'] }}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</template>
</polymer-element><polymer-element name="isolate-summary" extends="observatory-element">
<template>
<div class="row">
<div class="col-md-1">
<img src="img/isolate_icon.png" class="img-polaroid">
</div>
<div class="col-md-1">{{ isolate }}</div>
<div class="col-md-10">{{ name }}</div>
</div>
<div class="row">
<div class="col-md-2"></div>
<div class="col-md-1">
<a href="{{ app.locationManager.relativeLink(isolate, 'stacktrace') }}">Stacktrace</a>
</div>
<div class="col-md-1">
<a href="{{ app.locationManager.relativeLink(isolate, 'library') }}">Library</a>
</div>
<div class="col-md-1">
<a href="{{ app.locationManager.relativeLink(isolate, 'debug/breakpoints') }}">Breakpoints</a>
</div>
<div class="col-md-1">
<a href="{{ app.locationManager.relativeLink(isolate, 'profile') }}">Profile</a>
</div>
<div class="col-md-1">
<a href="{{ app.locationManager.relativeLink(isolate, 'allocationprofile') }}">Allocation Profile</a>
</div>
<div class="col-md-8"></div>
</div>
</template>
</polymer-element>
<polymer-element name="isolate-list" extends="observatory-element">
<template>
<ul class="list-group">
<template repeat="{{ isolate in app.isolateManager.isolates.values }}">
<li class="list-group-item">
<isolate-summary app="{{ app }}" isolate="{{ isolate.id }}" name="{{ isolate.name }}"></isolate-summary>
</li>
</template>
</ul>
(<a href="{{ app.locationManager.absoluteLink('cpu') }}">cpu</a>)
</template>
</polymer-element><polymer-element name="instance-view" extends="observatory-element">
<template>
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-warning">
<div class="panel-heading">
Instance of
<class-ref app="{{ app }}" ref="{{ instance['class'] }}"></class-ref>
</div>
<div class="panel-body">
<template if="{{ instance['error'] == null }}">
<table class="table table-hover">
<tbody>
<tr>
<td>Preview</td><td>{{ instance['preview'] }}</td>
</tr>
</tbody>
</table>
<blockquote><strong>Fields</strong></blockquote>
<table class="table table-hover">
<tbody>
<tr template="" repeat="{{ field in instance['fields'] }}">
<td><field-ref app="{{ app }}" ref="{{ field }}"></field-ref></td>
<td><instance-ref app="{{ app }}" ref="{{ field['value'] }}"></instance-ref></td>
</tr>
</tbody>
</table>
</template>
<template if="{{ instance['error'] != null }}">
<error-view error_obj="{{ instance['error'] }}"></error-view>
</template>
</div>
</div>
</div>
</div>
</template>
</polymer-element>
<polymer-element name="json-view" extends="observatory-element">
<template>
<template bind="" if="{{ valueType == 'Primitive' }}">
<span>{{primitiveString}}</span>
</template>
<template bind="" if="{{ valueType == 'List' }}">
<table class="table table-condensed table-bordered">
<caption class="text-left">List, {{list.length}}</caption>
<tbody>
<tr template="" repeat="{{item in list)}}">
<th>{{counter}}</th>
<td><json-view json="{{item}}"></json-view></td>
</tr>
</tbody>
</table>
</template>
<template if="{{ valueType == 'Map' }}">
<table class="table table-condensed table-bordered">
<caption class="text-left">Map, {{keys.length}}</caption>
<tbody>
<tr template="" repeat="{{key in keys}}">
<th>{{key}}</th>
<td><json-view json="{{value(key)}}"></json-view></td>
</tr>
</tbody>
</table>
</template>
</template>
</polymer-element>
<polymer-element name="script-ref" extends="service-ref">
<template>
<a href="{{ url }}">{{ name }}</a>
</template>
</polymer-element><polymer-element name="library-view" extends="observatory-element">
<template>
<div class="alert alert-success">Library {{ library['name'] }}</div>
<div class="alert alert-info">Scripts</div>
<table class="table table-hover">
<tbody>
<tr template="" repeat="{{ script in library['scripts']}}">
<td>
{{ script['kind'] }}
</td>
<td>
<script-ref app="{{ app }}" ref="{{ script }}"></script-ref>
</td>
</tr>
</tbody>
</table>
<div class="alert alert-info">Imported Libraries</div>
<table class="table table-hover">
<tbody>
<tr template="" repeat="{{ lib in library['libraries'] }}">
<td>
<library-ref app="{{ app }}" ref="{{ lib }}"></library-ref>
</td>
</tr>
</tbody>
</table>
<div class="alert alert-info">Variables</div>
<table class="table table-hover">
<tbody>
<tr template="" repeat="{{ variable in library['variables'] }}">
<td><field-ref app="{{ app }}" ref="{{ variable }}"></field-ref></td>
<td><instance-ref app="{{ app }}" ref="{{ variable['value'] }}"></instance-ref></td>
</tr>
</tbody>
</table>
<div class="alert alert-info">Functions</div>
<table class="table table-hover">
<tbody>
<tr template="" repeat="{{ func in library['functions'] }}">
<td>
<function-ref app="{{ app }}" ref="{{ func }}"></function-ref>
</td>
</tr>
</tbody>
</table>
<div class="alert alert-info">Classes</div>
<table class="table table-hover">
<thead>
<tr>
<th>Name</th>
<th>Internal Name</th>
</tr>
</thead>
<tbody>
<tr template="" repeat="{{ cls in library['classes'] }}">
<td>
<class-ref app="{{ app }}" ref="{{ cls }}"></class-ref>
</td>
<td>
<class-ref app="{{ app }}" ref="{{ cls }}" internal=""></class-ref>
</td>
</tr>
</tbody>
</table>
</template>
</polymer-element><polymer-element name="heap-profile" extends="observatory-element">
<template>
<div>
<button type="button" on-click="{{refreshData}}">Refresh</button>
</div>
<div>
<span>New Space </span>
<span>{{ status(true) }}</span>
</div>
<div>
<span>Old Space </span>
<span>{{ status(false) }}</span>
</div>
<table class="table table-hover">
<thead>
<tr>
<th>Class</th>
<th><button on-click="{{changeSortColumn}}" data-msg="1">Current (new)</button></th>
<th><button on-click="{{changeSortColumn}}" data-msg="2">Allocated since GC (new)</button></th>
<th><button on-click="{{changeSortColumn}}" data-msg="3">Total before last GC (new)</button></th>
<th><button on-click="{{changeSortColumn}}" data-msg="4">Total after last GC (new)</button></th>
<th><button on-click="{{changeSortColumn}}" data-msg="5">Current (old)</button></th>
<th><button on-click="{{changeSortColumn}}" data-msg="6">Allocated since GC (old)</button></th>
<th><button on-click="{{changeSortColumn}}" data-msg="7">Total before last GC (old)</button></th>
<th><button on-click="{{changeSortColumn}}" data-msg="8">Total after last GC (old)</button></th>
</tr>
</thead>
<tbody>
<tr template="" repeat="{{ cls in sortedProfile }}">
<td><class-ref app="{{ app }}" ref="{{ cls['class'] }}"></class-ref></td>
<td>{{ current(cls, true) }}</td>
<td>{{ allocated(cls, true) }}</td>
<td>{{ beforeGC(cls, true) }}</td>
<td>{{ afterGC(cls, true) }}</td>
<td>{{ current(cls, false) }}</td>
<td>{{ allocated(cls, false) }}</td>
<td>{{ beforeGC(cls, false) }}</td>
<td>{{ afterGC(cls, false) }}</td>
</tr>
</tbody>
</table>
</template>
</polymer-element><polymer-element name="script-view" extends="observatory-element">
<template>
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel-heading">
<button on-click="{{refreshCoverage}}">Refresh Coverage</button>
{{ script.scriptRef['user_name'] }}
{{ script.coveredPercentageFormatted() }}
</div>
<div class="panel-body">
<table style="width:100%">
<tbody>
<tr template="" repeat="{{ line in script.linesForDisplay }}">
<td style="{{ hitsStyle(line) }}"> </td>
<td style="font-family: consolas, courier, monospace;font-size: 1em;line-height: 1.2em;white-space: nowrap;">{{line.line}}</td>
<td width="99%" style="font-family: consolas, courier, monospace;font-size: 1em;line-height: 1.2em;">{{line.text}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</template>
</polymer-element><polymer-element name="stack-trace" extends="observatory-element">
<template>
<div class="alert alert-info">Stack Trace</div>
<table class="table table-hover">
<thead>
<tr>
<th>Depth</th>
<th>Function</th>
<th>Script</th>
<th>Line</th>
</tr>
</thead>
<tbody>
<tr template="" repeat="{{ frame in trace['members'] }}">
<td></td>
<td><function-ref app="{{ app }}" ref="{{ frame['function'] }}"></function-ref></td>
<td><script-ref app="{{ app }}" ref="{{ frame['script'] }}"></script-ref></td>
<td>{{ frame['line'] }}</td>
</tr>
</tbody>
</table>
</template>
</polymer-element><polymer-element name="message-viewer" extends="observatory-element">
<!--
This is a big switch statement which instantiates the custom element
designated to display the message type.
-->
<template>
<!-- If the message type is an IsolateList -->
<template if="{{ messageType == 'IsolateList' }}">
<isolate-list app="{{ app }}"></isolate-list>
</template>
<!-- If the message type is a StackTrace -->
<template if="{{ messageType == 'StackTrace' }}">
<stack-trace app="{{ app }}" trace="{{ message }}"></stack-trace>
</template>
<template if="{{ messageType == 'BreakpointList' }}">
<breakpoint-list app="{{ app }}" msg="{{ message }}"></breakpoint-list>
</template>
<template if="{{ messageType == 'Error' }}">
<error-view app="{{ app }}" error="{{ message }}"></error-view>
</template>
<template if="{{ messageType == 'Library' }}">
<library-view app="{{ app }}" library="{{ message }}"></library-view>
</template>
<template if="{{ messageType == 'Class' }}">
<class-view app="{{ app }}" cls="{{ message }}"></class-view>
</template>
<template if="{{ messageType == 'Field' }}">
<field-view app="{{ app }}" field="{{ message }}"></field-view>
</template>
<template if="{{ messageType == 'Instance' }}">
<instance-view app="{{ app }}" instance="{{ message }}"></instance-view>
</template>
<template if="{{ messageType == 'Array' }}">
<instance-view app="{{ app }}" instance="{{ message }}"></instance-view>
</template>
<template if="{{ messageType == 'GrowableObjectArray' }}">
<instance-view app="{{ app }}" instance="{{ message }}"></instance-view>
</template>
<template if="{{ messageType == 'String' }}">
<instance-view app="{{ app }}" instance="{{ message }}"></instance-view>
</template>
<template if="{{ messageType == 'Bool' }}">
<instance-view app="{{ app }}" instance="{{ message }}"></instance-view>
</template>
<template if="{{ messageType == 'Smi' }}">
<instance-view app="{{ app }}" instance="{{ message }}"></instance-view>
</template>
<template if="{{ messageType == 'Function' }}">
<function-view app="{{ app }}" function="{{ message }}"></function-view>
</template>
<template if="{{ messageType == 'Code' }}">
<code-view app="{{ app }}" code="{{ message['code'] }}"></code-view>
</template>
<template if="{{ messageType == 'Script' }}">
<script-view app="{{ app }}" script="{{ message['script'] }}"></script-view>
</template>
<template if="{{ messageType == 'AllocationProfile' }}">
<heap-profile app="{{ app }}" profile="{{ message }}"></heap-profile>
</template>
<template if="{{ messageType == 'CPU' }}">
<json-view json="{{ message }}"></json-view>
</template>
<!-- Add new views and message types in the future here. -->
</template>
</polymer-element><polymer-element name="navigation-bar-isolate" extends="observatory-element">
<template>
<ul class="nav navbar-nav">
<li><a href="{{ currentIsolateLink('') }}"> {{currentIsolateName()}}</a></li>
<template repeat="{{link in links}}">
<li><a href="{{ currentIsolateLink(link) }}">{{ link }}</a></li>
</template>
</ul>
</template>
</polymer-element><polymer-element name="navigation-bar" extends="observatory-element">
<template>
<nav class="navbar navbar-default" role="navigation">
<div class="navbar-header">
<a class="navbar-brand" href="#/isolates">Observatory</a>
</div>
<template if="{{ app.locationManager.hasCurrentIsolate }}">
<div class="collapse navbar-collapse navbar-ex1-collapse">
<navigation-bar-isolate app="{{ app }}"></navigation-bar-isolate>
</div>
</template>
</nav>
</template>
</polymer-element><polymer-element name="isolate-profile" extends="observatory-element">
<template>
<p> P R O F I L E </p>
<div>
<button type="button" on-click="{{refreshData}}">Refresh profile data</button>
<span>Top</span>
<select selectedindex="{{methodCountSelected}}" value="{{methodCounts[methodCountSelected]}}">
<option template="" repeat="{{count in methodCounts}}">{{count}}</option>
</select>
<span>methods</span>
</div>
<blockquote><strong>Top Exclusive</strong></blockquote>
<table class="table table-hover">
<thead>
<tr>
<th>Ticks</th>
<th>Percent</th>
<th>Method</th>
</tr>
</thead>
<tbody>
<tr template="" repeat="{{ code in topExclusiveCodes }}">
<td>{{ codeTicks(code, false) }}</td>
<td>{{ codePercent(code, false) }}</td>
<td>
<span>{{ codeName(code) }}</span>
<code-ref app="{{ app }}" ref="{{ code.codeRef }}"></code-ref>
</td>
</tr>
</tbody></table>
</template>
</polymer-element>
<polymer-element name="response-viewer" extends="observatory-element">
<template>
<template repeat="{{ message in app.requestManager.responses }}">
<message-viewer app="{{ app }}" message="{{ message }}"></message-viewer>
</template>
</template>
</polymer-element><polymer-element name="observatory-application" extends="observatory-element">
<template>
<navigation-bar app="{{ app }}"></navigation-bar>
<template if="{{ app.locationManager.profile }}">
<isolate-profile app="{{ app }}"></isolate-profile>
</template>
<template if="{{ app.locationManager.profile == false }}">
<response-viewer app="{{ app }}"></response-viewer>
</template>
</template>
</polymer-element>
<observatory-application></observatory-application>
</body></html>