4

I'm looking for a way to call renderer.info using r3f. ThreeJS Doc - WebGLRenderer

As this is an older project I'm still using the class component here to call the render method.

 return (
  <React.Fragment>
    <Canvas >
    </ Canvas>

I need to check my render calls to optimize performance. Hope you can help me.

tinytree
  • 1,009
  • 2
  • 12
  • 28

1 Answers1

8

according to official r3f doc about hooks, useThree().gl is equivalent to WebGLRenderer.

import { useThree } from "@react-three/fiber";
import { useEffect } from "react";

const GetInfo = () => {
  const { gl } = useThree();
  useEffect(() => {
    // gl === WebGLRenderer
    // gl.info.calls
    console.log(gl.info);
  });
  return null;
};

export default GetInfo;

here is working code:

https://codesandbox.io/s/determined-violet-8hqjz?file=/src/GetInfo.tsx

sungryeol
  • 3,677
  • 7
  • 20