[RFC] Common slots/accessors

[iwoplaza]

With our goal to provide a standard set of modules that perform common tasks, they can have some configurations that are common between them, like:

• The size of the viewport (useful for blurs, ray-marching, effects, etc.)
• (...)

Lets say a handful of these libraries export an accessor for the viewport size:

import { getViewportSize as getViewportSizeForBlur } from '@typegpu/blur';
import { getViewportSize as getViewportSizeForRaymarch } from '@typegpu/raymarch';
import { getViewportSize as getViewportSizeForEffect } from '@typegpu/effect';
// ...

const viewportSizeUniform = root.createUniform(vec2f, vec2f(640, 480));

const pipeline = root
  .with(getViewportSizeForBlur, viewportSizeUniform)
  .with(getViewportSizeForRaymarch, viewportSizeUniform)
  .with(getViewportSizeForEffect, viewportSizeUniform)
  // ...

For every module that wants to use the viewport-size, we need to populate its accessor with the appropriate value either when creating a pipeline, or on the root itself.

One way we can mitigate this ballooning of duplicated common accessors, is to house these common accessors either in typegpu itself, or in a common dependency of all the modules above (e.g., @typegpu/common-resources).

import { getViewportSize } from 'typegpu/common'; // from '@typegpu/common-resources';

const viewportSizeUniform = root.createUniform(vec2f, vec2f(640, 480));

const pipeline = root
  .with(getViewportSize, viewportSizeUniform)
  // ...

[mhawryluk]

okie, agreed. I think conceptually it makes more sense to have these common accessors in a separate module, however it would be more convenient for us to just have it in typegpu. it would also make it easier to find these accessors for the creators of external utils I think

[iwoplaza]

@reczkok Thoughts? 🧠

[reczkok]

I agree with @mhawryluk. I also think the first example would get a lot simpler if we allowed with bindings of the same type to be grouped.

const pipeline = root
  .with(getViewportSizeForBlur, viewportSizeUniform)
  .with(getViewportSizeForRaymarch, viewportSizeUniform)
  .with(getViewportSizeForEffect, viewportSizeUniform)
  // ...

would become:

const pipeline = root.with(
  [
    getViewportSizeForBlur,
    getViewportSizeForRaymarch,
    getViewportSizeForEffect,
  ],
  viewportSizeUniform
);
  // ...