scratch-vm/src/playground/index.html
Michael "Z" Goddard 4ceeebb257 Use src/index as browser entry point
Use src/index.js as the entry by default in tools building scratch-vm
into a larger package. This saves file space by excluding extra webpack
boilerplate and may allow for deeper optimizations.

Depend on script dependencies for downstream webpack. For another
package to build in scratch-vm's dependencies without them already
being built into a consumed webpack build they need to be listed as
dependencies. This can benefit large projects that reuse the same
dependencies multiple times. Node will still use the main entry point
and its webpack build leaves the dependencies as external references so
it may reuse common modules in Node as well as in a build a browser
environment.
2018-05-31 16:32:46 -04:00

93 lines
2.8 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Scratch VM Benchmark</title>
<link rel="stylesheet" href="./benchmark.css" type="text/css" media="screen">
</head>
<body>
<h2>Scratch VM Benchmark</h2>
<p class="description">
Welcome to the scratch-vm benchmark. This tool helps you profile a scratch
project. When you load the page, it:
<ol class="description">
<li>loads the default project and enables turbo mode
<li>runs the project for 4 seconds to warm up
<li>profiles for 6 seconds
<li>stops and reports
</ol>
</p>
<div class="run-form">
<input type="text" value="119615668">
<button class="run">run</button>
</div>
<p class="run-push">
<i>Try a different project, like `130041250`</i>
</p>
<canvas id="scratch-stage"></canvas><br />
<div class="loading">
<label>Loading:</label>
<span class="loading-complete">0</span> / <span class="loading-total">0</span>
</div>
<div class="profile-count-group">
<div class="profile-count">
<label>Percent of time worked:</label>
<span class="profile-count-value profile-count-amount-recorded">...</span>
</div>
<div class="profile-count">
<label>Steps looped:</label>
<span class="profile-count-value profile-count-steps-looped">...</span>
</div>
<div class="profile-count">
<label>Blocks executed:</label>
<span class="profile-count-value profile-count-blocks-executed">...</span>
</div>
<a class="share"><div class="profile-count">
<label>Share this report</label>
</div></a>
<a class="share" target="_parent">
<div class="profile-count">
<label>Run the full suite</label>
</div>
</a>
</div>
<div class="profile-tables">
<table class="profile-count-frame-table" cellspacing="0">
<thead>
<tr class="profile-count-frame-head"><th>Frame</th><th>Self Time</th><th>Total Time</th><th>Executions</th></tr>
</thead>
<tbody>
<tr class="profiler-count-running"><td colspan="4"></td></tr>
</tbody>
</table>
<table class="profile-count-opcode-table" cellspacing="0">
<thead>
<tr class="profile-count-opcode-head">
<th>opcode</th><th>Self Time</th><th>Total Time</th><th>Executions</th>
</tr>
</thead>
<tbody>
<tr class="profiler-count-running"><td colspan="4"></td></tr>
</tbody>
</table>
</div>
<div id="blocks"></div>
<!-- FPS counter, Blocks, Renderer -->
<script src="./vendor.js"></script>
<!-- Storage module -->
<script src="./scratch-storage.js"></script>
<!-- Stage rendering -->
<script src="./scratch-render.js"></script>
<!-- VM -->
<script src="./scratch-vm.js"></script>
<!-- Playground -->
<script src="./benchmark.js"></script>
</body>
</html>