Flexbox
as a base layout is convenient but tricky due to
or “jank”. If the dimensions of the
base flex container(s) are ambiguous, then the browser constantly recomputes the
dimensions as streams in.
My favorite trick is to give the browser dimension hints and avoid computational
properties like flex.
Set as many dimensions (width/height) as possible unambiguously. My Internet
speed is sufficiently slow enough that I can see layout shifts in many sites,
including my own (this micro blog).
The
“CSS router”
has always been quite the clever trick for navigating sufficiently small sites.
This site uses it to scroll switch pages, and
portable.fyi gets clever with visibility :target
switching. Do it just right and no one notices unless they “inspect the
elements”.
It’s always humbling when I get around to reading a web related spec.
and
have a lot of functionality.
JavaScript’s not bad (it’s the easiest part of web development) but gives you
just enough rope to do super silly things like reinventing all built in browser
functions.