Svelte 浏览器支持：最低版本要求、功能例外表及其自动化生成机制

本文讲解 Svelte 的浏览器支持矩阵：哪些浏览器版本是 Svelte 运行时的最低门槛、哪些特定功能需要更高的浏览器版本，以及这套数据是如何通过构建管线（rollup 打包 + TypeScript 类型感知扫描 + Baseline 数据）自动生成并维护的。读完后你既能直接查表确定部署目标，也能理解表格背后每个数字的来源，从而准确评估自己项目（而非仅 Svelte 本体）的兼容性。

一、Svelte 的最低浏览器版本要求

下表是 Svelte 官方文档声明的最低浏览器版本，它由 Svelte 内部代码实际使用的浏览器 API 推导而来（数据快照见 browser-support.md）：

Browser	Minimum version
Chrome/Edge	87
Firefox	83
Safari	14
Opera	73
Opera (Android)	62
Samsung Internet	14.0
Android WebView	87
Internet Explorer	not supported

需要强调三点边界：

• 范围仅限 Svelte 本身。官方文档 05-browser-support.md 明确说明：该表不覆盖 SvelteKit、其他 Svelte 生态库，也不覆盖你自己的代码。如果你的应用还依赖第三方库，实际兼容基线取决于其中最严格的那一方。
• 这是一个 Baseline 目标。表格注释将其等价于 Baseline 2020 目标（即 Web 平台 Baseline 体系中 2020 年及以前达到基线的全部 API 都可用）。
• Internet Explorer 不受支持，表格中直接标注 not supported。

二、功能例外：部分特性要求更高的浏览器版本

并非所有 Svelte 功能都满足上面这条基线。少数功能依赖更新的浏览器 API，只有当你确实使用了这些特定功能时才需要关注第二张表（快照见 browser-support-features.md）：

Feature	Chrome/Edge	Firefox	Safari
$state.snapshot	98	94	15.4
bind:devicePixelContentBoxSize	—	93	not supported
flip from svelte/animate	—	126	—

表中 “—” 表示该浏览器满足基线即可，无需额外版本要求；“not supported” 表示该浏览器（截至表格生成时）没有支持该 API，功能实际不可用。

结合生成脚本 generate-browser-support.ts 中的注释和源码，可以弄清这三行的来历：

• $state.snapshot：快照机制依赖 structuredClone。该 API 在运行时确实被调用，见 clone.js 中两处 structuredClone(value) 调用（L110、L131）。
• bind:devicePixelContentBoxSize：依赖 ResizeObserver 的 box: 'device-pixel-content-box' 构造选项和 entry.devicePixelContentBoxSize 属性，对应运行时代码 size.js。脚本注释说明：Safari 从 15.4 起静默接受该选项但从未暴露对应的 entry 属性，因此该绑定在任意版本的 Safari 上读取的都是 undefined——这就是表中 Safari 标注 not supported 的原因。
• flip（svelte/animate）：其 fallback 路径会读取 getComputedStyle(current).zoom，见 animate/index.js。Firefox 直到 126 版本才在 CSSStyleDeclaration 上暴露 .zoom，更早版本读取结果为空字符串，会破坏动画计算——因此只有 Firefox 一列需要提升版本要求。

三、表格如何生成：从打包到 Baseline 推导的完整管线

上述两张表都是自动生成的（文件头部标注 “do not edit”），由 generate-browser-support.ts 重新生成 05-browser-support.md 中 @include 的两个 .generated 片段。脚本头部的管线说明概括了四步：

1. 按用户视角打包每个运行时入口。脚本读取 package.json 的 exports 字段，枚举所有面向浏览器的子包（browser_subpaths() 自动过滤 ./compiler、./server 等 Node-only 导出），再用 rollup 以 ['production', 'import', 'browser', 'default'] 导出条件打包（bundle() 函数）。这样扫描的是浏览器中真实执行的代码，而非源码。
2. 类型感知扫描。检测器 browser-support.detector.js 用 TypeScript 编译器 API 构建 ts.Program + TypeChecker，遍历打包产物：
   • 全局标识符（如 structuredClone、ResizeObserver）；
   • 类型成员访问（按接收者的解析类型匹配，如 CSSStyleDeclaration.zoom）；
   • JS 语法特性（可选链、空值合并、私有字段等，见 SYNTAX_PREDICATES 表）；
   • 特定字符串字面量（如 'device-pixel-content-box'，用于捕获 AST 无法体现的构造器选项）。 扫描结果映射到 web-features 数据集里的 feature ID。此外，register_extra_rules() 注册了补充规则，用于 web-features 尚未收录的 API（即上文 Firefox 126 的 zoom 读取和 ResizeObserver 的 device-pixel 选项两条）。 除运行时包外，脚本还会加载快照测试目录（tests/snapshot/samples）中所有编译器产出的 client JS 做纯语法扫描，覆盖编译器会生成的各种模式（绑定、过渡、<svelte:element>、水合标记等）。
