CreateScreenshot, ScreenshotTools and side-effects

Questions
1

Here is the relevant import

import  {ScreenshotTools } from '@babylonjs/core/Misc/screenshotTools'
import { Tools } from '@babylonjs/core/Misc/tools';

Here is the relevant code, very simple :slight_smile:

      const screenshotUrl = await Tools.CreateScreenshotUsingRenderTargetAsync(
        engine,
        camera,
        {
          width: 1920,
          height: 1080,
          precision: 1,
        }
      );

I get the error

Screenshot creation failed: ScreenshotTools needs to be imported before as it contains a side-effect required by your code.

If I remove ‘tools’ from import like

import { Tools } from '@babylonjs/core/Misc/';

everything works as expected.
What is the best way for tree-shaking here?

2

@labris Importing from the root will import everything from the screenshotTools file, vs your code which is just importing ScreenshotTools.

(see this line in Misc/index.ts

image
image384×305 5.51 KB
)

Can you replace your first import with
import * from "@babylonjs/core/Misc/screenshotTools" and see if that removes the error?

3

No, this doesn’t work at all.
The actual question, actually, is “what gives the smallest build size”? :slight_smile:

4

My apologies!

I was trying to see if we could import everything from /screenshotTools without pulling in everything from index.ts by continuing to use the /tools subpath, but being explicit with our screenshotTools import.

What error do you get with the above? Can you try instead using

import '@babylonjs/core/Misc/screenshotTools';
import { Tools } from '@babylonjs/core/Misc/tools';

And see if that works / how the bundle size compares?

3 Likes
5

With this

allimp
allimp472×102 4.43 KB

which is already more than 100 kB better than mine

import  {ScreenshotTools } from '@babylonjs/core/Misc/screenshotTools'
import { Tools } from '@babylonjs/core/Misc/';

myimp
myimp459×104 4.25 KB

I believe this is maximum which is possible to squeeze with tree-shaking.