detect-gpu

by TimvanScherpenzeel

TimvanScherpenzeel / detect-gpu

Classify GPU's based on their benchmark score in order to provide an adaptive experience.

181 Stars 11 Forks Last release: Not found MIT License 304 Commits 0 Releases

Available items

No Items, yet!

The developer of this repository has not created any items for sale yet. Need a bug fixed? Help with integration? A different license? Create a request here:

Detect GPU

npm version

Classify GPU's based on their benchmark score in order to provide an adaptive experience.

Demo

Live demo

Installation

Make sure you have Node.js installed.

 $ npm install detect-gpu

Usage

detect-gpu
uses benchmarking scores in order to determine what tier should be assigned to the user's GPU. If no
WebGLContext
can be created or the GPU is blacklisted
TIER_0
is assigned. One should provide a HTML fallback page that a user should be redirected to.

By default are all GPU's that have met these preconditions classified as

TIER_1
. Using user agent detection a distinction is made between mobile (mobile and tablet) prefixed using
GPU_MOBILE_
and desktop devices prefixed with
GPU_DESKTOP_
. Both are then followed by
TIER_N
where
N
is the tier number.

In order to keep up to date with new GPU's coming out

detect-gpu
splits the benchmarking scores in
4 tiers
based on rough estimates of the market share.

By default

detect-gpu
assumes
0%
of the lowest scores to be insufficient to run the experience and is assigned
TIER_0
.
50%
of the GPU's are considered good enough to run the experience and are assigned
TIER_1
.
30%
of the GPU's are considered powerful and are classified as
TIER_2
. The last
20%
of the GPU's are considered to be very powerful, are assigned
TIER_3
, and can run the experience with all bells and whistles.

You can tweak these percentages when registering the application as shown below:

import { getGPUTier } from 'detect-gpu';

const GPUTier = getGPUTier({ glContext?: gl, // Optionally pass in a WebGL context to avoid creating a temporary one internally mobileBenchmarkPercentages?: [0, 50, 30, 20], // (Default) [TIER_0, TIER_1, TIER_2, TIER_3] desktopBenchmarkPercentages?: [0, 50, 30, 20], // (Default) [TIER_0, TIER_1, TIER_2, TIER_3] failIfMajorPerformanceCaveat?: true, // (Default) Fail to detect if the WebGL implementation determines the performance would be dramatically lower than the equivalent OpenGL implementation forceRendererString?: 'Apple A11 GPU', // (Development) Force a certain renderer string forceMobile?: true, // (Development) Force the use of mobile benchmarking scores });

Development

$ yarn start

$ yarn serve

$ yarn lint

$ yarn test

$ yarn build

$ yarn parse-analytics

$ yarn update-benchmarks

Licence

My work is released under the MIT license.

detect-gpu
uses both mobile and desktop benchmarking scores from https://www.notebookcheck.net/.

The unmasked renderers have been gathered using the analytics script that one can find in

scripts/analytics_embed.js
.

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.