エターナルフォースドキュメントライト相手は死ぬ
はい、おはようございます。僕です。今日もどうでもいいこと書くよ。このブログはまじめなブログじゃないからTL;DRとかいうそんなおしゃれな話は一切ないよ。
さて…。
JavaScriptにおいてDocument.Writeってバグの温床だから使うなって言われて僕もWEBサイトにちゃんと実装するときは使わないんですけどもConsole.logみたいなデバッグ感覚で使うには便利でつい使っちゃうんですよね。一行でかけるから。で、とあるとき雑な処理書いていたらめっちゃ重くなったんでそろそろちゃんと意味を理解するかということで下のやつを読むことにしたのですよ。
HTML Standard — Dynamic markup insertion（日本語訳）
document.write(...text)
一般に，所与の文字列（たち）を文書の入力ストリームに追加する。
このメソッドのふるまいは、とても特異的である。 一部の事例では、 HTML 構文解析器が走っている間に 構文解析器の状態に影響し得る — その結果、文書のソースに対応しない DOM になり得る（例：書き込まれた文字列が "<plaintext>" や "<!--" であった場合など）。 別の事例では、 document.open() が call されていたかのように，現在のページをまずクリアすることもある。 さらには、単純に無視されたり, 例外を投出する事例もある。 UA には、このメソッドを介して挿入された script 要素に対しては， 実行するのを避けることが明示的に許容される。 このメソッドの正確なふるまいは、ネットワーク待ち時間に依存する事例すらあり、とてもデバッグし難い失敗へ導く。 これらすべての理由から、このメソッドは利用しないことが強く奨励される。
次の場合、 InvalidStateError 例外を投出する ：
文書は XML 文書である ／
カスタム要素構築子を現在実行している
とりあえず重要そうなところだけ抜粋。ただ一連が何言ってるかについてみるために 8.4. 動的マークアップ挿入 見た方がいいかもしれない。
で、ちゃんとした使い方はこうだったんですね。できれば明示的にopenを記入してcloseでストリームを閉じる。へー。
document.open();
document.write("<h1>Hello</h1>");
document.close();
Element.innerHTML - Web API | MDN
いままでこれ（↑）と同じように使ってきたけども、そうだよねDocumentオブジェクトなんだから本格的に構文解析されるより前に実行されなきゃおかしいわね。そもそもの挙動が違っていたわけだね。
てことで今更そんなのを調べてしまったのでしたというお話。あと今後もdocument.close() を適切にあてることできれば使っても良いのでは？という邪悪な収穫があったのだった。ただそんなことはブラウザの方が許さなそうなので非推奨要素は使っちゃダメなんだなぐらいで生きていこうと思う。結局何も変わることはないというね……。
おわり
