require('./Stats.css'); const React = require('react'); const PropTypes = require('prop-types'); const formatBytes = require('pretty-bytes'); const formatDate = require('date-fns/format'); const parseDate = require('date-fns/parse'); const { continents, countries } = require('countries-list'); const formatNumber = require('../utils/formatNumber'); const formatPercent = require('../utils/formatPercent'); function getCountriesByContinent(continent) { return Object.keys(countries).filter( country => countries[country].continent === continent ); } function sumKeyValues(hash, keys) { return keys.reduce((n, key) => n + (hash[key] || 0), 0); } function sumValues(hash) { return Object.keys(hash).reduce((memo, key) => memo + hash[key], 0); } class Stats extends React.Component { static propTypes = { data: PropTypes.object }; state = { minPackageRequests: 1000000, minCountryRequests: 1000000 }; render() { const { data } = this.props; if (data == null) return null; const totals = data.totals; // Summary data const since = parseDate(totals.since); const until = parseDate(totals.until); // Packages const packageRows = []; Object.keys(totals.requests.package) .sort((a, b) => { return totals.requests.package[b] - totals.requests.package[a]; }) .forEach(packageName => { const requests = totals.requests.package[packageName]; const bandwidth = totals.bandwidth.package[packageName]; if (requests >= this.state.minPackageRequests) { packageRows.push(
From {formatDate(since, 'MMM D')} to{' '} {formatDate(until, 'MMM D')} unpkg served{' '} {formatNumber(totals.requests.all)} requests and a total of {formatBytes(totals.bandwidth.all)} of data to {formatNumber(totals.uniques.all)} unique visitors,{' '} {formatPercent(totals.requests.cached / totals.requests.all, 0)}% {' '} of which were served from the cache.
The table below shows the most popular packages served by unpkg from{' '} {formatDate(since, 'MMM D')} to{' '} {formatDate(until, 'MMM D')}. Only the top{' '} {Object.keys(totals.requests.package).length} packages are shown.
Include only packages that received at least{' '} {' '} requests.
Package | Requests (% of total) | Bandwidth (% of total) |
---|
The table below breaks down requests to unpkg from{' '} {formatDate(since, 'MMM D')} to{' '} {formatDate(until, 'MMM D')} by geographic region.
Include only countries that made at least{' '} {' '} requests.
Region | Requests (% of total) | Bandwidth (% of total) |
---|
The table below breaks down requests to unpkg from{' '} {formatDate(since, 'MMM D')} to{' '} {formatDate(until, 'MMM D')} by HTTP protocol.
Protocol | Requests (% of total) |
---|