Texture Relation With FPS?

[NasimiAsl]

hi

i test some stuff about Texture and see a interested result 

in a large scene and one time use material with colorfull paint all and keep other effects http://185.88.152.44/   i see fps between (45 - 60 ) and zero Ram Take

and make that scene just with textures (i test DDS and Small Text too )  http://185.88.152.44:9191 i see fps between (25 -40) and 2 GB Ram take

any way to manage texture in buffer for optimize that?

* for samples wait to load complete and see around in first time (it is not have loading or prepare stuff)

I really don't understand 2G ram!!! -  all my uncompressed texture size is 100mb 

thanks for your any  advise about this . 

 

 

[NasimiAsl]

re-challenge to check that why i lose fps when i have  texture i really can't find a way for fix this!

i think we have this in other large scene. (maybe)

[GameMonetize]

Do you reproduce it in the PG?

[NasimiAsl]

try to make it  

37 minutes ago, Deltakosh said:

Do you reproduce it in the PG?

 

[dbawel]

@NasimiAsl -

Wow, I've never had a WebGL scene take down both my high end laptop and my desktop as well - which I keep maintained, optimized, and free and cler of all issues daily. And your scene forced me to cause a hard reboot on both machines once I tried to use any GUI functions. This was the reult of your http://185.88.152.44:9191  scene - which actually loaded on both machines, however the load time was abnormally very long, and I was able to have enough time to make a sandwich before it fully loaded on my laptop. This would already allow me to guess at one serious issue - which is your use of textures. From the loading time alone, I would assume that you are using non power of 2 textures, and also using abnormal (X,Y) resolution (again, non power of 2) as well as resolutions in X and/or Y above 1024 - which is almost never useful if you do the math on even the highest browser resolution displays which are running 2550 in X. And if you intend on using your camera to zom far enough into a texture where ixels are visible at 1024 X 1024, then there are far more efficient ways to do this and you'll discover many other issues when atemptin such an action.

So o course the first thing I trid to view was the JS console, which after 10 minutes, I had to force a hard shutdown of my first machine as no program would repond once your scene loaded. The same occurred on my desktop, however, I was able to get some response from your GUI - which was simply a "working" icon - which again I had to force a mnual shutdown after 10 minutes of waiting. 

So I certainly am not able to troubleshoot anything, as my Machines and software are as FAT as they get. If I had to troubleshoot this, I would create a single 512 X 512 texture, and use this one texture in your scene to replace every other texture you're curently using by name. This would be the fastest, and possibly only way I would be able to begin to troubleshoot. Rename your texture directory, and populate a duplicate with the same 512 X 512 texture using all existing names from your original texture directory. This should allow you to work on your scene, and to quickly identify all problems - which are most likely problems with textures. Who knows what else might be an issue - perhaps nothing - but there's no way for anyone besides you to troubleshoot this, unless they have the same access to the source as you do. 

Follow the advice above, and I'm almost certain you'll have an answer in short time. But obviously I cannot justify this until I and others are able to access the source ourselves.

Good Luck,

DB

[NasimiAsl]

@dbawel  first i have two big thanks   for you one for test it and one for care about question . nice man 

i wanna test it in PG and share it

about time : in local area ( server location : iran) we see it faster but my server is low resource we have 25MB it can be fix for next time

can you test : http://melyon.ir and see the time in there?

 i continue this post after i make PG   i debtor  you so any time you need any thing ( if i can do with my poor ability ) don't wait just text me

 

 

 

 

 

[dbawel]

@NasimiAsl -

