Live data from Hacker News

Yoga: A cross-platform layout engine

code.facebook.com

21–30 of 168 posts

Re: Yoga: A cross-platform layout engine

#22

Why not just embrace Cassowary ( https://en.wikipedia.org/wiki/Cassowary_(software) ) aka the algorithm behind Cocoa's Auto Layout? Auto Layout isn't perfect but I think that it's fundamentally the API/UI that you are working with, the concepts are definitely at the right level of abstraction. Some sort of DSL could really solve this. Flexbox could be implemented as a framework on top of this.

AutoLayout basically directly exposes that algorithm and all of its complexity to the developer. That makes it the most powerful, but also the hardest to learn. Flexbox is a nice middle ground where you can express most things in a sane manner, but it's not the single layout engine to rule them all.

Re: Yoga: A cross-platform layout engine

#23
post #7

Yoga's layout API is very similar, if not a direct copy, of the web's Flexbox. Which funny enough means that we might get a chance to use Flexbox on the desktop before we can use it on the web. (I'm looking at you IE and your continuing partial support: http://caniuse.com/flexbox )

Yes, it's directly based on CSS Flexbox. See more info about the similarities and differences here – in particular a few default values are different: https://facebook.github.io/yoga/docs/learn-more/

Is there a plan to add support for the extensions (especially AspectRatio) in React web? I would greatly welcome them.

Re: Yoga: A cross-platform layout engine

#24

Earlier quoted context omitted.

I already use it in production. I don't really care about old IE users. I agree that not all devs can afford this, but many can.

Parent was referring to the current version of IE which still has partial support. I wish it were better supported today. It would sure make my life easier.

If you use autoprefixer you can reliably use flexbox, with a few minor exceptions which, IMO, aren't huge dealbreakers.

Re: Yoga: A cross-platform layout engine

#25
I like the concept and the C# code is just hands down the best example out of all of them (yet another reason I miss coding in C#).

I'm curious though, will this be eventually ported to JavaScript? Yeah yeah I know "flexbox is already on the web!" but if you could write a layout in this fashion versus using style sheets then you could take it and directly apply it to any of your applications (even if you have to convert between languages the exact same setup is still there it's just a straight up conversion).

Overall cool idea and implementation. Curious to see where it goes from here.

Re: Yoga: A cross-platform layout engine

#26

I like the concept and the C# code is just hands down the best example out of all of them (yet another reason I miss coding in C#). I'm curious though, will this be eventually ported to JavaScript? Yeah yeah I know "flexbox is already on the web!" but if you could write a layout in this fashion versus using style sheets then you could take it and directly apply it to any of your applications (even if you have to conv…

I agree the C# code is super nice :) There is interest from the community to contribute an emscripten version. If a PR comes my way I will be happy to merge it.

Re: Yoga: A cross-platform layout engine

#27

Why not just embrace Cassowary ( https://en.wikipedia.org/wiki/Cassowary_(software) ) aka the algorithm behind Cocoa's Auto Layout? Auto Layout isn't perfect but I think that it's fundamentally the API/UI that you are working with, the concepts are definitely at the right level of abstraction. Some sort of DSL could really solve this. Flexbox could be implemented as a framework on top of this.

Android has started embracing it with ConstraintLayout. It implements a Cassowary solver in order to resolve the constraint imputed by the dev.

I have been using it for some time and it is an huge step in the right direction.

A downside of Yoga seems to be its tooling, ConstraintLayout is very well integrated with Android Studio. Actually they created it hand in hand with a rewrite of its layout editor.

Re: Yoga: A cross-platform layout engine

#28
post #7

Yoga's layout API is very similar, if not a direct copy, of the web's Flexbox. Which funny enough means that we might get a chance to use Flexbox on the desktop before we can use it on the web. (I'm looking at you IE and your continuing partial support: http://caniuse.com/flexbox )

Yes, it's directly based on CSS Flexbox. See more info about the similarities and differences here – in particular a few default values are different: https://facebook.github.io/yoga/docs/learn-more/

The link[0] to GitHub from the hamburger menu on this page results in a 404.

[0]: https://facebook.github.io/yoga/http://github.com/facebook/y...

Re: Yoga: A cross-platform layout engine

#30

Yoga's layout API is very similar, if not a direct copy, of the web's Flexbox. Which funny enough means that we might get a chance to use Flexbox on the desktop before we can use it on the web. (I'm looking at you IE and your continuing partial support: http://caniuse.com/flexbox )

A lot of real-world usage of flexbox is broken that has nothing to do with IE/Edge. Follow the "Known issues" tab on your caniuse link. Also see Flexbugs [1] for more. I get bitten by #11 and/or #14 on almost every project, which work fine in IE/Edge.

[1] https://github.com/philipwalton/flexbugs

Post reply on HN