model-viewer VS three.js

I came across this after finding out about chatvrm https://modelviewer.dev and I was wondering if it would be possible to implement it into silly tavern or if anyone knows of similar extensions? I might try it myself but I really have no idea what I am doing but it would be cool to add any video game character to it with animations for a more realistic rp experience.

Shameless plug: if you are interested in viewing and/or embedding glTF or USDZ files on the web, I worked on an HTML element for that called

"It's like or tag for 3D models"

https://modelviewer.dev/

That said, maybe in your case, if it's a really minimal 3D viewer, it could be that the modelviewer.dev could what you need. You can use it like any other html element and just link it to a 3D model you export from blender as a .glb file. I think it also allows you to add labels.

something free like github pages where can I load fore free about 60mb? basically I am using modelviewer.dev to render a 3d model, but I can't insert it directly into my website because I am using google sites, so I though about using an iframe via github but I am limited to 25mb, which the model is about 40/50mb I can't make it smaller

Anyways, I would suggest that you use package by google. You can find it here: https://modelviewer.dev/ .. It takes care of loading the model and controls as well as show the "view in AR" button on supporting devices. More important than anything, you just give it the model and it takes care of everything else.

I was going to use this: https://modelviewer.dev/

I'd like to get the google 3d model-viewer working on Ordinals: https://modelviewer.dev/

Regarding the optimization of the effect, I found an issue on the three.js GitHub repository: https://github.com/mrdoob/three.js/issues/14104 The alpha channel issue seems to be a difficult problem, which has been present since 2018. At the end of the discussion, a solution proposed by a contributor is not to modify the UnrealBloomPass but to blend the source texture and target texture in the shader.

Here's how we used Three.js to place and find affirmations in the sky.

Three.js is dedicated to generating 3D visuals, offering a powerful suite of features and tools. It is built atop WebGL and optimizes GPU usage for rapid rendering, ensuring smooth performance across devices, including those with limited resources. Three.js's versatility allows for the creation of a vast spectrum of 3D graphics and animations, ranging from simple shapes to intricate models.

7. three.js

Most of frontend libraries are made with Vanilla JS. An example of library that you might frequently use is "Chart.js". But React is not compatible with Chart.js so here it comes "React-chartjs-2" A wrapper library to work with Chart.js in React ecosystem. Oh you want to use "three.js" for some cool 3D? you will need "React-three/fiber". In my case, I need to implement "telegram-web-app", not so fast, I have to create my own wrapper to be able to use it.

For one of my 100-Day Challenges, I chose to dive into Three.js, a JavaScript 3D library. It's easy to start learning, and it becomes difficult to master with the inclusion of shaders.

Nonetheless, it offers nearly infinite possibilities. You can code and create anything, from a mobile app with React Native to a desktop application with Electron.js. Furthermore, JavaScript provides excellent frameworks and libraries that can be applied in various approaches, such as React, Three, Vue, Meteor, and Astro.