Developer tools for 3D library three.js.
Three.js Developer Tools - Chrome Extension
Three.js Developer Tools is a Chrome extension that offers developer tools for the three.js 3D library. It allows users to inspect the scene graph, objects, materials, and textures. Additionally, users can view renderer information and modify entity values directly through the developer tools.
Extension stats
This extension was removed from Chrome Web Store on
2022-06-15
Risk impact: High risk impact
Risk likelihood:
Manifest version: 2
Permissions:
Size: 1.34M
Email: ex*****@jsantell.com
URLs: Website
Other platforms
Not available on Android
Not available on Firefox
Not available on Edge
Want to check extension ranking and stats more quickly for other Chrome extensions?
Install
Chrome-Stats extension
to view Chrome-Stats data as you browse the Chrome Web Store.
Extension summary
Developer tools for 3D library three.js.
Currently supports inspection of three.js scenes and renderers. While currently an early alpha stage, a handful of features are supported:
- Inspect the scene graph
- Inspect objects, materials, textures
- View renderer info
- Modify entity values via developer tools
User reviews
very useful for thee.js developers
Thank you
I just got started with ThreeJS and this tool is very useful to tinker around with the lights' colors and the meshes!
The only difficulty in getting started is to know where to put the extension's observer code. I put it at the end of the animate function like so:
function animate() {
requestAnimationFrame(animate);
// ...
renderer.render(scene, camera);
// Observe a scene or a renderer
if (typeof __THREE_DEVTOOLS__ !== "undefined") {
__THREE_DEVTOOLS__.dispatchEvent(
new CustomEvent("observe", { detail: scene })
);
__THREE_DEVTOOLS__.dispatchEvent(
new CustomEvent("observe", { detail: renderer })
);
}
}
And then you just have to open the "three" tab in the Chrome Devtool. Enjoy!
Very lightweight / not many features, but certainly better than nothing (I am shocked there is no native option similar to the editor on threejs.org, like A-Frame has via CMD + OPT + i?).
Installation is not straightforward, so if you're stuck:
Step 1 - Follow instructions under "Current API" (https://github.com/threejs/three-devtools)
You'll need to add that code to your page (rename the variables according to your logic), or run it manually via console.
Step 2 - Restart Chrome
Extension safety
Risk impact
Three.js Developer Tools requires some sensitive permissions that could impact your browser and data security. Exercise caution before installing.
Risk likelihood
Three.js Developer Tools may not be trust-worthy. Avoid installing if possible unless you really trust this publisher.
Upgrade to see risk analysis details
Similar extensions
Here are some Chrome extensions that are similar to Three.js Developer Tools:
Three.js Editor Extension Vue.js devtools Vue.js devtools (beta) Shader Editor WebXR API Emulator Spector.js Redux DevTools Audion PixiJS Devtools Apollo Client Devtools Svelte Devtools 稀土掘金 Shadertoy unofficial plugin. VisBug Octotree - GitHub code tree MobX Developer Tools FeHelper(前端助手) daily.dev | The homepage developers deserve OctoLinker Save All Resources Web Tracing Framework FPS extension Vue Telescope LiveReload
https://www.clicktorelease.com
2.70
3,000+
https://vuejs.org
4.16
2,000,000+
vuejs-dev
3.79
100,000+
https://www.clicktorelease.com
4.29
5,000+
Mozilla Mixed Reality
4.30
30,000+
babylon.js
4.64
30,000+
Redux DevTools
4.63
1,000,000+
Chrome Web Audio team
3.13
4,000+
Bob Fanger
4.29
10,000+
https://www.apollographql.com
2.64
200,000+
RedHatter271
3.26
19,811+
https://juejin.cn
3.57
100,000+
Patu/AberrationCreations
4.54
6,000+
https://visbug.web.app
4.80
200,000+
https://octotree.io
4.86
300,000+
Andy Kogut
3.31
20,000+
https://www.baidufe.com
4.70
200,000+
https://daily.dev
4.83
400,000+
https://octolinker.vercel.app
4.88
20,000+
singhashok61619
4.62
300,000+
https://google.github.io/tracing-framework
3.64
3,000+
Yuri Artiukh
3.28
9,000+
https://vuetelescope.com
4.82
20,000+
https://livereload.com
3.80
100,000+