Thread by @novoreorx

开个串记录下观看 Google IO What's new for the web platform 中发现的有趣的 feature

Array 增加了 at 方法，JavaScript 终于可以用类似 Python list[-1] 的写法了

新类型 URLPattern，定义 URL 路径中的参数并解析出对应的 object。routing library 不用再写麻烦的正则了

Cascade Layers, 给 CSS 加上了层级的概念，layer 可以自由排列顺序，后面的比前面的有更高的优先级 (specificity)；还展示了下越来越复杂的 CSS 优先级关系图，其实也可以把每一级都当做一个 layer。

用于声明父子元素关系的 :has 选择器！这个功能前阵子正好搜索过，现在只能用 JavaScript 实现。图中的代码可以解释为，在包含 <figcaption> 的 <figure> 元素中，将其 children 中的 <img> 增加 1rem 的 bottom margin。

Container queries，在响应式中能够发挥重要作用，但我基本没听懂，未来应该会影响一些 CSS 框架的 API，到时候再来学习吧。

CSS accent-color，为 HTML 基本元素设定一个统一的色调，主流浏览器在一年内都争先恐后地实现了😂，毕竟这是最能体现自己颜值的功能。不知道能不能和操作系统的 accent-color 互通，这样体验就更一致了。

<dialog> 和 <selectmenu>，基本上所有 UI Kit 都会在组件库里实现的功能，终于被 HTML 原生实现了。如果 HTML 能多一些这种常用的交互组件，我会很乐意手写 vanilla JavaScript 来使用它们。

<datetime-local>, 我记得 7 年前在豌豆荚工作时，因为这个标签不被 Firefox 支持，被迫找了一个 JavaScript 库来代替 (Pikaday, I still remember)。如今终于可以在主流浏览器上全面通用，太不容易了😭。

CSS aspect-radio，使元素保持固定的宽高比。这是曾经在 <img> 标签上的实验特性，如今终于被所有元素支持了。

CHIPS，Cookie 在安全策略上的新特性，为 Set-Cookie 增加了 Partitioned 关键词。可以使特定 cookie 在 iframe 中只用于当前站点。自两年前 SameSite 关键词推广后，third-party cookie 只能选择全有或者全无，这次终于有了一个折中的选择。

Window controls overlay，允许 PWA 窗口在 window bar 上有一部分显示区域，获得更加有沉浸感的使用体验。

structuredClone, 再也不用写 JSON.parse JSON.stringify 这种扭曲心智的代码了，非常适合在面试官问到 deep clone 的问题时反将一军。还可以用来 clone 其他数据结构如 blobs, bitmaps, typed arrays。

createImageBitmap, 把 blob 直接转化成 Image 对象，再也不用写扭曲心智的代码 x2。

---

至此笔记结束。其实是看到一大半才有记录的想法，于是先把后半部分写完，再从头开始完成闭环。

手语版把我笑死，第一次发现手语是如此有趣