106 lines
5.3 KiB
HTML
106 lines
5.3 KiB
HTML
<!DOCTYPE html>
|
|
<html data-visible-section="home">
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
<meta name="viewport" content="width=850" />
|
|
<title>Speedometer 3.0</title>
|
|
<link rel="stylesheet" href="resources/main.css" />
|
|
<link rel="icon" href="resources/favicon.png" />
|
|
<script src="resources/main.mjs" type="module"></script>
|
|
</head>
|
|
<body>
|
|
<main>
|
|
<section id="home">
|
|
<a href="#home" class="logo">
|
|
<img srcset="resources/logo@2x.png 2x" src="resources/logo.png" alt="Speedometer" />
|
|
<div class="version">3.0</div>
|
|
</a>
|
|
<div class="content">
|
|
<p>Speedometer is a browser benchmark that measures the responsiveness of Web applications. It uses demo web applications to simulate user actions such as adding to-do items.</p>
|
|
<p id="screen-size-warning">
|
|
<strong>
|
|
Your browser window is too small. For most accurate results, please make the view port size at least <span id="min-screen-width">850px</span> by <span id="min-screen-height">650px</span>.<br />
|
|
It's currently <span id="screen-size"></span>.
|
|
</strong>
|
|
</p>
|
|
</div>
|
|
<div class="buttons">
|
|
<div class="button-row">
|
|
<button class="start-tests-button">Start Test</button>
|
|
</div>
|
|
<div class="button-row">
|
|
<a href="about.html">About Speedometer</a>
|
|
<a href="instructions.html">Test Instructions</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="running">
|
|
<a href="#home" class="logo">
|
|
<img srcset="resources/logo@2x.png 2x" src="resources/logo.png" alt="Speedometer" />
|
|
<div class="version">3.0</div>
|
|
</a>
|
|
<div id="testContainer"></div>
|
|
<div id="progress">
|
|
<progress aria-label="Progress" id="progress-completed"></progress>
|
|
</div>
|
|
<div id="info">
|
|
<div id="info-label"></div>
|
|
<div id="info-progress"></div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="summary" data-title="Results Summary">
|
|
<a href="#home" class="logo">
|
|
<img srcset="resources/logo@2x.png 2x" src="resources/logo.png" alt="Speedometer" />
|
|
<div class="version">3.0</div>
|
|
</a>
|
|
<h1>Score</h1>
|
|
<div class="gauge">
|
|
<div class="window"><div class="needle"></div></div>
|
|
</div>
|
|
<hr />
|
|
<div id="result-number"></div>
|
|
<div id="confidence-number"></div>
|
|
<div class="buttons">
|
|
<div class="button-row">
|
|
<a class="button" href="#details" id="show-details" title="Show detailed results data.">Details</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="details" data-title="Results Details">
|
|
<a href="#home" class="logo">
|
|
<img srcset="resources/logo@2x.png 2x" src="resources/logo.png" alt="Speedometer" />
|
|
<div class="version">3.0</div>
|
|
</a>
|
|
<div class="section-grid">
|
|
<h1 class="section-header">Detailed Results</h1>
|
|
<div class="section-content all-metric-results">
|
|
<div class="aggregated-metric-result">
|
|
<h2>Aggregate Metric</h2>
|
|
<div id="geomean-chart"></div>
|
|
<h2>Test Metrics Overview</h2>
|
|
<div id="tests-chart"></div>
|
|
</div>
|
|
<br />
|
|
<h2>Test Metrics Details</h2>
|
|
<div id="metrics-results"></div>
|
|
</div>
|
|
<div class="buttons section-footer">
|
|
<div class="button-row">
|
|
<a class="button" href="#summary" title="Go back to the simplified summary view.">Summary</a>
|
|
</div>
|
|
<div class="button-row export-buttons">
|
|
<button id="copy-full-json" title="Copy full result metrics as json string.">Copy JSON</button>
|
|
<a class="button" id="download-full-json" title="Download full result metrics as json string.">Download JSON</a>
|
|
<a class="button" id="download-classic-json" title="Download backwards-compatible result metrics as json string.">Download Classic JSON</a>
|
|
<a class="button" id="download-csv" title="Download all result metrics as CSV string.">Download CSV</a>
|
|
<button id="copy-csv" title="Copy all result metrics as CSV string.">Copy CSV</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
</body>
|
|
</html>
|