Hello everyone,
The website I’ve recently developed ( Fujicsso.me ) is up and running, but due to some transparency needed for the website’s creative direction, seems to perform very poorly considering the assets.
The load time is quite substantial but that is not the issue (the website generates a substantial portion of the models at the beginning, according to a JSON file I provide).
My problem lies with runtime performance. I have only the map + character + 4 items as FBX mesh files (character and items are skinned meshes for animation purposes). The animations are all skinless running at 24fps. The text geometry only has 2 curve segments and the FBX for the map and character well, you can see the polygons in them.
I was wondering what I could do to improve performance. Here are a few topics I believe might help, but I wanted to ask for your advice regarding this matter:
- Object Occlusion: I believe Three.js does not come equipped with this by default. It should improve performance because of the transparency problems.
- Level of detail: Self explanatory, but due to the models base low poly count i do not know to what extent it would be helpful
- Converting to GLTF: I saw some libraries for GLTF compression and whatnot, so I’m wondering if there are other libraries to improve performance for them
- Light Baking: I have a total of 13 lights in my scene - 4 locked directional lights, 3 rotating directional lights, 3 positional intermittent lights (follow the character) and 1 positional light for the fire. I believe blender has that feature for baking lights, so I’d recreate my fixed lights in Blender with the map and bake them there.
I’d be grateful for any suggestions, looking forward for your help!
Thank you