# Safari 27.0 带来 80 项特性与 844 项修复

> WebKit 的 Safari 27.0 文章列出 80 项特性与 844 项已解决问题，包括 Service Worker 静态路由、滚动锚定和可定制 select。

Safari 27.0 包含 80 项特性和 844 项已解决问题，WebKit 在 2026 年 9 月 17 日的特性文章中公布了这些数字；6 月首个 beta 版本有 58 项特性。按文章图表，Safari 27 的项目中，86% 是已解决问题，11% 是改进特性，2% 是全新特性，不足 1% 是弃用项目。改动涉及页面和 Worker 可调用的 API，也涉及 Safari 浏览器及开发工具
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/))。

<span id="这一版都算进了些什么"></span>

## API 与开发工具改动

WebKit 的 Web API 章节列出静态路由和三项流能力，供网页代码使用；Safari MCP 属于浏览器开发工具，在独立章节介绍
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/))。

### 网页应用可以调用的部分

WebKit 对 Service Worker 静态路由 API 的描述是：让 Service Worker 声明路由规则，从而使某
些请求完全绕过 Service Worker。MDN 在
`InstallEvent.addRoutes()` 参考文档中将静态路由描述为「定义了抓取指定资源的规则，并且在
Service Worker 启动之前就会生效」。规则用 `source` 指定获取资源的来源，可取 `network`、
`cache`、`fetch-event` 或 `race-network-and-fetch-handler`。规则还用 `condition`
指定匹配条件，可以用 `URLPattern` 匹配请求地址，也可以匹配请求方法、请求模式或请求目标类型。
Service Worker 自身的运行状态也是可匹配条件，路由规则可以据此决定哪些请求符合条件
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/); [MDN](https://developer.mozilla.org/en-US/docs/Web/API/InstallEvent/addRoutes))。

Safari 27.0 同时扩展了读取、创建和转移流（stream）的能力。WebKit 列出的异步迭代支持让
代码可以用 `for await...of` 遍历可读流。创建流时，新增的静态方法 `ReadableStream.from()`
可接收可迭代对象或异步可迭代对象，MDN 说明它会返回一个可读流。
同一版还支持用 `postMessage()` 转移流，把流交给另一个上下文。
接收方拿到的同样是可读流。Streams 标准写明，接收端得到的
「转移后的流可以完全像原流那样使用」，而「原流会变为被锁定、不再可直接使用」
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/); [MDN](https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream/from_static); [Streams Standard](https://streams.spec.whatwg.org/#rs-transfer))。

滚动锚定（scroll anchoring）改变浏览器行为，无需调用方法。WebKit 对它的描述
是：当内容在视口上方加载出来时调整滚动位置，让页面不会在读者脚下跳动；并点名 CSS 属性
`overflow-anchor` 作为控制手段。MDN 关于该属性的参考文档只记录了两个取值，`auto` 与
`none`，这个属性用于关闭某个元素的滚动锚定。
支持该行为的环境默认启用它，无需另行开启
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/); [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-anchor))。

WebKit 报告称，`<select>` 现在可以通过
`appearance: base-select` 实现完整定制，并带来包括 `::picker-icon` 与 `::checkmark` 在内
的新伪元素，以及在 `<option>` 内部放置 HTML 的能力
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/))。

Safari 27.0 还新增 `<selectedcontent>` 元素，用来控制当前选中项所显示的内容。WebKit 强调，可定
制后的控件仍是真正的表单控件，因此继续自动支持键盘导航、屏幕阅读器、表单提交、校验与
`change` 事件。新的浏览器默认样式还覆盖浅色与深色模式、强制颜色模式以及禁用状态；开发者既
可以保留这些默认样式，也可以继续覆盖它们
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/))。

图片方面，这一版为延迟加载图片的 `sizes` 增加 `auto` 关键字。WebKit 称，在实际布局宽度已知
后，Safari 会据此自动计算图片尺寸，页面无需事先猜测渲染宽度。声明式 Shadow DOM 也新增
`shadowrootslotassignment` 属性，可以直接在 HTML 中把 slot 分配模式设为 `named` 或
`manual`，与 JavaScript 的 `attachShadow({ slotAssignment: "manual" })` 选项对应
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/))。

### 改变运行环境的部分

Safari MCP 服务器是开发工具，不提供 Web API。WebKit 称它已在 Safari 27.0 中提供，可让
编码智能体访问 DOM、网络请求、截图与控制台输出。WebKit 给出的启用步骤需要在 Safari 设置中允许远程自动化和外部智能体。进入 Safari >
Settings > Developer，勾选 "Allow remote automation and external agents"。
随后可按文章的 Codex 示例启动服务器，运行 `/usr/bin/safaridriver`，并传入 `--mcp` 参数
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/))。

HTML `<model>` 元素在这一版中面向 iOS、iPadOS 与 macOS 提供，WebKit 点名的属性包括
`environmentmap` 与 `stagemode`。在 visionOS 上，同一个元素再加上一套 JavaScript 沉浸式
API，可以让站点提供自定义的沉浸式环境，取代 WebKit 此前以 Spatial Backdrop 之名发布的开发
者预览
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/))。

