Unable to use Basis compressed textures on Facebook

[LeXXik]

I am reporting this for visibility.

We have found that recently our games on Facebook started to lose textures. The culprit was the Basis compression. Browser successfully fetched a .basis texture. The BasisClient then composed and sent a job to web worker for transcoding. However, a worker response is never received.

I am not sure when this started. A month? A two? We initially thought it was due to client having the low network, but the issue persisted and is easily reproducible. It works fine in Launcher, though. Perhaps something to do with how Facebook configures iframes? We have disabled Basis compression for now.

Please, investigate.

[yaustar]

Did this use to work on FB at some point? If so, it would point to either a change in the engine about Basis (@slimbuck do you know if there were any major changes over the last 3 or so months?) or a change on FB side.

Is this for FB Instant games or something else?

[slimbuck]

I am really interested to get a repro here so we can investigate

[LeXXik]

Yes, it is for instant games, and was working before. I will try to make a small repro app.

[willeastcott]

Any luck with the repro?

[LeXXik]

@willeastcott I've made a small test app. The test app has 2 boxes - left is using non-compressed PNG texture, the right one is using Basis compression.

The PlayCanvas project that is used: https://playcanvas.com/project/972748/overview/basis-issue

I customized a bit the build to remove the loading screen. Basis issue.zip

How it looks on FB:

I would need someone's email from developers.facebook.com, so I could add them as a tester to the app to get access to it.

[yaustar]

I've DM'ed you on Discord @LeXXik :)

[LeXXik]

Sent a test account to @yaustar via Discord DM.

[yaustar]

Reproduced on Chrome desktop

[yaustar]

I've tried to use an older version of the engine (https://github.com/playcanvas/engine/releases/tag/v1.40.0) and it shows the same issue with Basis not loading

[LeXXik]

@yaustar hmm, how are you able to change the version of the engine? FB doesn't allow external URLs. The current test app has a debug version of the latest engine inside of the ZIP file. Do you want me to upload another build with older engine version?

[yaustar]

@yaustar hmm, how are you able to change the version of the engine?

Chrome Overrides: https://blog.shahednasser.com/overrides-in-chromes-devtools/

Super useful in doing things like this where you need to proxy a file

[yaustar]

@LeXXik Looking at the published build on FV, it looks like window.PRELOAD_MODULES is empty when it should have the basis module config in there.

Can you link to the Editor project for this test app for me to take a closer look please?

[LeXXik]

Yes, the link is in my message above: https://playcanvas.com/project/972748/overview/basis-issue

[yaustar]

With your FB project, did you update __settings__.js?

On FB, it looks like this:

ASSET_PREFIX = "";
SCRIPT_PREFIX = "";
SCENE_PATH = "1509328.json";
CONTEXT_OPTIONS = {
    'antialias': true,
    'alpha': false,
    'preserveDrawingBuffer': false,
    'preferWebGl2': true,
    'powerPreference': "high-performance"
};
SCRIPTS = [  ];
CONFIG_FILENAME = "config.json";
INPUT_SETTINGS = {
    useKeyboard: true,
    useMouse: true,
    useGamepads: false,
    useTouch: true
};
pc.script.legacy = false;
PRELOAD_MODULES = [
];

But with Basis in your project, it should look like:

ASSET_PREFIX = "";
SCRIPT_PREFIX = "";
SCENE_PATH = "1136674.json";
CONTEXT_OPTIONS = {
    'antialias': true,
    'alpha': false,
    'preserveDrawingBuffer': false,
    'preferWebGl2': true,
    'powerPreference': "default"
};
SCRIPTS = [ 98716180, 98716182 ];
CONFIG_FILENAME = "config.json";
INPUT_SETTINGS = {
    useKeyboard: true,
    useMouse: true,
    useGamepads: false,
    useTouch: true
};
pc.script.legacy = false;
PRELOAD_MODULES = [
    {'moduleName' : 'BASIS', 'glueUrl' : 'files/assets/99042101/1/basis.wasm.js', 'wasmUrl' : 'files/assets/99042099/1/basis.wasm.wasm', 'fallbackUrl' : 'files/assets/99042100/1/basis.js', 'preload' : false},
];

Note PRELOAD_MODULES variable. This is why the basis module is not being loaded 😅

[LeXXik]

Ah, I might have used an settings.js from an older project, while setting up the test app. Looking into it.

[yaustar]

LeXXik updated the test app to include the Basis module and it looks like the last working version of the engine for FB Basis was: https://github.com/playcanvas/engine/releases/tag/v1.43.1

With the breaking changes in 1.44.0 where we updated the Basis worker: https://github.com/playcanvas/engine/pull/3277

The error that comes up in 1.44.0 onwards is:

Where it seems to be blocking loading of blob URLs

[yaustar]

Looks like FB Instant Games don't allow developers to define their own CSP https://support.cloudinary.com/hc/en-us/community/posts/360003923851-Can-t-load-images-in-Facebook-Instant-Games- :(

[LeXXik]

Created a ticket on Facebook for tracking: https://developers.facebook.com/support/bugs/803565357655094/

[LeXXik]

The issue is that Facebook has a server setting that forbids the use of script blobs, which fails to create a web worker. Please, consider adding an option to start Basis on main thread.

[yaustar]

Closing this in favour of a new request: https://github.com/playcanvas/engine/issues/4780