182 lines
6.3 KiB
HTML
182 lines
6.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
|
|
<!-- If IE use the latest rendering engine -->
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
|
|
<!-- Set the page to the width of the device and set the zoon level -->
|
|
<meta name="viewport" content="width = device-width, initial-scale = 1">
|
|
<title>Tensorflow Conversion Tooling & Logging</title>
|
|
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
|
|
|
|
<style>
|
|
.jumbotron{
|
|
background-color:#2E2D88;
|
|
color:white;
|
|
}
|
|
/* Adds borders for tabs */
|
|
.tab-content {
|
|
border-left: 1px solid #ddd;
|
|
border-right: 1px solid #ddd;
|
|
border-bottom: 1px solid #ddd;
|
|
padding: 10px;
|
|
}
|
|
.nav-tabs {
|
|
margin-bottom: 0;
|
|
}
|
|
</style>
|
|
|
|
</head>
|
|
<body>
|
|
|
|
<!-- CONTAINERS -->
|
|
<!-- container puts padding around itself while container-fluid fills the whole screen. Bootstap grids require a container. -->
|
|
<div class="container">
|
|
|
|
<!-- page-header adds space aroundtext and enlarges it. It also adds an underline at the end -->
|
|
<div class="page-header">
|
|
<h1>Tensorflow Conversion Tooling & Logging</h1>
|
|
</div>
|
|
|
|
<!-- jumbotron enlarges fonts and puts everything in a gray box with rounded corners. If jumbotron is outside a container it fills the total width. You can change the styles by placing the changes after the Bootstrap CDN link -->
|
|
<div class="container">
|
|
|
|
<div class="input-group mb-3" style="display: none;">
|
|
<div class="input-group-prepend">
|
|
<div class="input-group-text">
|
|
<label>
|
|
<input type="checkbox" aria-label="Checkbox for following text input"> I've reviewed the <a href="https://www.tensorflow.org/">data collection policy</a> and agree to submit this data to Google.
|
|
<button type="button" class="btn btn-primary">Submit Conversion Log</button>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<h2>Conversion Summary
|
|
<!--CONVERSION_STATUS-->
|
|
</h2>
|
|
<a href="#conversionlog">Jump to conversion log</a>
|
|
|
|
<ul class="list-group">
|
|
<li class="list-group-item">Total ops used before conversion: <!--TOTAL_OPS_BEFORE_CONVERT--></li>
|
|
<li class="list-group-item">Total ops used post conversion: <!--TOTAL_OPS_AFTER_CONVERT-->
|
|
<span class="badge badge-pill badge-primary"><!--BUILT_IN_OPS_COUNT--> Built-in Ops</span>
|
|
<span class="badge badge-pill badge-primary"><!--SELECT_OPS_COUNT--> Select Ops</span>
|
|
<span class="badge badge-pill badge-primary"><!--CUSTOM_OPS_COUNT--> Custom Ops</span>
|
|
</li>
|
|
<li class="list-group-item">Post-training quantization <!--POST_TRAINING_QUANT_ENABLED--> applied.</li>
|
|
</ul>
|
|
|
|
<h2>Operator Profile</h2>
|
|
|
|
<div class="panel-group">
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<h4 class="panel-title">
|
|
<a data-toggle="collapse" href="#collapse1"><b>Pre-conversion Op Profile</b></a>
|
|
</h4>
|
|
</div>
|
|
<div id="collapse1" class="panel-collapse collapse in">
|
|
<div class="panel-body">
|
|
<div class="flex-container">
|
|
<!-- You can constrain the columns if you want -->
|
|
<div class="row">
|
|
<!-- The table class adds nice spacing and the other classes add additional style -->
|
|
<table class="table table-bordered table-striped table-hover">
|
|
<thead></thead>
|
|
<tbody>
|
|
<tr>
|
|
<!-- Use text alignment like text-center or text-right -->
|
|
<th class="text-center">Operations Used</td>
|
|
<th class="text-center">Input Types</td>
|
|
</tr>
|
|
<!--REPEAT_TABLE1_ROWS-->
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel-group">
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<h4 class="panel-title">
|
|
<a data-toggle="collapse" href="#collapse2"><b>Post-conversion Op Profile</b></a>
|
|
</h4>
|
|
</div>
|
|
<div id="collapse2" class="panel-collapse collapse in">
|
|
<div class="panel-body">
|
|
<div class="flex-container">
|
|
<div class="row">
|
|
<!-- The table class adds nice spacing and the other classes add additional style -->
|
|
<table class="table table-bordered table-striped table-hover">
|
|
<thead></thead>
|
|
<tbody>
|
|
<tr>
|
|
<!-- Use text alignment like text-center or text-right -->
|
|
<th class="text-center">Operations Used</td>
|
|
<th class="text-center">Supported</td>
|
|
</tr>
|
|
<!--REPEAT_TABLE2_ROWS-->
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<h2>Graph Visualization</h2>
|
|
<div class="container">
|
|
<div class="row">
|
|
<div>
|
|
<script src="https://d3js.org/d3.v4.min.js"></script>
|
|
<script src="https://unpkg.com/viz.js@1.8.1/viz.js" type="javascript/worker"></script>
|
|
<script src="https://unpkg.com/d3-graphviz@2.6.1/build/d3-graphviz.js"></script>
|
|
<!-- The table class adds nice spacing and the other classes add additional style -->
|
|
<table class="table table-bordered table-striped table-hover">
|
|
<thead>
|
|
<tr>
|
|
<td colspan="4"><b>Compare the model before/after conversion</b></td>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
|
|
<!-- Use text alignment like text-center or text-right -->
|
|
<th class="text-center">Before Conversion <button class="btn btn-default" type="button">Open</button></td>
|
|
<th class="text-center">After Conversion <button class="btn btn-default" type="button">Open</button></td>
|
|
</tr>
|
|
<tr>
|
|
<td><div id="graph1" style="text-align: center;"></div></td>
|
|
<td><div id="graph2" style="text-align: center;"></div></td>
|
|
<script>d3.select("#graph1").graphviz().fade(false).width(500).height(600).zoomScaleExtent([0.1,100]).fit(true).renderDot(`<!--DOT_BEFORE_CONVERT-->`);</script>
|
|
<script>d3.select("#graph2").graphviz().fade(false).width(500).height(600).zoomScaleExtent([0.1,100]).fit(true).renderDot(`<!--DOT_AFTER_CONVERT-->`);</script>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<a name="conversionlog"></a>
|
|
<h2>Conversion Log</h2>
|
|
<div>
|
|
<pre class="pre-scrollable">
|
|
<code><!--TOCO_INFO_LOG--></code>
|
|
</pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
|
|
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
|
|
</body>
|
|
</html>
|