112 の CSS Nesting に比べるとあまり気になる追加機能のないバージョンですが WebGPU は一部開発者の人には嬉しい機能なのかもです
個人的には Canvas の WebGL ですら使わないので 使うことはなさそうですけど
ゲームとか AI 処理で活用されるのでしょうか
アクセスにユーザー許可がいらないなら以前流行ったマイニングに利用されてまた流行ったり?
他には CSS 機能がいくつか増えてるようです
メディア機能 (@media) に update と overflow-block と overflow-inline が追加されます
update では 更新される画面 (PC) か更新されない画面 (印刷) かでスタイルを変えられるようです
電池残量が少なく画面の更新頻度が低い場合や 電子書籍リーダーみたいな画面更新が遅い環境向けの更新できるけど遅いというパターンも指定できるようです
overflow では はみ出たときに見えないか スクロールできるか ページに分かれるかなので これも画面か印刷かで分かれるようです
また animation の easing 関数で linear 関数が追加されてます
linear とか ease-out みたいに指定していたところで linear(0, 0.25, 1) みたいなものをかけるようになります
JavaScript では fetch の Header に getSetCookie メソッドが追加されます
fetch では Cookie を扱えません
fetch(url, {
headers: {
cookie: "foo=1; bar=2",
},
})
と書いても cookie は送信できませんし
const res = await fetch(url)
console.log([...res.headers.entries()])
と書いても 取得できるヘッダー情報に set-cookie が含まれずサーバーから保存するよう指定された Cookie の情報が見れません
セキュリティ上 仕方ないのかなと思いますが 今回の更新では set-cookie ヘッダーの情報が取れるようになるようです
const res = await fetch(url)
console.log(res.headers.getSetCookie())
getset って続く分かりづらい名前です
set-cookie の情報を取れたところでセットはできないですし あまり使いどころが思いつきません
fetch のオプションでは渡せませんが 現ドメインへのリクエスト限定なら document.cookie を書き換えれば送ることはできます
ただ set-cookie が返ってきてたら自動でセットされてるはずですし 意味がないです
そのまま使わず書き換えるにしても HttpOnly があると自動でセットされたデータを消せません
credentials を omit にすれば set-cookie で Cookie が保存されないので JavaScript でセットできるかもです
ですがそもそも現ドメインに限るなら サーバーを自身で管理してるはずなのでサーバー側で対応すればよく JavaScript で set-cookie を取得したいとなることもなさそうです
最近はサーバーサイドでも fetch が使われるので Node.js や Deno 向け仕様かなと思いましたが それなら送信時のセットもできないと不便です
試してみると Node.js 18 の LTS では Cookie が特別扱いされておらず set-cookie は headers のデータに含まれていました
やっぱりなんのために追加されたのかよくわからない機能です
気になったのでもう少し調べてみると Node.js などサーバー向け機能であってたようです
https://developer.mozilla.org/en-US/docs/Web/API/Headers/getSetCookie
set-cookie で複数の Cookie をセットする場合 HTTP header に set-cookie が複数回現れます
しかし ヘッダーのデータを JavaScript で取得するときには 1 つの文字列しか取得できません
Headers には URLSearchParams の getAll みたいなメソッドは無いようです
なので複数の set-cookie が 1 つにまとめられるのですが 「,」 区切りになります
期限の日付表記など 1 つの Cookie の情報のなかにも 「,」 は現れることがあるのでパースが大変です
「,」 で split するような簡単な方法で済ませられません
そこで getSetCookie があると便利で配列で取ってこれます
最初から MDN 見てればよかったです
console.log(process.version)
// v20.0.0
const res = await fetch("https://github.com/")
console.log(res.headers.get("set-cookie"))
// _gh_sess=7a略%3D; Path=/; HttpOnly; Secure; SameSite=Lax, _octo=GH1.1.143815131.1683069288; Path=/; Domain=github.com; Expires=Thu, 02 May 2024 23:14:48 GMT; Secure; SameSite=Lax, logged_in=no; Path=/; Domain=github.com; Expires=Thu, 02 May 2024 23:14:48 GMT; HttpOnly; Secure; SameSite=Lax
console.log(res.headers.getSetCookie())
// [
// '_gh_sess=7a略%3D; Path=/; HttpOnly; Secure; SameSite=Lax',
// '_octo=GH1.1.143815131.1683069288; Path=/; Domain=github.com; Expires=Thu, 02 May 2024 23:14:48 GMT; Secure; SameSite=Lax',
// 'logged_in=no; Path=/; Domain=github.com; Expires=Thu, 02 May 2024 23:14:48 GMT; HttpOnly; Secure; SameSite=Lax'
// ]