I looked as closely as possible at your http://melyon.ir  scene, and the one issue that is causing serious loading times and WebGL errors is your use of DDS files. Is there a reason why you need to use DDS files? In debugging this new scene, I can see many errors related to the DDS format - including of course, the "Invalid Magic Number" error which is telling me that the headers of the files aren't providing correct header information which is expected by these files as defined by the usage in your scripts. This could be due to these files containing more than 8 bits per channel, which is generally the cause for these errors in the console. It could also be telling us that these aren't standard DDS files, and are often unique to a specific platform such as a development framework outside of WebGL which uses DirectX such as Xbox, Game Cube, etc. You will undoubtedly run into issues in using DDS files, and to correct these issues requires loading them into a program such as Photoshop and exporting them again as DDS files - although if there is no need to use the DDS format (which I don't believe was your intention for the final application), then I highly recommend using similar compression file formats such as .png or .jpg to maintain compatability at 8 bits per channel. But if for some reason unknown to me you need to maintain headers for what were once recognized as within the DDS file format, loading these into an application such as Photoshop and re-exporting SHOULD correct the header errors and you shouldn't continue to recieve the "Invalid Magic Number" error, as this is almost always an invalid header issue.

I also am finding many textures (most all) which are not power of 2 textures. I hope I'm not providing info you already know, but many developers believe that a 1:1 aspect ratio such as 150 X 150, 200 X 200, or 48 X 48 image sizes such as I see in your scene are power of 2 textures. Changing these to 128 X 128, 256 X 256, and 64 X 64 respectively for example will be far more efficient in bufferring and rendering, as well as improving your CPU performance. I also see animated .gif files which I assume are being read as DDS files in their headers (providing some of the Magic Number errors) due to the animation embedded in the image files - depending on the application you used to write these files. And many files which have very abnormal aspects ratios require additional processing; and in reviewing your scene, these are definately causing performance issues as well as massive amounts of WebGL errors. 

So if you consider your average target resolution(s) for the devices you need to support, the first step I would take is to re-convert all image files - specifically those used as textures in your babylon.js and any other WebGL functions - to true power of 2 resolutions in support of your target resolution(s), as this will improve loading time and performance dramatically. So unless essential to your scene, I would convert ALL image files (including existing power of 2 textures) using an application which will correct all image headers to remove any association to the assumed DDS file format(s), which will correct most all other errors in the JS console and which are causing considerable performance issues.

I didn't find any video textures, however, you might want to look at whether your server supports partial requests, as beyond video, there are advantages to incremental loading of any sizeable elements which aren't necessary to load until the request is made by the user's actions; however, I personally don't see this as a priority at this time, as we need to review performance again once you optimize the obvious texture and general image issues.

Also, if I were to be working on this scene, I would not make the "tablet screen" which is represented by a plane mesh visible until the "tablet" mesh(s) are fully animated into position in front of the camera - which is a simple task and will appear much more natural an action to the user. I hope what I'm suggesting makes sense to you. I wish I understood the language, as I can only get so far in using your merchandising application. However, once you optimize your image files and remove all DDS headers, your performance should increase quite allot, and I'm curious to see where else you might be able to improve performance - if necessary following the above recommendations. Otherwise, you have built a very nice mechandising application. If you have time to write an english version so that those of us who are ignorant to other languages can navigate fully through the app, this would help troubleshoot further if necessary. However, as I mentioned previously, this may not be necessary, as you'll greatly improve performance by simply optimizing your image files and re-exporting to correct your header errors. But I personally would love to experience all you have created in this app.

Cheers,

DB

EDIT - Also, I don't see how you could possibly make this a playground scene, as it is simply too complex to convert wholly onto the playground. However, if there is a specific issue which you have, then of course it is always worth reproducing a specific "issue" on the playground for any user to modify and assist you in finding a solution. But I believe you will be able to correct any issues you currently have as the errors I see are very obvious ones and have very clear methods to correct these.

FYI - On average, your latest scene uses between 16 - 18 seconds to load, and another approximately 13 seconds "idle" time before all graphics are drawn and animation begins; timing all activities from your server on my fastest system. This is not a tremendous amount of time considering your scene, and you should be able to reduce this time, as well as improve your performance overall. However, improving your framerate will most likely require rethinking your scene elements quite a bit, and optimizing and/or streaming elements as required by user interaction.

[NasimiAsl]

