{{>header}}

{{>nav}}

	<div class="o-techdocs-main o-techdocs-content">

		<h1>Usage and performance</h1>

		<p>The public instance of the polyfill service is hosted by the Financial Times, with the generous support of Fastly, who provide CDN distribution.  <a href='http://www.fastly.com/network/'>View Fastly network map</a></p>

		{{#if requestsData}}

		<h3>Traffic volume</h3>

		<p>This shows the number of requests we have served per day, over the last 180 days, measured by <strong>Fastly</strong>:</p>

		<div id="chart-requests" class='o-techdocs-content'>
			<table class='chart-data o-techdocs-table'>
			<thead><tr><th>Date</th><th>Requests</th></tr></thead>
			<tbody>
			{{#requestsData}}
				<tr><td>{{prettifyDate date}}</td><td>{{requests}}</td></tr>
			{{/requestsData}}
			</tbody>
			</table>
		</div>

		<div class='o-grid-row' style='margin: 0 -10px'>
			<div data-o-grid-colspan='S12 L4'>
				<h3>Response time</h3>
				<p>Mean global response time, ms, from <strong>Pingdom</strong>:</p>
				<div id="chart-resptime" class='o-techdocs-content'>
					<table class='chart-data o-techdocs-table'>
						<thead><tr><th>Date</th><th>Response time (ms)</th></tr></thead>
						<tbody>
						{{#respTimes}}
							<tr><td>{{prettifyDate date}}</td><td>{{respTime}}</td></tr>
						{{/respTimes}}
						</tbody>
					</table>
				</div>
			</div>
			<div data-o-grid-colspan='S12 M6 L4'>
				<h3>Caching</h3>
				<p>Hit ratio, last 7 days, from <strong>Fastly</strong>:</p>
				<div id="chart-hitratio" class='o-techdocs-content'>
					<table class='chart-data o-techdocs-table'>
						<thead><tr><th>Cache result</th><th>Requests</th></tr></thead>
						<tbody>
							<tr><td>Hits</td><td>{{hitCount}}</td></tr>
							<tr><td>Misses</td><td>{{missCount}}</td></tr>
						</tbody>
					</table>
				</div>
			</div>
			<div data-o-grid-colspan='S12 M6 L4'>
				<h3>Availability</h3>
				<p>Total downtime, according to <strong>Pingdom</strong>:</p>
				<div class='o-techdocs-content'>
				<table class='outages o-techdocs-table'>
					<tr><th>Last 30 days</th><td>{{prettifyDuration downtime.30d}}</td></tr>
					<tr><th>Last 3 months</th><td>{{prettifyDuration downtime.3m}}</td></tr>
					<tr><th>Last 12 months</th><td>{{prettifyDuration downtime.12m}}</td></tr>
				</table>
				</div>
			</div>
		</div>

		<p>Caching responses that vary by <code>User-Agent</code> is very hard to do with good cache performance. We use a <a href='http://labs.ft.com/2014/10/caching-user-agent-specific-responses-with-fastly/'>custom Fastly VCL configuration</a> that separates the UA normalisation from the polyfill bundle.</p>

		<h3>Network performance in detail</h3>

		<p>95th percentile resource timing metrics, broken down by Fastly edge point of presence, measured using the <strong>resource timing API</strong> from live polyfill service requests that opted in to anonymously report performance data.  Last 30 days, showing only POPs that have served more than 10 requests.</p>

		<table class='rum-perf-data'>
		<tr>
			<th class="rum-perf-data__pop">PoP</th>
			<th class="rum-perf-data__count">Reqs</th>
			<th class='rum-perf-data__nettimeline'>Per connection phase</th>
			<th class="rum-perf-data__total">Overall</th>
		</tr>
		{{#rumPerfData}}
		<tr>
			<td class="rum-perf-data__pop">{{data_center}}</td>
			<td class="rum-perf-data__count">{{number_format count}}</td>
			<td class='rum-perf-data__nettimeline'><div class="nettimeline nettimeline--dns" style="width:{{perf_dns_95_display_pc}}%" title="DNS lookup: {{perf_dns_95}}ms"></div><div class="nettimeline nettimeline--connect" style="width:{{perf_connect_95_display_pc}}%" title="TCP connect / SSL: {{perf_connect_95}}ms"></div><div class="nettimeline nettimeline--req" style="width:{{perf_req_95_display_pc}}%" title="Request: {{perf_req_95}}ms"></div><div class="nettimeline nettimeline--resp" style="width:{{perf_resp_95_display_pc}}%" title="Response: {{perf_req_95}}ms"></div></td>
			<td class="rum-perf-data__total">{{number_format perf_total_95}}ms</td>
		</tr>
		{{/rumPerfData}}
		</table>

		{{else}}

		<p><em>Usage stats cannot be shown, probably because you need to configure the environment variables needed to get data from the Fastly and Pingdom APIs.  The specific error thrown by the service is shown below:</em></p>

		<pre><code class="nohighlight">Service: {{service}}
Error:   {{msg}}</code></pre>

		{{/if}}


	</div>

{{>footer}}