An interesting project that helps avoid handing words in layouts, which is particularly useful for headings.
Because we can't account for every scenario when designing our layouts, a tool like this is powerful in avoiding unbalanced text, where a single word may overflow onto a line all by itself and just not look right.
React Wrap Balancer fixes this through thoughtful calculation.
I've tinkered with this a bit, and it works great. It's particularly useful with headings in layouts like blog posts, where the length of a heading can vary greatly from one post to another.
As cool as this is, when I first saw the demo, I cringed a bit. It made me feel like I was back in my early days of development (c. 2010) and using jQuery to drive changes to layouts I couldn't control with CSS.
CSS can't solve this layout issue today, and I'm hoping this project pushes CSS in that direction.
Personally, I'm going to hold off. Balanced text is coming to CSS soon, and when that happens, I'll absolutely be taking advantage of it.
Eduardo Bouças shared the worst mistake he’s made as a developer, along with advice on what to do when you do make a mistake.