JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 146
  • Score
    100M100P100Q70613F
  • License MIT

Detect and report browser and hardware features.

Package Exports

  • detect-features

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (detect-features) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Detect features

npm version dependencies devDependencies

Detect and report browser and hardware features.

Demo

Live demo

As part of general research I have ran the website on a wide variety of devices and browsers. The reported features of all of these devices can be found in the data folder.

I've also created various support tables from this data:

Usage

  DetectFeatures.register({
      log: true,
      element: document.getElementById('app'),
  });

Installation

Make sure you have Node.js installed.

 $ npm install

Development

$ npm start

$ npm run serve

$ npm run lint

$ npm run dist

$ npm run deploy

Reported features

{
  "browserFeatures": {
    "browserType": {
      "browserEngineName": "WebKit",
      "browserEngineVersion": "537.36",
      "browserName": "Chrome",
      "browserVersion": "65.0.3325.146",
      "deviceModel": "Unknown",
      "deviceType": "Unknown",
      "deviceVendor": "Unknown",
      "operatingSystemName": "Mac OS",
      "operatingSystemVersion": "10.10.5"
    },
    "isGamepadSupported": true,
    "isIndexedDBSupported": true,
    "isLocalStorageSupported": true,
    "isPerformanceSupported": true,
    "isRequestIdleCallbackSupported": true,
    "isServiceWorkerSupported": true,
    "isWebAssemblySupported": true,
    "isWebAudioSupported": true,
    "isWebGL2Supported": true,
    "isWebGLSupported": true,
    "isWebRTCSupported": true,
    "isWebSocketSupported": true,
    "isWebVRSupported": false,
    "isWebWorkerSupported": true,
    "isWebXRSupported": false,
    "webGL2Features": {
      "base": {
        "shaderVersion": "WebGL GLSL ES 3.00 (OpenGL ES GLSL ES 3.0 Chromium)",
        "renderer": "WebKit WebGL",
        "rendererUnmasked": "Intel(R) Iris(TM) Graphics 6100",
        "vendor": "WebKit",
        "vendorUnmasked": "Intel",
        "version": "WebGL 2.0 (OpenGL ES 3.0 Chromium)"
      },
      "general": {
        "aliasedLineWidthRange": "1,1",
        "aliasedPointSizeRange": "1,255.875",
        "alphaBits": 8,
        "antialias": true,
        "blueBits": 8,
        "depthBits": 24,
        "greenBits": 8,
        "maxCombinedTextureImageUnits": 80,
        "maxCubeMapTextureSize": 16384,
        "maxFragmentUniformVectors": 1024,
        "maxRenderBufferSize": 16384,
        "maxTextureImageUnits": 16,
        "maxTextureSize": 16384,
        "maxVaryingVectors": 15,
        "maxVertexAttributes": 16,
        "maxVertexTextureImageUnits": 16,
        "maxVertexUniformVectors": 1024,
        "maxViewportDimensions": "16384,16384",
        "precision": {
          "fragmentShaderHighPrecision": "127,127,23",
          "fragmentShaderLowPrecision": "127,127,23",
          "fragmentShaderMediumPrecision": "127,127,23",
          "vertexShaderHighPrecision": "127,127,23",
          "vertexShaderLowPrecision": "127,127,23",
          "vertexShaderMediumPrecision": "127,127,23"
        },
        "redBits": 8,
        "stencilBits": 8,
        "subPixelBits": 8
      },
      "extensions": {
        "maxAnisotropy": 16,
        "supportedExtensions": {
          "EXT_color_buffer_float": true,
          "EXT_texture_filter_anisotropic": true,
          "OES_texture_float_linear": true,
          "WEBGL_compressed_texture_s3tc": true,
          "WEBGL_compressed_texture_s3tc_srgb": true,
          "WEBGL_debug_renderer_info": true,
          "WEBGL_debug_shaders": true,
          "WEBGL_lose_context": true
        }
      },
      "specific": {
        "max3DTextureSize": 2048,
        "maxArrayTextureLayers": 2048,
        "maxClientWaitTimeout": 0,
        "maxColorAttachments": 8,
        "maxCombinedFragmentUniformComponents": 249856,
        "maxCombinedVertexUniformComponents": 249856,
        "maxCombinedUniformBlocks": 75,
        "maxDrawBuffers": 8,
        "maxElementIndex": 4294967295,
        "maxElementsIndices": 150000,
        "maxElementsVertices": 1048575,
        "maxFragmentInputComponents": 128,
        "maxFragmentUniformBlocks": 15,
        "maxFragmentUniformComponents": 4096,
        "maxProgramTexelOffset": 7,
        "maxSamples": 8,
        "maxServerWaitTimeout": 0,
        "maxTextureLODBias": 16,
        "maxTransformFeedbackInterleavedComponents": 64,
        "maxTransformFeedbackSeparateAttribs": 4,
        "maxTransformFeedbackSeparateComponents": 4,
        "maxUniformBlockSize": 65536,
        "maxUniformBufferBindings": 75,
        "maxVaryingComponents": 60,
        "maxVertexUniformBlocks": 15,
        "maxVertexOutputComponents": 128,
        "maxVertexUniformComponents": 4096,
        "minProgramTexelOffset": -8,
        "uniformBufferOffsetAlignment": 256
      }
    },
    "webGLFeatures": {
      "base": {
        "shaderVersion": "WebGL GLSL ES 1.0 (OpenGL ES GLSL ES 1.0 Chromium)",
        "renderer": "WebKit WebGL",
        "rendererUnmasked": "Intel(R) Iris(TM) Graphics 6100",
        "vendor": "WebKit",
        "vendorUnmasked": "Intel",
        "version": "WebGL 1.0 (OpenGL ES 2.0 Chromium)"
      },
      "general": {
        "aliasedLineWidthRange": "1,1",
        "aliasedPointSizeRange": "1,255.875",
        "alphaBits": 8,
        "antialias": true,
        "blueBits": 8,
        "depthBits": 24,
        "greenBits": 8,
        "maxCombinedTextureImageUnits": 80,
        "maxCubeMapTextureSize": 16384,
        "maxFragmentUniformVectors": 1024,
        "maxRenderBufferSize": 16384,
        "maxTextureImageUnits": 16,
        "maxTextureSize": 16384,
        "maxVaryingVectors": 15,
        "maxVertexAttributes": 16,
        "maxVertexTextureImageUnits": 16,
        "maxVertexUniformVectors": 1024,
        "maxViewportDimensions": "16384,16384",
        "precision": {
          "fragmentShaderHighPrecision": "127,127,23",
          "fragmentShaderLowPrecision": "127,127,23",
          "fragmentShaderMediumPrecision": "127,127,23",
          "vertexShaderHighPrecision": "127,127,23",
          "vertexShaderLowPrecision": "127,127,23",
          "vertexShaderMediumPrecision": "127,127,23"
        },
        "redBits": 8,
        "stencilBits": 8,
        "subPixelBits": 8
      },
      "extensions": {
        "maxAnisotropy": 16,
        "maxDrawBuffers": 8,
        "supportedExtensions": {
          "ANGLE_instanced_arrays": true,
          "EXT_blend_minmax": true,
          "EXT_color_buffer_half_float": true,
          "EXT_frag_depth": true,
          "EXT_shader_texture_lod": true,
          "EXT_texture_filter_anisotropic": true,
          "WEBKIT_EXT_texture_filter_anisotropic": true,
          "EXT_sRGB": true,
          "OES_element_index_uint": true,
          "OES_standard_derivatives": true,
          "OES_texture_float": true,
          "OES_texture_float_linear": true,
          "OES_texture_half_float": true,
          "OES_texture_half_float_linear": true,
          "OES_vertex_array_object": true,
          "WEBGL_color_buffer_float": true,
          "WEBGL_compressed_texture_s3tc": true,
          "WEBKIT_WEBGL_compressed_texture_s3tc": true,
          "WEBGL_compressed_texture_s3tc_srgb": true,
          "WEBGL_debug_renderer_info": true,
          "WEBGL_debug_shaders": true,
          "WEBGL_depth_texture": true,
          "WEBKIT_WEBGL_depth_texture": true,
          "WEBGL_draw_buffers": true,
          "WEBGL_lose_context": true,
          "WEBKIT_WEBGL_lose_context": true
        }
      }
    }
  },
  "browserSettings": {
    "isCookieEnabled": true,
    "isDoNotTrackEnabled": false
  },
  "hardwareFeatures": {
    "devicePixelRatio": 2,
    "endianness": "little",
    "screenSize": "1280,800",
    "workerPoolSize": 4,
    "windowSize": "784,626"
  }
}

Licence

My work is released under the MIT license.