gryff

Using Compressed Textures - Now With A Playground!!!

Recommended Posts

I've been following this issue on and off - mainly through @JCPalmer's posts on various threads. There is also a tutorial on the BJS documentation site (written by JCP?) That tutorial gives a little bit of code  to let the .babylon engine know that compressed textures are available:

var available = ['-astc.ktx', '-dxt.ktx', '-pvrtc.ktx', '-etc2.ktx', '-etc1.ktx'];
var formatUsed = engine.setTextureFormatToUse(available);

But I have a couple of questions:

1. The BJS Blender Exporter will take the textures I have used in Blender (.png or .jpg usually) and the .babylon file created will include those pngs and jpgs. So will those two lines of automatically use a .ktx version instead - over-riding the .babylon file?

2. " The texture must be encoded with the Y-axis flipped ". Flipped so that is where the X axis was ie, 90 degrees, or mirrored on the Y axis?

3. Is the device being used automatically detected so that a low level compression format (etc1)will be used on certain processors but a higher level format (astc) be used where appropriate?

I've done some tests on compression with a simple tiling png texture (570kb) and compressed it using the Mali Compression Tool and the results are impressive - a .ktx file size of 129kb (etc1)

cheers, gryff :)

Share this post


Link to post
Share on other sites

1. Yes, at the last minute, a file name like "myfile.jpg" will get switched to say "myfile-pvrtc.ktx" for iOS.  This is happening just to the string of the file name to get.  Windows would probably be "myfile-dxt.ktx".

2. Basically, this generates an upside down texture.  The reason it is needed is image textures are flipped in the process of being uploaded to GPU by Engine.  Compressed images cannot be modified by the cpu, so this has to be done at the conversion or baking from image file to ktx file.  There is a checkbox in the PVRTexTool when encoding.  I did not include pictures of it in doc to be both tool independent-ish, & they said this might be changing.  Why this is done Engine, I have no clue.

encode2.thumb.JPG.c1fdcf3e6c191efa86b8e0db3e1c0b80.JPG

3.  I might have left it off the doc, but given a machine has astc & etc1, engine will decide to assign astc automatically.  I did not want people to have to know all the formats & which was better, so I have engine do the deciding.

Share this post


Link to post
Share on other sites

@JCPalmer; TY Jeff for the reply. I've been testing and thinking about this compression of textures and a some more questions:

1. The simple one first - what version of BJS is minimum for this? I have a test scene here and it does not work -  BJS2.5. Now maybe my coding is crap but I am getting "engine.setTextureFormatToUse is not a function"

2. Will it work with Skyboxes - they seem to require jpgs. I can't get .pngs to work :o

3. And there is no way that they will work in the Sandbox or Playground right ?

cheers, gryff :)

EDIT: Got the latest version of BJS 2.5 and my scene works now.So ignore Q1.  But that creates another question - is there anyway to tell that is is using the .ktx file? I tried printing out the material to the console but it seems to still refer to the original file - a png format.

Edit2: I tried sending the variable formatUsed to the console with :

console.log("Texture Type = " + formatUsed);

but it returns null :(

Share this post


Link to post
Share on other sites

I don't know if this can be useful to someone, but I put it here : https://www.nothing-is-3d.com/dl/babylonJS/KTXtextures/

This is just a test scene to see what type of texture is loaded on the hardware.

[edit] weird, when I load my scene locally (with easyphp) on windows 10, I have a dxt texture ; but on my ftp it's only png which is load :blink: Where I'm wrong ? [/edit]

[edit2] added a download link for sources[/edit2]

[edit3] upgrade to bjs 3.0 alpha to make it works [/edit3]

Edited by V!nc3r

Share this post


Link to post
Share on other sites

It loads png (win10 in chrome, FF, Edge, Opera)
Can it load astc?


I see now, I have a Nvidia GTX-970, and it is only supported on Nvidia Tegra. Maybe.
Does this work for anyone on a desktop, and if it does, what is your GPU?


 

Share this post


Link to post
Share on other sites

This is a 3.0 feature.  That nothing-is-3d site launches 2.5 according to the console.  Might be your issue as well.  DXT / S3TC is old as dirt.  The patent on it expires on October 2, 2017, I would be shocked if anyone doing webgl would be running something which did not have it.  Only the framework for it is implemented on 2.5.  Might be your issue as well @gryff.

ASTC can run laps around it, but Apple really needs to expose it before most people have the hardware to use it (A8 cores & up).  I have a NVidia GTX 1050 on my desktop, and it still not supported.  There is a more powerful model, but this exceeds my needs, it is really short, and requires NO additional power connections.  $130.

I have made the changes to handle skybox textures, but have not tested that.

From a sandbox standpoint, the limits with that "crossover stuff" applied to both image & compressed textures.  So if a compressed texture should work from the same place as a jpg.

Null is a valid response, but I only expect it to occur on either very old phones (my Galaxy S3 has etc1), or people trying to use it with 2.5.

Share this post


Link to post
Share on other sites

@V!nc3r : Thank you for posting that really useful demo and updating to BJS 3.0 - good to know I was not going mad :o

I will post my results in a while as all my tests, bar one, were done with the old BJS2.5.

@BitOfGold The one I have done since the BJS update

Desktop PC : Windows 7, NVidia 1060, Firefox 52 - DXT

More later.

cheers, gryff :)

 

 