WebAssembly JSPI 允许按同步风格编写的 WebAssembly 代码挂起执行。
WebKit 说明，这些代码可以在挂起期间等待 JavaScript 的 promise
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/))。

Safari 27.0 的 Web Inspector 在 Color Picker（颜色选择器）中直接显示颜色对比度信息。查看网络重定向时，Network（网络）标签页会列出重定向链中的
每一次请求。Elements（元素）标签页新增标记，用来标识 Subgrid 与 Grid Lanes。
查看 Timeline（时间线）的布局事件详情，还能找到触发这次布局的根元素。WebKit 还写明，Safari MCP 完全在本机运行，自身不会发出网络
请求，也无法访问 Safari 中的个人信息；捕获的数据直接交给正在运行的智能体，不发送给
Apple
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/))。

网络功能方面，Safari 27.0 支持在明文 HTTP 的回环主机上，通过 JavaScript 或 `Set-Cookie` 头
设置带有 `Secure` 标记的 cookie。WebGPU 方面，这一版新增 WGSL 的 `clip_distances` 内建值，使
顶点着色器能够定义自定裁剪平面，并在光栅化发生之前丢弃该平面一侧的几何内容
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/))。

媒体提示的结束时间 `TextTrackCue.endTime` 现在接受 `Infinity`，可以用这个值表示
提示时长没有上限。使用 WebCodecs 解码视频时，视频内嵌的色彩空间元数据缺失，
或者元数据指定了错误的色彩空间时，硬件 `VideoDecoder` 可以覆盖解码视频采用的色彩空间。Canvas 则新
增 `srgb-linear` 与 `display-p3-linear` 两种预定义线性光色彩空间；调用
`CanvasPath.roundRect()` 时还可以省略 `radii` 参数，以绘制带直角的普通矩形，这与调用
`rect()` 的效果相同
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/))。

## 质量方面的工作都去了哪里

WebKit 用五个主题描述质量改进：Compatibility（兼容性）、Foundations（基础实现）、Depth（实现深度）、Alignment（行为一致性）和 Integration（集成）；详细的已解决问题清单则按技术领域编排。文章在 Foundations 主题下提到全新的 ES
模块加载器，同时也在 JavaScript 特性清单中列出这次符合标准的加载器重写，并称它修复了与顶层
`await` 有关的模块执行顺序和初始化问题
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/))。

<span id="对-pwa-开发者为什么重要"></span>

## 路由、流与表单控件更新的意义

静态路由让已安装的 Service Worker 声明会在 Service Worker 启动前使用的规则。可转移的流让
一个上下文接收可读流，而原流变为锁定且不能再直接使用
([MDN](https://developer.mozilla.org/en-US/docs/Web/API/InstallEvent/addRoutes); [Streams Standard](https://streams.spec.whatwg.org/#rs-transfer))。

滚动锚定会在视口上方加载内容时调整滚动位置，`overflow-anchor: none` 可以让元素退出该行
为。可定制 `select` 新增了 `appearance: base-select`、相关伪元素，以及在 `<option>` 中放置
HTML 内容的能力
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/); [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-anchor))。

WebKit 的文章为 Safari 27.0 报告了 80 项特性与 844 项已解决问题
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/))。

## 站内相关条目

- [平台](/zh/reference/platforms/)：平台参考。
- [Baseline 支持概览](/zh/reference/platforms/baseline-2026/)：Baseline 2026 支持。
- [按浏览器查看兼容性](/zh/compatibility/by-browser/)：按浏览器查看各项 Web 平台能力的兼容性。

## 尚未验证与存疑之处

- WebKit 如何逐项区分已解决、已改进、全新和弃用项目，尚未确认。
- Safari 27.0 每项特性的完整逐平台可用性矩阵，尚未确认。
- MDN 记录的每一种静态路由条件与来源，在 Safari 27.0 中是否行为完全一致，尚未确认。
- Safari 27.0 发布的可定制 select 伪元素与 `<model>` 属性完整集合，尚无完整的逐项记录。
- 每一种第三方编码智能体是否都支持同样的 Safari MCP 工作流，尚未确认。

## 更正（2026-10-14）

WebKit 特性文章发布于 2026 年 9 月 17 日，报告了 80 项特性。图表统计
项目构成，不衡量工作量。模块加载器重写同时列在质量主题和特性清单中；
Safari MCP 配置方式也由 WebKit 原文给出
([WebKit](https://webkit.org/blog/18325/webkit-features-for-safari-27-0/))。

## 参考来源

- [WebKit 的 Safari 27.0 特性文章，发布于 2026 年 9 月 17 日](https://webkit.org/blog/18325/)（webkit.org）
- [InstallEvent：addRoutes() 方法](https://developer.mozilla.org/en-US/docs/Web/API/InstallEvent/addRoutes)（developer.mozilla.org）
- [overflow-anchor](https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-anchor)（developer.mozilla.org）
- [ReadableStream：from() 静态方法](https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream/from_static)（developer.mozilla.org）
- [Streams 标准：转移 ReadableStream](https://streams.spec.whatwg.org/#rs-transfer)（streams.spec.whatwg.org）