トランスクルージョン
1つの文書の中の1部分を、別の文書のパーツとして読み込む事
https://gyazo.com/e4ae9f7d4dfce3d1c88fd10a9d4d9073
staticなwebページ同士でしか使えないしくみだと思うshokai.icon
変更しづらい
BをAに読み込んだら
Bがちょっと変更しづらくなる
Bを変更するとAも変わるのがメリットのはずなのに、実はあまり変えたくなくなる
Bの読み込み範囲をA側で宣言しなければならない
Bの内容を変更すると、A側の表示も変わる
意味不明な埋め込みになる可能性がある
トランスクルージョンって実のところ更新頻度の低い記事同士でしか使えないのでは、という考察を昔書いたな、と思って社内Cosense見たら、別プロダクトの機能開発の相談時にそれを参照してなんか正しく意思決定してるっぽい様子が1年越しに見れて良かった
読み込み範囲を指定する方法が難しい
行番号？テキストの最短一致？
常に破綻しないように気をつける必要がある
Bの本文を変更すると、Aに読み込まれるBのパーツが破綻する
transclusionが増える毎にどんどん変更しづらくなる
1つのtransclusionならまあなんとかなる
2つtransclusionがあると
例えば5〜10行目を読み込むtransclusionと、3〜8行目を読み込むtransclusionがあったら
範囲がかぶっている
一方のtransclusionの内容が破綻しないように気をつけて修正しても、もう一方は破綻してしまう
scrapboxの様な、高速に多人数が複数のページを編集しまくるシステムに導入すると
難しいことになっていく
リビジョンが指定できたら問題ないのでは?bsahd.icon
Page Historyへリンクするイメージ
+1nishio.icon
トランスクルージョンが機能として提供されてなくてAの中にBのコンテンツがあって欲しいとき、ユーザはコピペをする
意見
協調が前提の仕様ですね
scrapboxで1つのアイディアを長時間扱っていると、1,2年前の自分と協調する事もよくありますshokai.icon
https://svg-hosting.vercel.app/api/svg?url=https://scrapbox.io/api/code/villagepump/トランスクルージョン/test.svg
code:test.svg
<foreignObject x="0" y="0" width="100%" height="100%">
<head>
<style>
body {
font-family: "Open Sans", Helvetica, Arial, "Hiragino Sans", sans-serif;
}
*{box-sizing:border-box}
a{background-color:transparent;text-decoration:none;cursor:pointer}
img{display:inline-block;max-width:100%;max-height:100px}
code{font-family:var(--code-text-font, Menlo, Monaco, Consolas, "Courier New", monospace);font-size:90%;color:var(--code-color, #342d9c);background-color:var(--code-bg, rgba(0,0,0,.04));padding:0;white-space:pre-wrap;word-wrap:break-word} strong{font-weight:700}
iframe{display:inline-block;margin:3px 0;vertical-align:middle;max-width:100%;width:640px;height:360px;border:0}
audio{display:inline-block;vertical-align:middle;white-space:initial;max-width:100%}
.formula{margin:auto 6px}.formula.error code{color:#fd7373}.katex-display{display:inline-block!important;margin:0!important;text-align:inherit!important}.error .katex-display{display:none}
.cli{border-radius:4px}.cli .prefix{color:#9c6248}.helpfeel{background-color:#fbebdd;border-radius:4px;padding:3px!important}.helpfeel .prefix{color:#f17c00}.helpfeel .entry{color:#cc5020}.code-block{display:block;line-height:1.7em;background-color:var(--code-bg, rgba(0,0,0,.04))}.code-block-start{font-family:Menlo,Monaco,Consolas,Courier New,monospace;color:#342d9c;background-color:#ffcfc6;font-size:.9em;padding:1px 2px}.code-block-start a{color:#342d9c;text-decoration:underline}code.code-block,.table-block.table-block-row{padding-left:1em}.copy{font-family:"Font Awesome 5 Free";cursor:pointer}.table-block{white-space:nowrap}.table-block-start{padding:1px 2px;font-size:.9em;background-color:#ffcfc6}.table-block-start a{color:#342d9c;text-decoration:underline}.cell{margin:0;padding:0 2px 0 8px;box-sizing:content-box;display:inline-block;white-space:pre}.cell:nth-child(odd){background-color:#0000000a}.cell:nth-child(2n){background-color:#0000000f}.strong-image{max-height:100%}.icon{height:11px;vertical-align:middle}
.strong-icon{height:13.2px}
.lines{padding:2px;border:solid 1px gray;border-radius:3px;}
</style>
</head>
<body>
<div data-theme="default-light" class="lines">
<div data-id="62fc0d844ade4d0000d65782" data-indent="1" class="line" style="margin-left: 1em;">transclusionが増える毎にどんどん変更しづらくなる</div>
<div data-id="62fc0d844ade4d0000d65783" data-indent="2" class="line" style="margin-left: 2em;">1つのtransclusionならまあなんとかなる</div>
<div data-id="62fc0d844ade4d0000d65784" data-indent="2" class="line" style="margin-left: 2em;">2つtransclusionがあると</div>
<div data-id="62fc0d844ade4d0000d65785" data-indent="3" class="line" style="margin-left: 3em;">例えば5〜10行目を読み込むtransclusionと、3〜8行目を読み込むtransclusionがあったら</div>
<div data-id="62fc0d844ade4d0000d65786" data-indent="3" class="line" style="margin-left: 3em;">範囲がかぶっている</div>
<div data-id="62fc0d844ade4d0000d65787" data-indent="2" class="line" style="margin-left: 2em;">一方のtransclusionの内容が破綻しないように気をつけて修正しても、もう一方は破綻してしまう</div>
<div data-id="62fc0d844ade4d0000d65788" data-indent="1" class="line" style="margin-left: 1em;">scrapboxの様な、高速に多人数が複数のページを編集しまくるシステムに導入すると</div>
<div data-id="62fc0d844ade4d0000d65789" data-indent="2" class="line" style="margin-left: 2em;">難しいことになっていく</div>
</div>
</body>
</html>
</foreignObject>
</svg>