React hook to fetch the graphics card information of the client using canvas
use-videocard
This package can be found in the NPM registry, install it using this command:
npm install use-videocard
yarn add use-videocard
import React from 'react'
import useVideoCard from 'use-videocard'
function App() {
const graphics = useVideoCard()
return (
<div className="App">
<p>Vendor: { graphics?.unmasked.vendor }</p>
<p>GPU: { graphics?.unmasked.renderer }</p>
</div>
);
}
useVideoCard (gl?: WebGLRenderingContext): GraphicsInformation
gl
: The WebGLRenderingContext which we want to extract the information from. NOTE: this field is OPTIONAL, the hook creates a canvas without appending it to the dom, but if you really want to specify the WebGLRenderingContext
then set this fieldGraphicsInformation
interface GraphicsInformation {
renderer: string,
vendor: string,
unmasked: {
vendor: string,
renderer: string
}
}
NVIDIA Corporation
Geforce GTX 1070/PCIe/SSE2