3. 推导 Baseline 年份。compute_floor() 取所有被检出 feature 的最高 Baseline 年份作为运行时基线，并保证不低于 2015（Math.max(year, 2015)），确保文档永远不会声称一个 ES6 之前的目标。
4. 翻译为具体浏览器版本。优先使用 web-features 的逐功能精确版本；数据缺失时回退到 baseline-browser-mapping 的年份映射（browser_versions_for() 调用 getCompatibleVersions({ targetYear, includeDownstreamBrowsers: true })，并过滤掉 UC、QQ 等长尾浏览器以保持表格聚焦）。Chrome 与 Edge 版本相同时合并为一行展示，与上表一致。

脚本还有一道自检：validate_ignore_features() 会校验每条“行为性忽略”条目仍能被检测器检出，若 API 已从运行时移除则直接报错，提示维护者删除陈旧条目——这保证了抑制清单不会悄悄过时。

四、抑制清单：为什么某些 API 不抬高基线

生成脚本定义了两类“抑制”（ignore），理解它们是读懂表格的关键：

SAFE_TO_IGNORE（数据安全豁免）——无论运行时当前是否使用该 API 都不影响基线，原因有二：

• web-features 数据集误分类了 API。例如 devicepixelratio 因数据集中 Safari 支持信息缺失被标记为 Baseline false，但该属性实际上早在十年前就已进入所有 Safari；
• Svelte 对 API 做了运行时特性检测并在不可用时优雅降级。典型例子是 trusted-types：reconciler.js 用 globalThis?.window?.trustedTypes && ...createPolicy('svelte-trusted-html', ...) 的可选链写法——旧浏览器读不到 trustedTypes 时表达式直接短路，功能正常降级。

BEHAVIORAL_IGNORE（行为性抑制）——这些 API 确实存在于运行时，但只经由特定代码路径触达，已在“功能例外表”中单独说明，因此不抬高总体基线。当前包含 structured-clone（对应 $state.snapshot）、extra:css-zoom-read（flip 的 zoom 读取）和 extra:device-pixel-content-box 三条，恰好与第二张表的三行一一对应。

五、实践指引

• 常规部署：按第一张表配置即可，等价于 Baseline 2020 目标；IE 用户直接放弃支持。
• 使用了例外功能：如果你用到 $state.snapshot、bind:devicePixelContentBoxSize 或 animate:flip，按第二张表取更严格的版本；其中 bind:devicePixelContentBoxSize 在 Safari 上根本不可用，需要为该绑定准备降级方案。
• 数据会随版本演进：表格由脚本从“打包产物 → API 检出 → Baseline 数据”链路生成，Svelte 内部每引入或移除一个 API，重新运行脚本就会刷新表格；因此本文引用的版本数字以当前仓库快照为准，升级 Svelte 后建议重新核对官方文档页。
• 别忘了你自己的代码和生态依赖：官方表格只约束 Svelte 本体，完整兼容性评估还需叠加你的业务代码、SvelteKit 及其他库的要求。

关键文件索引

内容	路径
官方浏览器支持文档（主体）	05-browser-support.md
基线版本表（生成产物）	browser-support.md
功能例外表（生成产物）	browser-support-features.md
生成脚本（打包 + 扫描 + 渲染）	generate-browser-support.ts
类型感知 API 检测器	browser-support.detector.js
structuredClone 使用处	clone.js
trusted-types 特性检测处	reconciler.js
ResizeObserver device-pixel 绑定	size.js
flip 的 zoom 读取	animate/index.js