如果您不使用特征检测，真的需要 Modernizr 吗？

Posted 2023-02-21

【中文标题】如果您不使用特征检测，真的需要 Modernizr 吗？

【英文标题】：Is Modernizr really needed if you're not using the feature detection?

【发布时间】：2014-02-26 00:20:47

【问题描述】：

我一直跳入 Modernizr 位于头部的项目，但它没有被使用（至少用于特征检测）。现在，我喜欢 Modernizr，我经常将它用于需要它的项目的特征检测和后备；但是，我参与的最后三个项目一直处于头脑中，没有调用任何特征检测类。这些项目使用 vanilla javascript 和/或根本不需要 jQuery polyfills。 ¹ 话虽这么说......如果你不使用功能检测 并且真的不需要加载 jQuery 库 ²，Modernizr 真的除了发出额外的 HTTP 请求和要加载的资源之外还做其他事情吗？

我对 jQuery/javascript 的了解不够强大，无法理解它是否会影响其他任何东西。

---

编辑

¹ & ² — Modernizr 是 javascript 并且不需要 jQuery 库（这让我想知道为什么还要加载 jQuery 库，至少在这些例）。

Modernizr.min 只有 #-shiv-cssclasses-load 是 7.57 KB，而 html5shiv.min 只有 3 KB。

【问题讨论】：

它还有一个用于 IE 的 HTML5Shim

它可能会影响全局变量，但我内部不了解 Modernizr，我猜他们没有设置任何东西，但必须有其他人来。 ;)

Modernizr 和 jQuery 有什么关系？我认为在任何方向上都绝对没有关系。

好吧，根据@Royinamir 所说，他们确实设置了它们...

@hgoebl 我不确定 Modernizr 是否需要 jQuery 库（就像我说的，不是任何标准的 js 开发人员）。

【参考方案1】：

一般来说，Modernizr 做了三件事。

它添加了指示功能支持的类，允许您根据元素支持的功能对元素应用不同的样式。 它允许您运行特征检测来决定是否运行脚本/运行 polyfill。 它注入了 html5shiv，它允许旧浏览器理解 HTML5 元素。

如果您不使用这些功能中的任何一个，那么包含 Modernizr 就毫无意义。如果您只将它用于html5shiv，那么您可能只需要包含它来节省一些字节，尽管我怀疑是否存在相关的大小差异。

也就是说，您永远不应该在您不使用的modernizr 构建中包含功能检测。这不过是一种浪费。

【参考方案2】：

Modernizr 还包括 shims，让您不必自己定义它们或包含其他库。

Modernizr 的主要目标是通过类使用检测。所以你可以这样做：

例如，您希望根据客户端是否支持 Flash 来更改行为：

.flash #flashdiv

  display:block;
   

.no-flash #flashdiv

  display:none;

它确实可以帮助您动态处理不同客户端浏览器的功能。

此外，您可以使用 Modernizr 来检测 HTML5 功能并提供回退（polyfills）。

例如：

<script>
  if (Modernizr.canvas) 
    alert("This browser supports HTML5 canvas!"); //you can load js here. or use yepnope)
  
</script>

【讨论】：

刚刚出现此功能，已添加到 Modernizr 中：***.com/a/5326159/2672018SSE-Polyfill。