07: Flexbox Basics

Every programming system needs to evolve to survive, but it's difficult to pull off without either making a whole new system or breaking the previous one. There's also the problem that a great many people are invested in how the system is currently broken, even to the point of basing their personal identities on these problem "features". When the system needs to change these are the people who are most against anything new that might jeopardize their prized positions as experts.

There's also the problem of how to evolve something. You are left with either making a new improved version and forcing people to switch, or attempting a gradual migration while maintaining backwards compatibility. Both strategies can lead to the death of the technology. If you attempt to force people to upgrade you risk them leaving for another technology without the flaws rather than upgrade. If you adopt a slow gradual migration then you risk them leaving again because your technology is not moving fast enough compared to a competitor.

What the web standards folks have done is a masterful new strategy I like to call The Cuckoo Strategy. You may already know this, but some species of cuckoo bird lay their eggs in other bird's nests to let that bird raise their young. The baby cuckoo usually hatches first, and then slowly pushes the weaker unhatched eggs out of the nest until the cuckoo is the only baby left in the nest. With all the competition finally gone, the cuckoo is finally alone and gets all food from the parents.

"The Cuckoo Strategy" is where you create the new "cuckoo feature" that is an entirely new version, but can coexist with the current version, and nobody minds it since you're only "adding a few new features." Nothing to worry about you tell them, and then slowly everyone is using this new "feature" that's actually a complete replacement for all of the other trash features you want gone. The new feature simply pushes out all of the previous precious little young until nobody uses them anymore and you can safely remove them. The brilliance of this is the people who are adamant about keeping the old features for their own job security gladly accept the cuckoo features and don't even realize they're helping to kill off their favorites.

What JavaScript ES6, Flexbox, and CSS grids did is create a set of cuckoo features that the old guard simply didn't notice pushing out their old techniques. ES6 is really an entirely new language that lives right inside JavaScript without disturbing it, so people began to adopt it since it wasn't a threat. Flexbox and CSS grids do the same thing with old ways of creating layouts for CSS. They coexist with the existing system, but are really an entirely new way to use CSS that simplifies it tremendously. Eventually this will push out (or already has pushed out) old broken ways of doing layout by doing nothing more than simply being better without disturbing the existing systems.

The down side to the cuckoo strategy is that you still need to learn some of the old techniques to use the new features during this transition period. That's why we covered all of the ways to use CSS to style HTML and how it works. If you don't know that CSS has inconsistencies in some of its features then you'll have hard time even if you learn Flexbox and CSS grids. Now that you know some of the ways CSS bites you it's possible to dodge many of them with Flexbox and Grids.