Question

我最近遇到了使用旧设备并且其浏览器（主要是Safari 9）会引发JS错误的用户，因为他们没有实现我们在现代SPA应用程序*中使用的const关键字。

我想解决的办法是让Babel用常规的var关键字重新编译整个应用程序，但是我担心这样做会导致网站速度下降。您对此有任何想法/经验吗？

如果我们决定支持此类浏览器，是否有办法为这些浏览器编译该网站的版本？我听说可以对javascript文件使用媒体查询。方便吗？

* 我们正在https://www.myjobglasses.com 托管一个ReactJS应用，该应用来自弹出的create_react_app

Answer 1

在上传之前，请使用Babel转换网站代码。根据我的经验，即使定位到较旧的浏览器，它也不会显着降低您的应用速度。

Babel有一个很棒工具，可以为特定的浏览器转换代码，称为babel-preset-env：

使用https://github.com/browserslist/browserslist进行检查时，您可以定义转译将遵循的不同规则，因此-结果总会有有效的代码，例如（摘自preset-env文档）：

{
  "targets": "> 0.25%, not dead"
}

{
  "targets": {
    "chrome": "58",
    "safari": "9"
  }
}

另一个想法-如果您想更深入地研究，实际上可以准备两个捆绑软件，并根据浏览器版本有条件地加载它们（因此，本质上，对于Safari的这种特定情况）。

这将要求您在连接到服务器时（例如通过User-Agent）以某种方式检测浏览器并提供不同的捆绑软件，但这是可行的;）

Answer 2

使用 Modernizr 之类的软件包怎么样？您可以检查客户端的浏览器是否支持某些已知在Safari中失败的功能，并将其包含在Modernizr支持中。我认为这很简单。检出 Modernizr here