PCpcr910303·Mar 23, 2020Submission
Layout: Single-file C99 flexbox library
2 points · Open discussionrandrew
layout
C2016–2020
randrew / layout
layout
Single-file library for calculating 2D UI layouts using stacking boxes. Compiles as C99 or C++.
3Distinct people
3Mentions
0Explicit recommenders
1KGitHub stars
What to know before exploring
What it is
Single-file library for calculating 2D UI layouts using stacking boxes. Compiles as C99 or C++.
GitHub
Where it is used
No documented product use has been verified yet.
What people are saying
No recommendation phrase was found in the indexed comments.
No classified warning is attached to this page. Read the discussions before treating silence as approval.
Also in these discussions
No other repository is repeatedly linked in the same discussions.
This week on Hacker News
Nov 7–Nov 14 UTC · Direct repository links and separately labeled related project stories. Indexed through 11/14/2026, 12:54:37 PM UTC.
No direct repository links were found in the indexed HN discussions over the past seven days. Older discussions are available below.
Mentions over time
HN mentions by year3 dated mentions
Observed mentions: 2016-12-07 22:46:46 UTC to 2020-03-23 14:41:54 UTC.
Counts come from the repository’s dated source evidence. Index cutoff: 2026-11-02 08:16:59 UTC.
View mention counts and date ranges
| Period | Start (UTC) | End (exclusive, UTC) | Mentions | Submissions | Comments |
|---|---|---|---|---|---|
| 2016 | 2016-01-01 00:00:00 UTC | 2017-01-01 00:00:00 UTC | 1 | 0 | 1 |
| 2017 | 2017-01-01 00:00:00 UTC | 2018-01-01 00:00:00 UTC | 0 | 0 | 0 |
| 2018 | 2018-01-01 00:00:00 UTC | 2019-01-01 00:00:00 UTC | 1 | 0 | 1 |
| 2019 | 2019-01-01 00:00:00 UTC | 2020-01-01 00:00:00 UTC | 0 | 0 | 0 |
| 2020 | 2020-01-01 00:00:00 UTC | 2021-01-01 00:00:00 UTC | 1 | 1 | 0 |
What Hacker News says
3 sourcesSo the blog post ends with a promise of sections about:
* inline layout
* text rendering.
* networking.
* scripting.
LAYOUT
I think here could be useful to take a look at something like Facebook's Yoga [1] although maybe not great to start. There's this little layout demo that could be interesting to investigate [2].
TEXT
Regarding text probably the keyword to learn about is "rasterization". I found a few tutorials back in the day [3], [4]. In general rendering text is a PITA and you don't want to do it no matter what :-) The only lightweight solution I found was stb's truetype [3].
So if you want to render text yourself you'll need:
- a parser for a font format format (e.g. TTF, PITA) to have a way to get the curve definitions for each font.
- a rasterizer (could be a fun project for getting something reasonable and probably slow perform
Read the rest
ant)
- a curve filling algorithm and plugging it to your rasterizer, which will probably be able to do humble things like drawing filled triangles and other simple shapes (PITA! :-p)
- a word and paragraph layout engine (PITA again :-)
Overall I'm happy half understanding the steps involved and not having to deal with all the messy steps in the middle.
NETWORKING
I'm super lazy in this area, and I would rather learn something like ZeroMQ to posix sockets... back in the day I followed Beej's tutorial which was nice. [6] Then you can connect your sockets to some pre-existing HTTP parser which are a dime a dozen these days [7] and you are all set! :-p
SCRIPTING
Not much to say here... hundreds of languages available. Probably Lua is a nice alternative to JavaScript, but there are also plenty of lightweight JavaScript implementations these days (I think there is a nice little one called V7). If you want to learn how to actually implement an interpreter there are plenty of resources too. If I went this route I would start by implementing some version of lisp or scheme for simplicity.
1: https://yogalayout.com/
2: https://github.com/randrew/layout
3: https://github.com/NotCamelCase/RasterizationInOneWeekend
4: http://www.scratchapixel.com/index.php
5: https://github.com/nothings/stb/blob/master/stb_truetype.h
6: https://beej.us/guide/bgnet/
7: https://github.com/search?q=http+parser&ref=opensearch
I made a similar library earlier this year. It builds as C or C++ and is only two files (MIT license): https://github.com/randrew/layout
The API is similar to Yoga. I hadn't seen Yoga before, and I'm surprised at how similar it is. It seems like Yoga is about the same age (or older?) than my Layout library.
It's meant to be easily embedded into existing software, such as game engines, OpenGL-based tools, custom GUI libraries, etc. without requiring its own complicated build system. Its API and layout engine seems to work in a way similar to Yoga, but it doesn't have pre-made bindings for any existing GUI toolkits. There is, however, an example binding for the Lua scripting language.
API comparison:
Yoga:
YGNodeRef root = YGNodeNew();
YGNodeStyleSetWidth(root, 500);
YGNodeStyleSetHeight(root, 120);
YGNodeStyleSetFlexDirecti
Read the rest
on(root, YGFlexDirectionRow);
YGNodeRef image = YGNodeNew();
YGNodeStyleSetWidth(image, 80);
YGNodeStyleSetMargin(image, YGEdgeEnd, 20);
YGNodeInsertChild(root, image, 0);
Layout:
lay_context ctx;
lay_init_context(&ctx);
lay_id root = lay_item(&ctx);
lay_set_size_xy(&ctx, root, 500, 120);
lay_set_contain(&ctx, root, LAY_ROW);
lay_id image = lay_item(&ctx);
lay_set_size_xy(&ctx, image, 80, 0);
lay_set_margins_ltrb(&ctx, image, 0, 0, 20, 0);
lay_insert(&ctx, root, image);
The Layout library can handle laying out tens of thousands of items in a few microseconds, so I would expect Yoga to have similar performance. (Layout is meant to work stutter-free and waste-free with layouts that could be animated or changing every frame in a game engine.)
One major difference I noticed, though, is that Yoga seems to allocate for each individual node, whereas Layout uses a single resizable contiguous buffer. This is gives it pretty good CPU cache performance (writes are all in their own separate region of the buffer) and allows you to do complete rebuilds of the layout hierarchy without any heap allocations. It's nice if you have a dynamic layout and want to keep the layout calculations fast/cheap. It might be interesting to do benchmarks of the two libraries in different scenarios.
Are there any other libraries similar to Yoga and Layout?