Options
All
  • Public
  • Public/Protected
  • All
Menu

device-performance-metrics

Performance metrics

npm npm bundle size npm bundle size GitHub npm

Usage

Installation

To install the library run $ yarn add device-performance-metrics in the root of your project.

Basic usage

Importing the library globally:

import PerformanceMetrics from 'device-performance-metrics';

const performanceMetrics: PerformanceMetrics = new PerformanceMetrics();

const browser = performanceMetrics.deviceSpecifications.getBrowser();

const fps = performanceMetrics.fpscounter.fps;

const bandwidth = performanceMetrics.networkBandwidtInformation.getAverageBandwidth();

Or tree shake the library:

import { DeviceSpecifications } from 'device-performance-metrics';
import { NetworkBandwidthInformation } from 'device-performance-metrics';
import { FPSCounter } from 'device-performance-metrics';

const deviceSpecs = new DeviceSpecifications();
const browser = deviceSpecs.getBrowser();

const networkBandwidth = new NetworkBandwidthInformation();
const avgBandwidth = networkBandwidth.getAverageBandwidth();

const fpsCounter = new FPSCounter();
const fps = fpsCounter.fps;

Getting device specifications

The class DeviceSpecifications gives you the ability to get basic specifications about your user's device. For example his browser and OS:

import { DeviceSpecifications } from 'device-performance-metrics';

const deviceSpecs: DeviceSpecifications = new DeviceSpecifications();

const browser = deviceSpecs.getBrowser();

const browserName = browser.name;
const browserVersion = browser.version;

const OS = deviceSpecs.getOS();

const OSName = OS.name;
const OSVersion = OS.version;

console.log(`Browser: ${browserName}(${browserVersion}), OS: ${OSName}(${OSVersion})`);
// example log: 'Browser: Chrome(73.0.3683), OS: MacOS(10.14.4)'

Network bandwidth

If you need to get information about the bandwidth you can use the NetworkBandwidthInformation class.

import { NetworkBandwidthInformation } from 'device-performance-metrics';

const networkInfo: NetworkBandwidthInformation = new NetworkBandwidthInformation();

// Logs an array of all measured bandwidths found when the class is contstructed
console.log(networkInfo.bandwidths);
// example log: [1432, 4234, 7686]

// Logs an avaerge of all measured bandwidths found when the class is contstructed
console.log(`${networkInfo.averageBandwidth}bps`);
// example log: 3973bpms

// Because the above values are made when the class is contstructed you also directly trigger the functions that get the data, for example:

console.log(networkInfo.getAverageBandwidth());
// example log: 4264bpms

FPS

The FPSCounter class gives you the ability to get the current framerate.

import { FPSCounter } from 'device-performance-metrics';

const fpsCounter: FPSCounter = new FPSCounter();

// Logs the current FPS
console.log(`${fpsCounter.fps}fps`)
// Example log: 60fps

If you want to get realtime information about the framerate you can use the setInterval() function:

// Logs the current FPS every 500ms.
setInterval(() => {
    console.log(`${fpsCounter.fps}fps`);
}, 500);

Typedoc

Detailed documentation can be found in the typedoc.

Building

This project forces you to use yarn;

$ yarn

$ yarn test to test

$ yarn test:dev to watch tests

$ yarn build to build the code to the /lib folder.

$ yarn doc to generated documentation in the ./docs folder

Contribution

TODO

Generated using TypeDoc