Share this post


Link to post
Share on other sites
28 minutes ago, JCPalmer said:

Only the framework for it is implemented on 2.5.  Might be your issue as well @gryff.

Looks like it Jeff. As it now seems to work on my Windows 7 desktop.

cheers, gryff :)

Share this post


Link to post
Share on other sites

I also need to pull out ATC format.  Google is trying to ditch it at Khronos.  I cannot fined a ktx converter to support it anyway.  It has not been a priority, though ripping out 4 or 5 lines out of engine & that doc is not difficult, assuming you know which lines.

As 2.6 turned to 3.0, seems like it will not be production for a while.  Except for making this, I have stayed well away from 3.0.  Once the feature set is complete many people are going to need to do extensive testing.  Apple & Google also really need to put out their WebGL 2.0's.  Not waiting for them (assuming that they are not too far) or we might need a really fast 3.1.

Share this post


Link to post
Share on other sites

@V!nc3r : an update on my devices and your test scene.

Done with Firefox Latest version

Windows 10 Laptop, Windows 7 Desktop, Windows XP Desktop ( yeah I know:o) - dxt

Samsung Tablet Tab A - Chrome - png.

Which leads me to a question. I have been using the Mali Compression Tool (link above) but it does not create a .dxt image. I downloaded the PVRText Tool yesterday but can't figure out what settings to use for creating a dxt type file. Any help - much appreciated.

cheers, gryff :)

Share this post


Link to post
Share on other sites

@JCPalmer : Thanks Jeff :)  I will investigate further this evening.

Nothing like making it simple BC1-7 and DXT1-5

Also I've seen something called WebP which I guess originates from Google. Feels like a bunch of dogs fighting over a bone for the best alternative to png and jpg :o

cheers, gryff :)

Share this post


Link to post
Share on other sites
On 17/03/2017 at 6:09 PM, Deltakosh said:

Done :)

 

@V!nc3r do you mind creating a PG so I can reference it from the doc?

I've no idea how to link external texture references on the playground, and where to put setTextureFormatToUse before the scene loading :ph34r: If someone can help :)

Share this post


Link to post
Share on other sites

Although I have the compressed file working - and my madness seems to be over - I continue to explore using compressed textures. So an update.

In @V!nc3r 's set of images, he used a basic starting .png that was an indexed .png file and it has only 52 colours which makes it quite small (Photoshop describes it as Png-8). In fact it is smaller than the compressed file size. So I wondered what the difference would be if the imaged being compressed had a lot more colours than 52. A comparison of an indexed png file and a compressed ktx file made from the same starting picture

The red boxes show where the Png-8 compression causes obvious "blotchiness" compared to the -dxt compression done in PVRTexTool.

With a larger image view there is blotchiness on the fabrics and dog's legs. (The dog is Tokyo - my Blender helper ;).)

Png-8  : 573kb (1024x1024px)

-dxt.ktx : 683kb (1024x1024px)

So Png-8 still slightly smaller but quality poorer and of course the Load->CPU->GPU path.

cheers, gryff :)

 

2images_tokyo.png

Share this post


Link to post
Share on other sites

How big is an avarage 1024x1024 DXT texture compared to the same in jpg?

I found this today:
https://www.npmjs.com/package/dxt-js

I'm thinking of using this tho load small jpeg on desktop, and compress them to the GPU.  (Instead of loading dxt)
It is fast.
My only problem is that it requires browserify so its a 600k javascript...
Maybe it does not worth it, if the (network) file size difference is not big.
 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now


  • Recently Browsing   0 members

    No registered users viewing this page.