Fragments a la React https://react.dev/reference/react/Fragment

[olavfosse]

Hei hallo

Loving this library!

One thing I'm missing is fragments like React's <> syntax.

<div>
  <>
    <span>this will be a direct child of our div</span>
    <span>this too will be a direct child of our div</span> 
  </>
</div>

Snabbdom has an experimental API for this: https://github.com/snabbdom/snabbdom?tab=readme-ov-file#fragment-experimental.

This would be extremely handy for use-cases where it is absolutely required that child elements are direct children of some parent; specifically CSS grid requires grid children to be direct children of the grid parent, no way around it. I have a very dynamic CSS grid and I would love to have one component for the grid header and one component for the grid rows.

I think the syntax should be [:<> ...] because it's similar to React and it's also the same syntax Rum and other hiccup libs use.

God jul! 🎅

[cjohansen]

Hi! Yes, I wanted fragments a while ago, but it wasn't possible in snabbdom then IIRC. I was thinking that maybe the syntax could just be a list? But then I though, hey, lists are already supported... So maybe what you want is already possible? The only limitation at the moment is that component functions can't return a list. Was that your use case?

[olavfosse]

Yep, that is my use case :^)

[cjohansen]

Does it have to be a component? If you can make do with a regular function, it should work fine.

[olavfosse]

I can use regular functions. I just wanted to use components for performance :^).

[cjohansen]

(def PerformantFragment (memoize render-fragment)) will achieve pretty much the same 😊

[PEZ]

For the record: Fragments are now available in snabbdom as (very) experimental: https://github.com/snabbdom/snabbdom?tab=readme-ov-file#fragment-experimental