W3C home > Mailing lists > Public > public-houdini@w3.org > October 2019

Re: Registering multiple worklet modules or not?

From: Bob Hamblok <post@bhamblok.be>
Date: Mon, 14 Oct 2019 14:48:16 +0200
Message-ID: <CAE8qMXG_vSaBuPD6hqrmbEQQsyZ4jW9uvdNL_hkup_Aw2wvVSQ@mail.gmail.com>
To: Robert Flack <flackr@chromium.org>
Cc: public-houdini@w3.org
Dear Robert,

Thank you for your response.

I used to interpret the specs in such a way that for each worklet file, two
or more WorkletGlobalScopes should be created. Which would have made the
amount of parallelism be 2 times the number of worklet files, limited to
the hardware-resources I presumed.

But now, do I understand correctly that there are just X (two or more)
WorkletGlobalScopes available to the browser which will be used for all my
registerLayout-classes?
So ... this makes the maximum amount of parallelism equal to X (two or
more), and loading multiple worklet-files will not have an impact on
parallelism (and furthermore on performance)?

Thank you very much,

PS: As a developer, I love the CSS LayoutAPI! I have a use case which I
believe cannot be done in any other way. So I hope it gains traction and
will make it to the Spec.

All the best,

*Bob Hamblok | BOAPP GCV*
Freelance Software Engineer | Architect | Consultant
founder at neoScores NV

*EMAIL* post@bhamblok.be
*PHONE* +32 476 74 78 42

*ADDRESS* Jennevalstraat 18, BE-2600 Antwerp, Belgium
*VAT* BE0682.695.007


On Mon, 14 Oct 2019 at 13:48, Robert Flack <flackr@chromium.org> wrote:

> Hi there,
>
> I hope I can help bring some clarity to the options. There's a few details
> which mitigate the differences in performance of the two options:
> - the additional fetches in B are all triggered simultaneously so they
> should not result in additional round trips.
> - Layout and Paint Worklet files are loaded into each[1] of two or more
> WorkletGlobalScopes[2][3]. Since they are required to be idempotent[4], the
> browser can use the instances from all of its WorkletGlobalScopes in
> parallel. This means that loading a single file defining 3 classes will
> allow an equivalent amount of parallelism as loading them independently.
>
> The only limit to how many you can load should be the available memory.
> As for which one performs better, they should have identical execution
> speeds so if your web server doesn't support HTTP/2 there should be
> slightly less data downloaded by bundling them[5].
>
> Hope this helps! Cheers,
> -Rob
>
> [1] "For each WorkletGlobalScope in the worklet’s WorkletGlobalScopes, ...
> Run a module script given script"
> https://www.w3.org/TR/worklets-1/#dom-worklet-import
> [2] "The user agent must have, and select from at least two
> LayoutWorkletGlobalScopes"
> https://www.w3.org/TR/css-layout-api-1/#generating-fragments
> [3] "Select from at least two PaintWorkletGlobalScopes"
> https://www.w3.org/TR/css-paint-api-1/#global-scope-selection
> [4] https://www.w3.org/TR/worklets-1/#code-idempotency
> [5]
> https://developers.google.com/web/fundamentals/performance/http2#header_compression
>
> On Mon, Oct 14, 2019 at 7:02 AM Bob Hamblok <post@bhamblok.be> wrote:
>
>> Dear list,
>>
>> When I make heavily use of CSS Houdini, in one app...
>> What would be best practice?
>>
>> *A. **loading one (bundled) file, defining multiple
>> registerPaint/registerLayout-classes?*
>>
>> CSS.paintWorklet.addModule('path/to/my/bundled/file/defining/all/my/registerPaint/classes.js');
>>
>> CSS.layoutWorklet.addModule('path/to/my/bundled/file/defining/all/my/registerLayout/classes.js');
>>
>> *or*
>>
>> *B. **loading multiple worklets, each dedicated to one
>> registerPaint/registerLayout-class?*
>> CSS.paintWorklet.addModule('path/to/my/registerPaint/class/to/render/a');
>> CSS.paintWorklet.addModule('path/to/my/registerPaint/class/to/render/b');
>> CSS.paintWorklet.addModule('path/to/my/registerPaint/class/to/render/c');
>>
>> CSS.layoutWorklet.addModule('path/to/my/registerLayout/class/to/render/x');
>>
>> CSS.layoutWorklet.addModule('path/to/my/registerLayout/class/to/render/y');
>>
>> CSS.layoutWorklet.addModule('path/to/my/registerLayout/class/to/render/z');
>>
>> I think (A.) would be most performant booting the app, regarding having
>> to fetch and load just one (or two) (bundled) file(s). But I wonder if (
>> B.) would be more performant rendering the DOM because the browser can
>> instantiate multiple worklet-instances for multiple class-definitions each.
>>
>> How many worklets can be added/loaded/mounted?
>>
> Can anyone help me telling which option is best?
>>
>> Thank you very much,
>>
>> All the best,
>>
>> *Bob Hamblok | BOAPP GCV*
>> Freelance Software Engineer | Architect | Consultant
>> founder at neoScores NV
>>
>> *EMAIL* post@bhamblok.be
>> *PHONE* +32 476 74 78 42 <+32%20476%2074%2078%2042>
>>
>> *ADDRESS* Jennevalstraat 18, BE-2600 Antwerp, Belgium
>> *VAT* BE0682.695.007
>>
>
Received on Monday, 14 October 2019 12:48:31 UTC

This archive was generated by hypermail 2.4.0 : Friday, 17 January 2020 19:53:28 UTC