safari是最垃圾的

290 阅读2分钟

先从一个问题开始: 你的项目能不能 Array.prototype.toSpliced()这个方法? image.png

看起来这个这个方法非常新, chrome 110是23年2月才release的。

另外, BroadcastChannel 呢?

image.png

这个api更早就支持了。

下面这个工具可以看到, ie11 不支持 BroadcastChannel, caniuse.com/?search=Bro…

image.png

这个问题的答案,取决于项目需要支持的浏览器版本, 以及这个项目使用了哪些polyfill.

我们的项目使用了umijs, umijs使用了babel, @babel/preset-env使用了core-js, 我们项目使用的是core-js@3.28, 浏览器要求支持ie11.

如果你看到Umijs的配置里有个 { "targets": { "ie": "11" } }

其实这个是 babel的配置 babeljs.io/docs/option…

那我们项目的答案是什么呢?

core-js 支持是支持 toSpliced 的 (GitHub - zloirock/core-js: Standard Library

而core-js不支持 BroadcastChannel 所以不管我们的项目怎么配置, BroadcastChannel是不能直接使用的。

另外core-js列了 stage 0 1, 2, 3, 4 和 ecma 标准的 功能. 但是 @babel/preset-env 只支持 Stage 3 以上的(babeljs.io/docs/babel-… 请看 tc39.es/process-doc…)

如果一定要用的话, 可以用 www.npmjs.com/package/bro…

每周150万的下载, 值得相信。 image.png

发散一个问题就是,这个是一个库,不是polyfill, 为什么corejs不支持这个api呢? 难道 api的 不属于“polyfill”吗? 是不是只有语法的支持的才是polyfill?

mdn (developer.mozilla.org/en-US/docs/… 的 定义是:“A polyfill is a piece of code (usually JavaScript on the Web) used to provide modern functionality on older browsers that do not natively support it.” 看起来api的支持也是polyfill.

另外这篇文章(remysharp.com/2010/10/08/… 举例 是session storage, 这也是个api.

所以我的理解是, corejs不支持BroadcastChannel, 只是因为没有实现。

现在主要的浏览器 chrome 和 edge都是自动更新,所以基本上都是最新的版本,兼容都是很好的。 但是safari不是自动升级的, 它是随着系统升级的, 而苹果系统的升级非常慢, 随意很多safari都是几年前发布的。

总而言之, safari是最垃圾的。