thanks @dbawel 

i am on the PG it is finished  we can test it in PG thanks 

[dbawel]

@NasimiAsl -

If you were able to find the time to organize your scene for the Playground, then I'm impressed at the effort you must have put into accomplishing this. If this is completed, please provide the link to your playground scene, as I'd love to see how you managed to get all sripts, references, and extensions associated correctly. Also, Are you going to load and re-export all image files to power of 2, and to correct the additional un-necessecary data in your image file headers identifying them as DDS files even though they do not have a .dds file extension? Please let me know, as I'm eager to test your scene and memory, CPU performance, and load time once the image files and headers are corrected.

Now that I have reliable benchmarks for your last posted scene, I can accurately measure and compare against past performance, and you can troubleshoot and optimize much easier once you've corrected your image files and headers. So I'm eager to test once you've optimized all that is obvious; which shouldn't require more than an hour to complete - as I'm certain you'll need to make GUI modifications to accomodate different image resolutions for your GUI buttons and controls.

Please keep us posted to the new links, and I'll be happy to report my findings and to assist in mking any further optimisations - especially for mobile devices if this is your target, as I have most every mobile device type as well as OS, and various dated versions and models of the most common devices, OS, and browsers to help discover any issues specific to any attributes apart from the most common of devices. I'm happy to assist as I'm fortunate to have many devices, OS versions, and browser versions to test. And it only takes me a few minutes to benchmark each device to see if there are additional ways to optimize in general; to accomodate most variations in mobile performance.

Cheers,

DB

EDIT - In a recent post you make the claim that your ability to develop in WebGL is poor at best. However, I don't see this at all as you are quite proficient in writing the code that I've personally inspected and tested thus far. So please don't sell yourself short, as in my opinion, you have quite a talent for deleloping in HTML5 and WebGL - not to mention your grasp of the babylon.js framework. The only issues I see are common to many experienced developers, which are understanding how WebGL handles operations and what is required for the best performance on a wide range of devices. And there is so very much to learn, experience, and build the knowledge from which very few people are able to develop a complete understanding of so many different disiplines and have the experience required to complete applications such as your current project.

I'm on this forum daily to learn from every other user including yourself, which I have certainly been exposed to new knowledge through many of your posts currently and in the past. I'm certain you know that your value on this forum is well noted by myself and by other users. And if you're poor at this, then I'm horribly bad - as you're abilities are far beyond mine in most every way. I'm just happy if I can assist you with any unique experience I might have - which is only due to my entry into proceedural graphics when there were only three companies in the world producing CGI for film; as well as personally pursuing motion capture and computer animation before it was taken seriously and believed to be anything near practical.

[GameMonetize]

I have to second you on that: @NasimiAsl is a pretty good WebGL developer!

[NasimiAsl]

I have to second you on that: @jerome , ... (a lot of names in here just forgive me  ) is a pretty good WebGL developer!

and thanks @Deltakosh i think you wrong in this(you last post) stuff  but thanks

[NasimiAsl]

back to Post

i find  Exact what i look

http://www.babylonjs-playground.com/#1TYWYB#116   painted scene FPS : 60

http://www.babylonjs-playground.com/#1TYWYB#115   textures(without scaled) FPS : 60

http://www.babylonjs-playground.com/#1TYWYB#114   textures( scaled for Tile) FPS : 35 and some where 60

Why ?

 

 

 

 

[NasimiAsl]

On 5/28/2016 at 0:49 AM, dbawel said:

I personally would love to experience all you have created in this app

i use some new stuff in Melyon Project

1. $3d independed plugin for use Webgl framework for render 

    you can choose your wanted framework and write some a little migrate and see your result 

   it is not useful a lot (for now) i use it for babylonjs  and three js (with some bug in transparent (and a lot of bug in deep )) (not recommended )

2. $3d.Tools (shaderBuilder and GeometryBuilder i rewrite flexible version and commit that i am on GB for now  )

3. Color Identity System very Useful System for get Information from GPU it is new

