Debug

[alvarosabu]

An important part of the DX is debugging.

Currently, there is no easy way to debug the scene or the renderer without much manual effort. Vue devtools is no longer working with the custom renderer.

There are several options we could provide

• A tweakpane-like UI package with proper vue would be ideal (similar to https://github.com/pmndrs/leva) https://github.com/Tresjs/leches
• We could create a plugin for vue devtools https://devtools.vuejs.org/plugin/plugins-guide.html#plugin-setup
• Performance package for monitoring is also important https://github.com/utsuboco/r3f-perf

[alvarosabu]

To continue the discussion here @andretchen0 @Tinoooo @JaimeTorrealba

What if instead of creating yet another package called @tresjs/perf we actually add the functionality to @tresjs/leches ?

Why?:

• Reuse the UI and avoid the user having yet another fixed element on the screen
• Go more to the route of centralized dev tools
• We already have a graphing functionality for the fpsgraph that can be reused for GPU for example

Vote
🍰 to include on @tresjs/leches
⚡️ to create a brand new package called @tresjs/perf

Thanks 🙏🏻

[JaimeTorrealba]

I would prefer to have it in a dedicated repo, in my mind they serve different purpose and are different concepts. I think (been ignorant about the code of r3f/perf) that the performance would need medium/heavy maintain.

But let's wait for the others

[andretchen0]

My vote goes to

⚡️ to create a brand new package called @tresjs/perf

For my own use anyway, I agree with @JaimeTorrealba.

I don't tend to use the packages together:

• I use the perf panes during local development.
• I don't typically use Leches during development. I add it at the end, especially for docs demos.

That said, as long as we have a "blessed" route for including Leches, perf panes, etc., I'm not opposed to either proposal.