History API の state を使ってなかった

普段 History API を使うときは

history.pushState(null, "", url)

のように null と空文字は固定で URL だけ入れています

state は使わないので ブラウザの 戻る・進む が起きたときには popstate イベントが起きて そこから今のページの初期化処理を行います
内容は直接 URL を指定して開いたときと同じものです
事前にリソースがロードされてるだけの違いです
API のリクエストを行ってデータを取得して表示するページなら 戻る・進む であっても毎回リクエストを送ります

基本これでもよかったのですが 間違ってクリックして移動したときに 戻るボタンで戻ってきたら別の内容に変わってることもありえます
無限スクロールのページで結構下の方まで来てるときだと またロードし直しで時間がかかります

こういうときの状態を保持するのに state を使うのが良いかなと思って使おうとしました

使いづらい

/A から /B に移動するとします

history.pushState({ data: [1, 2, 3] }, "", "/B")

このときに /A の状態を保存してから /B に行きたいので 1 つめの引数に指定する state は /A に保存されることを期待します
ですが pushState 関数の機能は行き先である /B の state をセットするというものです

移動してから そのページとしての初期化を行い API にアクセスして情報を取得するなど state に保存するデータが決まるものです
移動前だと保存したいようなデータはありません
行き先の URL くらいしか情報がありませんが それは state に保存するまでもなく そのページが開かれているときなら location から取得できます

やっぱり pushState の 1 つめの引数は null に固定されます

結局やりたいことを行うには　replaceState も使ってこうする必要がありました

history.replaceState(current_state, "")
history.pushState(null, "", "/B")

なんで pushState はこんな仕様にしたんでしょうね