http://melyon.ir/#raycast see i get all  collision and distance and walkon and lookin and closeto events from this (go inside the dress shoping  )

 i share some sample in here 'GPU pick  system' 

4 Some Toos fo Generated Shader and Geometry ( i think i publish it with 2.5 BJS)

5. New Rig System and Animation all GPU side T-rex Sample ( http://www.babylonjs-playground.com/#1TYWYB#111  )

 in scene for rotate Advertisements and other move stuffs 

Cheers

Naz (wingnut like this name )

[GameMonetize]

Can you point out where (in your playground) the code is for " scaled for Tile" ?

[NasimiAsl]

51 minutes ago, Deltakosh said:

Can you point out where (in your playground) the code is for " scaled for Tile" ?

i use the ShaderBuilder 

the final code is " texture2D( txtRef , uv*0.001  );  vs texture2D( txtRef , uv );  "

i used Same shader i forget clear source see this it is same result

  mesh.material = new BABYLONX
			  .ShaderBuilder()
			  .Map({ path: 'http://i.imgur.com/uIlHvAP.jpg', scaleX: 1, scaleY: 1 }) 
			   .Back().BuildMaterial(scene);   
			

see scaleX and scaleY you can test it with standard material too 

http://www.babylonjs-playground.com/#1TYWYB#118

http://www.babylonjs-playground.com/#1TYWYB#117

i test it with 50 small box and scale texture but don't loss FPS

it is happen when we have big plans and have 10 or 20 face like this around camera 

[dbawel]

@NasimiAsl -

So in testing your scenes and making comparisons on multiple devices, I do find a difference in fps between your 3 scenes - especially when I'm using devices with lower CPU speed and bandwidth. I've looked at all operations, and the main difference I can see is in garbage collection - specifically Major GC. There is substantial latency when scaling your textures, as the time for script evaluation is increased considerably due to an average increase of 20 - 25ms for Major GC. There is very little additional information provided since Garbage Collection (the differences between Major CG and Minor CG) covers such a broad range of potential memory operations. However, in the case of your scene, the cause for increased Major GC is almost definately the scaling of your textures in U and V, as this latency is due to your processing threads stopping until Garbage Collection is finished, as is usually the case.

I would assume that you should be able to improve your scene performance when scaling if you use a lower power of 2 texture resolution since you're using the same texture resolution when it's not necessary when scaling to a much lower display resolution per texture upon rendering. Keep in mind that you are also increasing the CPU calculations for interpolating pixel color when scaling and tiling textures when moving the camera - which is why the frame rate is dynamically lowered when translating (moving) your scene camera. So both of these - the additional processing required for color interpolation of your rendered mesh when translating your camera - and the memory management due to these changes represented by Garbage Collection - are definately issues and most likely the main cause for the drop in fps specific to your Playground scene http://www.babylonjs-playground.com/#1TYWYB#114   .

Cheers,

DB

[GameMonetize]

Losing perf when all the screen is covered (so all the screen needs to be render) is not surprising.

All pixel have to go through the pixel shader. The problem to me is that by just adding a " x0.001" you lose so many FPS

[Dal]

Also you are doing "new" every frame which is going to create lots of garbage... can't you just update the existing object rather than make a new one?

[NasimiAsl]

Dear Dal it is not True  I think i have just 10 object in first time 

[NasimiAsl]

i starting make some TileGenerator for use in this case it maybe return 60fps  i share that after do

Thanks all for looking this post when i see something and don't understand why i do like wild man to find why sorry ask this post and take time for yours (special @dbawel ) 

[dbawel]

@NasimiAsl -

I thoroughly enjoyed reviewing your scene, as I'm happy when I have some specific experience which might help a talented developer such as youerself to better understand what might be occurring in a scene - especially in optimizing latency, evaluation, and rendering. Thank you, and please let us know when you are able to improve performance so that the forum can learn from your time spent on troubleshooting this.

Cheers,

DB