document.currentScript と Element.replaceWith(...) で自己置換される embed 要素作れそうで神.

問題なのは, <script> の中にテンプレートを置きたくないところ ... <template> でも使うか?

custom elements めっちゃ美しいな ... DOM 解釈も汚さないし lifecycle も制御しやすいし ... ここに来て custom elements か ...

まあぶっちゃけた話, そう, React とか使わんでも特定の "isolated island" に対する制御が必要なだけなら body や main を mount する巨大なフレームワークなんて要りません ...

なんとなく似た思想を Remix から感じてはいたけど, いつも踏みとどまるのはアレ複雑な "location-interactive components" を作成するのに適しているのであって, こんな静的サイトに使うものではない. 計算資源の無駄をやめよう.

うーん, embed block を配置するのは良いんだが, 安定してないレイアウトの安定してないの部分に踏み込まないといけない ... 主に absolute の挙動がダメだ. 要するに aside 側が次の aside と被る可能性がある.

aside "column" をホバーしたら縦方向に expand をアニメーション ... 複雑だなあ. うーん ...

今はほとんど flex も grid も使ってないみたいなレイアウト志向だけど, こう言う要件だと grid の方が適してるよなあ. ただ, DOM が汚くなる ... あいや, CSS で自分がどの "cell" を占有するのかは制御できるんだっけか?

例えば n-rows 2-columns の grid なら "has-no-aside" は 2 columns, "has-aside" は 1 column みたいな. あとは padding か margin で良い感じに ... しょっぱいのは, 今 :root の variables で制御してるいくつかのパラメータを整理しないといけないし, それらを　grid 向けに整理すると grid on grid になる可能性が ... でもまあ, fat grid でしんどくなるくらいならマシか ...?

今の template.html は右手側の padding / margin を考慮していなくて aside が突き出る形になっているし, それらも踏まえた背景の枠組みは再設計したいとは思っていたし ...