3 ms·

The one thing I'd really like for web layout is a "stretch unit" that works similarly to CSS Grid's fr units in that it would be defined as "taking up a proport

The one thing I'd really like for web layout is a "stretch unit" that works similarly to CSS Grid's fr units in that it would be defined as "taking up a proportion of available space after other siblings have been sized" except: - It would have no automatic minimum, so it would actually be equivalent to minmax(0, 1fr) (this would make it much more performant, avoiding the exponential time complexity of many existing CSS layout modes. - It could be used for the width/height properties (and potentially other places such as margin/padding/inset) If you had that along with a simplified 1-dimensional display mode (i.e. like flexbox except with the flexing disabled) then I think most people probably wouldn't want much more in most circumstances. Houdini is interesting, but as someone who has spent a lot of the last year implementing a web layout engine [0], I'm a little skeptical that JS is ever going to be fast enough to really compete with built-in layout modes. It could be an interesting use case for WASM if the problem of passing data into the WASM VM cheaply (perhaps by reference) can be solved. [0]: https://github.com/DioxusLabs/taffy https://github.com/DioxusLabs/taffy

josephg 3y ago
> It could be an interesting use case for WASM if the problem of passing data into the WASM VM cheaply (perhaps by reference) can be solved. WASM Reference Types should hopefully solve this. The WASM working group seems to have some good momentum - so I'm hopeful this (or a similar replacement spec) will land sooner rather than later. https://github.com/WebAssembly/reference-types/blob/master/proposals/reference-types/Overview.md https://github.com/WebAssembly/reference-types/blob/master/p...
bryanrasmussen 3y ago
>"taking up a proportion of available space after other siblings have been sized" and >- It could be used for the width/height properties (and potentially other places such as margin/padding/inset) this to me is essentially what clamp does, although it can't take up size after siblings have been sized. If at some point clamp can start taking values like inherited then it would be pretty cool, but that would be pretty difficult unfortunately.
- nicoburns 3y ago
  > although it can't take up size after siblings have been sized The key things about the proposed new unit are: 1. That it takes up space after siblings are sized (i.e. a dedicated syntax for what 90% of flexbox uses are trying to do) 2. It prevents that same node from being "auto" sized (i.e. sized based the size of it's children). This is an important optimisations which greatly improves layout performance. Taken together this could both significantly simplify layout code and significantly improve layout performance.
  - bryanrasmussen 3y ago
    hmm, yeah a guy I know recently wasted weeks trying to do a design that was actually undoable if all the ideas implicit in the design were given equal weight, and this would have allowed him to achieve what he was trying to do.

josephg 3y ago

> It could be an interesting use case for WASM if the problem of passing data into the WASM VM cheaply (perhaps by reference) can be solved. WASM Reference Types should hopefully solve this. The WASM working group seems to have some good momentum - so I'm hopeful this (or a similar replacement spec) will land sooner rather than later. https://github.com/WebAssembly/reference-types/blob/master/proposals/reference-types/Overview.md https://github.com/WebAssembly/reference-types/blob/master/p...

bryanrasmussen 3y ago

>"taking up a proportion of available space after other siblings have been sized" and >- It could be used for the width/height properties (and potentially other places such as margin/padding/inset) this to me is essentially what clamp does, although it can't take up size after siblings have been sized. If at some point clamp can start taking values like inherited then it would be pretty cool, but that would be pretty difficult unfortunately.

nicoburns 3y ago
> although it can't take up size after siblings have been sized The key things about the proposed new unit are: 1. That it takes up space after siblings are sized (i.e. a dedicated syntax for what 90% of flexbox uses are trying to do) 2. It prevents that same node from being "auto" sized (i.e. sized based the size of it's children). This is an important optimisations which greatly improves layout performance. Taken together this could both significantly simplify layout code and significantly improve layout performance.
- bryanrasmussen 3y ago
  hmm, yeah a guy I know recently wasted weeks trying to do a design that was actually undoable if all the ideas implicit in the design were given equal weight, and this would have allowed him to achieve what he was trying to do.