feat: use stats-gl v2 (#1749)

Author: RenaudRohlinger

package.json

@@ -71,7 +71,7 @@
     "meshline": "^3.1.6",
     "react-composer": "^5.0.3",
     "react-merge-refs": "^1.1.0",
-    "stats-gl": "^1.0.4",
+    "stats-gl": "^2.0.0",
     "stats.js": "^0.17.0",
     "suspend-react": "^0.1.3",
     "three-mesh-bvh": "^0.6.7",

src/core/StatsGl.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-import { addEffect, addAfterEffect, useThree } from '@react-three/fiber'
+import { addAfterEffect, useThree } from '@react-three/fiber'
 import Stats from 'stats-gl'
 
 type Props = Partial<Stats> & {
@@ -9,26 +9,24 @@ type Props = Partial<Stats> & {
 }
 
 export function StatsGl({ className, parent, ...props }: Props) {
-  const gl = useThree((state) => state.gl)
+  const gl: any = useThree((state) => state.gl)
 
   const stats = React.useMemo(() => {
     const stats = new Stats({
       ...props,
     })
-    stats.init(gl.domElement)
+    stats.init(gl)
     return stats
   }, [gl])
 
   React.useEffect(() => {
     if (stats) {
       const node = (parent && parent.current) || document.body
-      node?.appendChild(stats.container)
+      node?.appendChild(stats.dom)
       if (className) stats.container.classList.add(...className.split(' ').filter((cls) => cls))
-      const begin = addEffect(() => stats.begin())
-      const end = addAfterEffect(() => stats.end())
+      const end = addAfterEffect(() => stats.update())
       return () => {
-        node?.removeChild(stats.container)
-        begin()
+        node?.removeChild(stats.dom)
         end()
       }
     }

yarn.lock

@@ -12635,10 +12635,10 @@ static-extend@^0.1.1:
     define-property "^0.2.5"
     object-copy "^0.1.0"
 
-stats-gl@^1.0.4:
-  version "1.0.5"
-  resolved "https://registry.yarnpkg.com/stats-gl/-/stats-gl-1.0.5.tgz#7f2b6688cc37b3d4bc79749ab122c063528be9c3"
-  integrity sha512-XimMxvwnf1Qf5KwebhcoA34kcX+fWEkIl0QjNkCbu4IpoyDMMsOajExn7FIq5w569k45+LhmsuRlGSrsvmGdNw==
+stats-gl@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/stats-gl/-/stats-gl-2.0.0.tgz#50788125495b54762fd0a0dabe6fdcb12cee73b1"
+  integrity sha512-fDUcbOmcdTJspBBw8BAXXICSpQbL4nbfBdYCWHWoimnfguHmIH3xH+HBCJBjewDOy2EzTJYw3e5fnbALIKTiQA==
 
 stats.js@^0.17.0:
   version "0.17.0"