Having build a documentation system at my job as well as the frontend
for it, it was rather surprised that a surprisingly large proportion of
my colleagues complained that the text was 'too narrow'.
When reading documentation, the horizontal space is constrained to limit
the amount of characters on a line. Long lines make for very hard to
read text, because each time your eyes dart back from the end of the
line to the beginning of the next line, it becomes harder to stay
vertically anchored on the correct line.
It's best practice to limit the line length like this, and so I've
always been doing it. However, after someone at work asked, I added a
toggle to allow the text to fill the available space.
Much to my surprise, this was hailed like some sort of significant
improvement. I still don't think it makes sense, but I've added a
similar checkbox to the docs pages of both dev and org sites anyway.
Prior to this commit we'd generate a page for each MDX document as that
avoids having to load MDX dynamically (which can be tricky) or through
static props (which causes issues with serialization).
However, Vercel (which hosts for us) has an upper limit on the number of
routes, and because of this extensive documentation, we blew passed it
with this approach.
This changes to a dynamic resolution of MDX content with an async import
in the useEffect hook. This should drastically reduce the number of
routes and make Vercel happy.
I didn't do much digging into the effects of this on SSR. If it turns
out it's causes issues, we'll deal with it at that time.
