最近のWebAPIの変更点について

先日下記のような記事を書きました。

https://qiita.com/tanimoto-hikari/items/592747867f67dfd2f148

その過程でHTMLの変更だけでなく、WebAPIに関する変更点もいくつかありました。
同一記事に複数のテーマが含まれると読みづらくなるので分けて投稿することにしました。

:::note warn
他にも細かい変更はあったのかもしれません…
記事に掲載する変更が全てではない可能性があることをご留意いただけると幸いです…。
むしろ他にもあればコメントいただけると大変嬉しいです！
:::

## WebAPI変更点サマリー
1. [バック/フォワードキャッシュを追加](https://qiita.com/tanimoto-hikari/items/7e5dfff8acc4670425b7#%E3%83%90%E3%83%83%E3%82%AF%E3%83%95%E3%82%A9%E3%83%AF%E3%83%BC%E3%83%89%E3%82%AD%E3%83%A3%E3%83%83%E3%82%B7%E3%83%A5%E3%82%92%E8%BF%BD%E5%8A%A0)
1. [「汎用クローズリクエスト」の概念を導入](https://qiita.com/tanimoto-hikari/items/7e5dfff8acc4670425b7#%E6%B1%8E%E7%94%A8%E3%82%AF%E3%83%AD%E3%83%BC%E3%82%BA%E3%83%AA%E3%82%AF%E3%82%A8%E3%82%B9%E3%83%88%E3%81%AE%E6%A6%82%E5%BF%B5%E3%82%92%E5%B0%8E%E5%85%A5)
1. [`setHTMLUnsafe`および`parseHTMLUnsafe`メソッドの追加](https://qiita.com/tanimoto-hikari/items/7e5dfff8acc4670425b7#sethtmlunsafe%E3%81%8A%E3%82%88%E3%81%B3parsehtmlunsafe%E3%83%A1%E3%82%BD%E3%83%83%E3%83%89%E3%81%AE%E8%BF%BD%E5%8A%A0)
1. [`popState`とナビゲートイベントに'hasUAVisualTransition`属性を追加](https://qiita.com/tanimoto-hikari/items/7e5dfff8acc4670425b7#popstateevent%E3%81%8A%E3%82%88%E3%81%B3navigateevent%E3%81%ABhasuavisualtransition%E3%83%96%E3%83%BC%E3%83%AB%E5%B1%9E%E6%80%A7%E3%82%92%E8%BF%BD%E5%8A%A0)
1. [pagerevealイベントの追加](https://qiita.com/tanimoto-hikari/items/7e5dfff8acc4670425b7#pagereveal%E3%82%A4%E3%83%99%E3%83%B3%E3%83%88%E3%81%AE%E8%BF%BD%E5%8A%A0)
1. [`navigation.activation`のサポート、`NavigationActivation`インターフェースを追加](https://qiita.com/tanimoto-hikari/items/7e5dfff8acc4670425b7#navigationactivation%E3%81%AE%E3%82%B5%E3%83%9D%E3%83%BC%E3%83%88navigationactivation%E3%82%A4%E3%83%B3%E3%82%BF%E3%83%BC%E3%83%95%E3%82%A7%E3%83%BC%E3%82%B9%E3%82%92%E8%BF%BD%E5%8A%A0)

### バック/フォワードキャッシュを追加
目的は
- バック/フォワードキャッシュ(bfcache)が使用されなかった理由を開発者に提供する
- ウェブサイトのデバッグとbfcache対応を容易にする

具体的には、履歴ナビゲーション時にページがbfcacheから復元されなかった理由を収集する方法を提供し、フレームツリー構造でNotRestoredReasonsを報告することのようです。

`Performance Navigation Timing API`を拡張して実装されたとのこと。

https://github.com/whatwg/html/pull/9360


### 「汎用クローズリクエスト」の概念を導入

#### 変更点
- モーダルダイアログ要素と自動ポップオーバーがクローズウォッチャーに変換される
- `CloseWatcher API`が追加され、開発者が独自のクローズウォッチャーを作成できるようになる
- フルスクリーンAPI標準の一部が正式化される

:::note
クローズウォッチャーは、新しく導入される概念でユーザーインターフェース（UI）の特定の部分や要素が「閉じられる」べき状況を監視し、管理するオブジェクトのことらしいです！
:::

#### 仕様の更新
- Escキーを使用するユーザーエージェントでは、keyupイベントをクローズリクエストイベントとして要求
- requestClose()メソッドの導入
- 「クローズシグナル」の概念を「クローズリクエスト」に名称変更

https://github.com/whatwg/html/pull/9462

### `setHTMLUnsafe`および`parseHTMLUnsafe`メソッドの追加

`Sanitizer API`の再設計が行われたようです！
Webアプリケーション、クライアント側で`innerHTML`を利用したHTML文字列を操作する実行タイミングによっては安全に処理をすることが難しいです。

入力を慎重に管理するライブラリもありますが、クライアント側には改善の余地が残されておりより安全なHTMLレンダリング方法の開発の一環としての対応のようです。

:::note
DOM操作をクライアント側で行う時に思い出せると良いこと思いました！
:::

https://github.com/WICG/sanitizer-api/blob/main/explainer.md

### `PopStateEvent`および`NavigateEvent`に`hasUAVisualTransition`ブール属性を追加

「Safari iOS」と「Safari Desktop」で発生するページ間の視覚的な遷移を修正するための対応とのことです。

ユーザーがブラウザの戻る/進む機能を利用すると、開発者の意図しないトランジションが発生し、ユーザーエクスペリエンスへの悪影響を修正するための対応とのこと。

https://github.com/whatwg/html/issues/8782


### `pagereveal`イベントの追加

現行のライフサイクルや表示系のイベント（例えばpageshow）は、段階的なレンダリングを考慮していません。そのため、ページが最初に表示される前のイベントが存在しません。これにより、新しいページの初期レンダリングやキャッシュからの再表示時に問題が発生し、開発者がページの初期設定するチャンスが限られてしまいます。

上記を解決するためのイベント追加のようです。

https://github.com/whatwg/html/pull/9818

### `navigation.activation`のサポート、`NavigationActivation`インターフェースを追加

- `NavigationActivation`インターフェースの追加
- `navigation.activation`オブジェクトの追加

`NavigationActivation`インターフェースは、新しいページがアクティブ時に提供される情報を管理してくれるようです。

`navigation.activation`は、ページ移行時ナビゲーションに関連する詳細情報を提供します。
提供されるのは以下の属性
- from: ナビゲーションが開始されたソースドキュメント
- entry: 新しいナビゲーションエントリー
- navigationType: ナビゲーションのタイプ（例：リンククリック、移動、リロードなど）

https://github.com/whatwg/html/pull/9856

## 【まとめ】最近のWebAPIの変更点について
個人として使ったことないWebAPIがほぼ全てなのでどのような要件の時に使うのか正直想像がついていません…。

:::note
記事にしておくことでいつか利用できるのではないかと思ったので自分用のメモとしては役立ってくれると考えています！
:::

ストックしておいてもらえるといつか役に立ってくれるかもしれません！