Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Yoga: A cross-platform layout engine

code.facebook.com

Post reply on HN
Print view View original

11–20 of 168 posts

Re: Yoga: A cross-platform layout engine

#11

Post by RubenSandwich »

nightski wrote: post #9
alexkavon wrote: post #4

Earlier quoted context omitted.

I wouldn't hold my breath waiting for IE to fully support it.

Uh, Edge already fully supports it. I don't think they are adding new features to IE anymore.

You bring up a good point, in Windows 10 Edge is already the default browser. My comment is more joke then anything substantial. I think realistically anyone who isn't targeting enterprise could use Flexbox and be fine most of the time.

Re: Yoga: A cross-platform layout engine

#13

Post by adamnemecek »

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.

Re: Yoga: A cross-platform layout engine

#14

Post by RubenSandwich »

spicyj wrote: post #7
RubenSandwich wrote: post #3

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/

Thank you for providing these excellent docs from day 1. Can I suggest that you change the background color of the flex item in the jsfiddle example of the default values, https://jsfiddle.net/emilsjolander/jckmwztt/, to something besides white as it took me a moment to realize that I was looking at a flex item as white backgrounds are very common.

Re: Yoga: A cross-platform layout engine

#15

Post by withjive »

RubenSandwich wrote: post #3

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 )

ReactNative uses Yoga for it's layout. There's an OSX port already in progress, so cross platform Desktop apps using Yoga isn't that far off ;)

Re: Yoga: A cross-platform layout engine

#16

Post by jordanlev »

Curious how using this for a complete page layout "feels" to someone who's familiar with designing websites. Since flexbox is intended for 1-dimensional layout only (as opposed to the old-school display:table or the forthcoming Grid spec, which are intended for 2-dimensional layout), I wonder what they do to make it work well for the full page / screen layout (in terms of ease of coding, not the display algorithm itself).

Re: Yoga: A cross-platform layout engine

#17

Post by drcode »

adamnemecek wrote: post #13

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.

Pete Hunt, one of the original developers of React at Facebook, began work on a Cassowary-like layout engine at one point and came to the conclusion (whether rightly or wrongly) that arbitrary constraint-based layout is too user hostile to pursue further.

I too like constraint-based layout, but I have to admit flexbox is nice in that it has very predictable behavior. The main hangup I have with flexbox is that it doesn't allow for layout based on aspect ratios, but Yoga has extensions that resolve this issue.

Re: Yoga: A cross-platform layout engine

#18

Post by iLoch »

adamnemecek wrote: post #13

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.

Speaking as someone coming from the web, auto-layout is really awful. You're way better off making UI easy to reason about for web developers transitioning to mobile, because that's where most of the talent comes from. By DSL, do you mean something like HTML/CSS? React Native basically has this with JSX and style properties which use Yoga under the hood.

Re: Yoga: A cross-platform layout engine

#20

Post by BinaryIdiot »

kowdermeister wrote: post #8
RubenSandwich wrote: post #3

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 )

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.
Post reply on HN