Document.write

> Whoa, HTML templating? It inserts the stuff directly where the function is called, and it just works? And it's been available in browsers forever? Stop the presses, I gotta rewrite all my static sites

As someone who learned HTML, CSS and JS in the late 90s/early 2000s, we've finally come full circle :) Back in those days, `document.write` was commonly the first piece of JS many of us wrote, here is a `document.write` I wrote 14 years ago, seems to be the earliest one I could find in my public GitHub repos: https://github.com/victorb/Flashback-Citat/blob/f4da38ace620...

Most of us were told early to avoid `document.write` like the plague though, as there generally was better ways of achieving the same thing, but without all the drawbacks.

I also thought the writing/parsing makes it a lot slower than DOM createElement methods. Here's also an interesting SO thread: https://stackoverflow.com/questions/802854/why-is-document-w...

I disagree that you shouldn’t use document.write for <script> and <style> tags, as it’s the only way to force dynamically inserted script to run in a parser-blocking manner during parsing, and to prevent flash of unstyled content (FOUC) for dynamically inserted styles.

Yes it’s slower, but does it matter for your specific use case? Async scripts are harder to reason about, esp if you have nested templates. FOUC is also a much bigger and more noticeable problem than the tiny delay to parse the CSS snippets.

Forcing scripts to be parser-blocking is also needed if you want to nest document.write, to ensure it is writing to the correct location in the document.

I created an HTML includes library that utilizes document.write extensively: https://miragecraft.com/projects/x-include

If you want to use dom functions or browser accessibility on the output, which you do, avoid it.