2021-09-10 at 6:14 am #44486
I’m having trouble reducing my project load time and is currently ~20 seconds on average (down from ~40 seconds). I have already reduced project triangles by 75%, made most material images jpg’s, removed unnecessary objects, and edited the project settings to allow for more performance. After doing all this my load time only reduced by 20 seconds, and I’m not sure what else could be done to significantly reduce load time. I’m hoping to get the load time down to 5 seconds or less, but will settle for nothing less than 10 seconds.
Here is a dropbox link to my project folder:
This is my website that the project is for:
The password is: dokwonski
Thank you.2021-09-10 at 7:38 am #44497Mikhail LuzyaninStaff
As I can see in your scene there’s a lot simple b/w textures that can be combined into one RGB texture to reduce texture sizes, there’s alos some textures that can be resized from 2k to 512×512 or even smaller, you also can even remove some of the textures like marble016_2k_normal.png and nobody even see the difference because this textures does almost nothing. Such texture like wood_mdf_001_opacity can be resized (or cropped) to 64×64 size without loosing any texture quality and so on. There’s still a huge amount of optimization with textures that can be done, some of the textures like water can be removed and replaced with a simple color shader because not only size of the texture matter but also it’s weight and amount. You also can combine some shaders into one to reduce amount of shaders in the scene. Look at this common recomendations.
Co-founder and lead graphics specialist at Soft8Soft.2021-09-10 at 7:42 am #44498Yuri KovelenovStaff
I checked browser console (opens with F12) and it looks like your app is very big in file size. There is certainly room for improvements, making textures less and converting them to jpg. You might get rid of some non-essential textures altogether. Try to make it under 20 Mb.
Attachments:You must be logged in to view attached files.2021-09-10 at 4:33 pm #44513
I haven’t updated the website to reflect the optimizations I’ve done yet, so the website shows the app to be 100+ Mb whereas the optimized version is around 17 Mb. I do know there are more optimizations to be done with my textures and such, but is there anything else that can be done on top of that? I would assume reducing the app size by ~85% would reduce the loading time a lot more than it has, so I’m wondering if there’s something else going on that’s affecting the loading time.2021-09-14 at 4:12 am #44608
I have since done further optimizations and made several project changes, but my loading time is still stuck at ~20 seconds. However, after adding the “print performance info” puzzle it seems my scene actually takes ~3.5 seconds to load. Here is a screenshot of that info:
Also, I notice that when loading the scene is loads smoothly for ~5 seconds and then freezes for ~15 seconds where it seems to be doing nothing until the scene loads. It seems to me like there’s some sort of problem is going on that should be fixed, but I’m not sure what to look for. Here is an updated link to the project folder:
The website information given earlier in this discussion still applies, and it should be updated to the current version. Please let me know if there’s anything that can be done to get the load time down further.2021-09-14 at 4:59 am #44609
Optimization is a big, nasty, long, tedious process requiring lots of testing and validation as I am sure you know.
Puzzle optimization is key as well as minimizing render calls, texture count and poly count.
My only suggestion to you is to put everything into procedures and then go through your scene disabling procedures and see what procedure is giving you the largest load time….then optimize that one…and continue the work.
When you get a chance I would upload everything to the Verge3D server and see if you get better performance. I would bet you get better performance from Soft8Soft than you do where you are hosting it now.
Route 66 Digital
Interactive Solutions2021-09-15 at 12:44 am #44652
When I am timing the loading screen it is on Soft8Soft, and only publish that version to my website when I’m trying to get help on here. I have gone through many processes of optimizing the project, but the loading time has remained unchanged. My scene’s loading time was ~20 seconds when the project was 110+ Mb, and the scene’s loading time is ~20 seconds now that the project is under 10 Mb. My puzzles are not very complex/intensive, and I hope to add many more in the future. I have reduced my triangles by over 300% down to under 50,000. Nothing I do to optimize seems to have any effect on the project’s loading time, is it possible there is a problem with the project that is significantly affecting the loading time?2021-09-16 at 6:51 am #44718
I downloaded the files from dropbox and started going through the project. I know a lot of work went into this so please take this as trying to be helpful. I have identified a few optimizations you will want to make. No single optimization will yield significant results but as a whole…it will be substantial.
I uploaded it to Soft8Soft for a baseline…and got it to load in about 12 seconds. (removed the blends, backups, .bin, etc.)
I messed around removing almost everything out of the main puzzle tab and put your start-up puzzles into a procedure and then moved all your onclicks to their own tab.
Re-uploaded and the time then was about 8 seconds.
The puzzles are simple…the load scenes in this version are not correct so I disabled those.
After reviewing the Blend file and the project file there is a lot of optimization left to do…with respect to textures and topology.
topology – your objects are not uniform and are primarily based on triangles rather than quads. Given the small amount of geometry you have, I don’t expect too much in loading performance from making this change but I would expect run time performance gains especially on mobile devices.
There is a lot of detail that is not seen from the viewer’s perspective. I would remove any geometry that will not be seen. Specifically, the small flag orbs have a cross opening in the back that is not seen even when I stretch the application to 4K. There are other pieces of geometry throughout that you can optimize as well. This will have an effect on load time as well as run time.
Materials…this is probably one of the areas that will yield you the largest benefit as far as load times. There are 39 textures total in the scene… including 6 normal maps. The 39 textures are small and should be put into a single atlas map. Given the level of detail in the scene when viewed at 4K you could delete most of your normal maps without much detail loss.
If you do this you should get your load times… under 5 seconds not to mention your draw calls will drastically go down and run time performance and FPS will go up.
For best performance … 1 atlas texture mapped to all your objects.
Object Joining. You will want to minimize the overall number of objects in the scene. You want to join all the parts that will use the same atlas texture if possible. For best performance, you want as few individual parts as possible. I think you have a 100+ objects…and I think you could get this down to about 10.
Text – 3D text labels vs. PNG text. I would dump the 3d Text and replace with simple plane meshes with a PNG or I would have the parent window use SVGs and bind them to your objects.
Procedural Materials – these are very very very expensive with respect to performance and double with each light. Keep your materials simple. BSDF with an image texture…thats it. You will have to create a blend file with all the objects and bake all our materials out. For the Vindicator object (the only one of the procedural maps that can be seen to be animating)…you might want to leave that one alone….but everything else can be a static map. You can then depending on how hard its dragging load times go back and replace it with an animated map.
Lights: I would recommend getting rid of your lights and only using an HDR background to light your scene. The lights cause too many calculations to be made and slow things way down.
OK…well…I did the next thing and stripped out your textures and tested the load time and it loads within 3 seconds.
So once you optimize your materials/textures, lights, and get your geometry clean…this will run extremely fast.
Route 66 Digital
Interactive Solutions2021-09-17 at 4:46 am #44766
Thank you for the very in depth response. By the way, you can be as critical as you want, I will never take offense and just want my project to be as good as possible. I have been able to get the project down to ~12 seconds load time from your response and still have more to do, but first I have a few questions as I’m pretty new to all of this.
Are there any good tips for making puzzles to try to keep the loading time down? After messing around I noticed the puzzles seem to have a heavy impact on performance. As for the textures, how would I go about fitting all my textures into one map? I’m not really sure where to start for doing that or how it would work in general. Also, would changing object geometry from mainly triangles to rectangles require redoing the modelling, or would there be a simpler process for doing that?
Thank you again for your help so far, I just started with blender and making websites in April, so I still have a lot left to learn and you have been very helpful.2021-09-17 at 6:19 am #44767
OK… for this project… I don’t think you need to spend any time remodeling and your puzzles are pretty simple…so although you would might see some optimization…I would do that after the long task of baking atlas maps.
If you have and are familiar with Photoshop / Affinity Photo or other photo editing software this will make things alot easier.
Since you are using blender…you have a number of options including some plugins ( in my opinion the baking plugins are more trouble than they are worth for this process ). If you choose to do this method I would suggest Simple Bake. Video of process shown here:
The by-hand method takes some practice in order to get the idea down but works better for me at least and its very simple once you get the hang of it.
So here is where you can really up the quality of your content.
The real key here is baking maps only works using Cycles. It wont allow you to do it in EEVEE. The good news is you can go all out and setup as many lights, shadows, emissions, etc. and make your scene look incredible.
Then you are going to bake all the lights (shadows that are not animated and or have animated things cross them), you can add AO, etc.
The bake process takes FOREVER.. take a small vacation for a few days.
I bake my textures out at 5000 to 10,000 samples (you might not need this high of samples…test your scene and determine whats best) and at least 8Kx8K resolution.
I do this because blender cycles renders are noisy and you can take the large image into Photoshop or other and denoise it and then further smooth it by scaling it something acceptable such as a 2K by 2K PNG (dont use JPG). The file might be 3.5MB but it wont matter. It will look great and only has to download once.
Once you have your map, you will go back to rendering in EEVEE and dump all the lights, reassign your UVs and assign your textures.
Route 66 Digital
- You must be logged in to reply to this topic.