JSで画面遷移を制御する場合、各ページのテンプレート用htmlをキャッシュするのはよくあるけど、このキャッシュをどの程度キャッシュするかは結構悩ましい。

単純に変数として保持してページ読み込み時に再度取得し直すなら簡単だけど、そうすると最初の読み込みに時間がかかるようになるので出来ればlocalStorageに保持したい。

ただ、localStrageに保持するとhtmlを修正しても反映されなくなる問題がある。

これは一定時間ごとにキャッシュを破棄して取得し直すことで解決するけど、ページの初期表示を高速化したい場合最初のページはキャッシュから読み込む必要がある。

ただ、その場合JS、CSSも過去のテンプレートhtmlに適応されても問題ない形式にする必要があって、更にパーマネントリンクを持っている場合全ページに対して互換性をもたせる必要がある。

この場合、「最初のページはサーバから取得する」とすればlocalStorageが使えなくなるので初期表示が重くなる。

「全ページに対して過去すべてのバージョンのhtmlとCSS, JSの互換性をもたせる」のは現実的じゃない。

「JS、CSS、htmlそれぞれにバージョン番号を付けて、一致しない場合古いもののみを再読み込みする」のは結構いいけど、その場合JSは一度展開済みになるので「再読み込み」が難しい。

（CSSはlink要素を削除すればいい）

「最初に読み込む用のサーバが返すhtmlにバージョン番号を埋め込んで、外部JS読み込み用のJSだけは静的に読み込み。そのJSがCSS、本体JS、htmlのローカルキャッシュバージョンを参照して一致する場合全適応。一致しない場合一致しないもののみ再読み込み」なら問題ない。

ただ、その場合最初に必ずJSから他のデータを読み込む必要があるので普通に参照するより重くなる可能性がある。