Support bundled builds with embedded benchmarks data

Author: Alexander Kovelenov

package.json

@@ -42,7 +42,7 @@
     "build": "rollup -c rollup/config.lib.js",
     "example": "rollup -w -c rollup/config.dev.js",
     "parse-analytics": "node ./scripts/analytics_parser.js",
-    "update-benchmarks": "rimraf benchmarks && mkdir -p benchmarks && mkdir -p benchmarks-min && node ./scripts/update_benchmarks.js && tar -czvf benchmarks.tar.gz benchmarks-min/*.json && rm -rf benchmarks-min"
+    "update-benchmarks": "rimraf benchmarks && mkdir -p benchmarks && mkdir -p benchmarks-min && node ./scripts/update_benchmarks.js && tar -czvf benchmarks.tar.gz benchmarks-min/*.json && rm -rf benchmarks-min && node ./scripts/combine_benchmarks.js"
   },
   "dependencies": {
     "webgl-constants": "^1.1.1"
@@ -64,6 +64,7 @@
     "rollup": "^4.5.0",
     "rollup-plugin-copy": "^3.5.0",
     "rollup-plugin-filesize": "^10.0.0",
+    "rollup-plugin-ignore": "^1.0.10",
     "rollup-plugin-livereload": "^2.0.5",
     "rollup-plugin-serve": "^2.0.2"
   },

rollup/config.dev.js

@@ -1,4 +1,3 @@
-// Vendor
 import json from '@rollup/plugin-json';
 import resolve from '@rollup/plugin-node-resolve';
 import copy from 'rollup-plugin-copy';

rollup/config.lib.js

@@ -5,18 +5,24 @@ import copy from 'rollup-plugin-copy';
 import filesize from 'rollup-plugin-filesize';
 import terser from '@rollup/plugin-terser';
 import { babel } from '@rollup/plugin-babel';
+import ignore from 'rollup-plugin-ignore'
 
-const formats = ['esm', 'umd'];
+const formats = [
+    ['esm', 'esm', './internal/benchmarks.json'],
+    ['umd', 'umd', './internal/benchmarks.json'],
+    ['umd', 'bundle', ''],
+];
 
-export default formats.map((format) => ({
+export default formats.map(([format, suffix, ignored] = []) => ({
     input: './src/index.js',
     output: {
-        file: `./dist/detect-gpu.${format}.js`,
+        file: `./dist/detect-gpu.${suffix}.js`,
         format,
         name: 'DetectGPU',
         sourcemap: true,
     },
     plugins: [
+        ignore(ignored),
         babel({
             presets: [['@babel/preset-env', { targets: "safari >= 11" }]],
             babelHelpers: 'bundled',

scripts/combine_benchmarks.js

@@ -0,0 +1,16 @@
+#!/usr/bin/env node
+
+import fs from 'fs';
+import path from 'path';
+import url from 'url';
+
+const CURR_DIR = path.dirname(url.fileURLToPath(import.meta.url));
+const BENCH_DIR = path.join(CURR_DIR, '..', 'benchmarks');
+
+const pack = {};
+
+fs.readdirSync(BENCH_DIR).forEach(file => {
+    pack[file] = JSON.parse(fs.readFileSync(path.join(BENCH_DIR, file)));
+});
+
+fs.writeFileSync(path.join(CURR_DIR, '..', 'src', 'internal', 'benchmarks.json'), JSON.stringify(pack));

src/index.js

@@ -1,4 +1,6 @@
 import { version } from '../package.json';
+// optional, when ignored in rollup config, becomes {}
+import benchmarkFiles from './internal/benchmarks.json';
 
 import { BLOCKLISTED_GPUS } from './internal/blocklistedGPUS';
 import { cleanRenderer } from './internal/cleanRenderer';
@@ -23,6 +25,11 @@ export const getGPUTier = async ({
         } = {}) => {
 
     const queryCache = {};
+
+    // populate cache from bundle if there is somemething in it
+    for (const benchmarkFile in benchmarkFiles)
+        queryCache[benchmarkFile] = benchmarkFiles[benchmarkFile].slice(1); // strip version
+
     if (isSSR) {
         return {
             tier: 0,
@@ -32,22 +39,23 @@ export const getGPUTier = async ({
 
     const {
         isIpad = !!deviceInfo?.isIpad,
-            isMobile = !!deviceInfo?.isMobile,
-            screenSize = window.screen,
-            loadBenchmarks = async (file) => {
-                const data = await fetch(`${benchmarksURL}/${file}`).then((response) =>
-                    response.json()
+        isMobile = !!deviceInfo?.isMobile,
+        screenSize = window.screen,
+        loadBenchmarks = async (file) => {
+
+            const data = await fetch(`${benchmarksURL}/${file}`).then((response) =>
+                response.json()
+            );
+
+            // Remove version tag and check version is supported
+            const version = parseInt(data.shift().split('.')[0], 10);
+            if (version < 1) {
+                throw new OutdatedBenchmarksError(
+                    'Detect GPU benchmark data is out of date. Please update to version 1x'
                 );
-
-                // Remove version tag and check version is supported
-                const version = parseInt(data.shift().split('.')[0], 10);
-                if (version < 1) {
-                    throw new OutdatedBenchmarksError(
-                        'Detect GPU benchmark data is out of date. Please update to version 1x'
-                    );
-                }
-                return data;
-            },
+            }
+            return data;
+        },
     } = override;
 
     let { renderer } = override;