javascript 如果您不使用特征检测,真的需要 Modernizr 吗?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/21511694/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is Modernizr really needed if you're not using the feature detection?
提问by darcher
I keep jumping into projects where Modernizr is located in the head, but it isn't being used (at least for feature detection). Now, I love Modernizr, I use it frequently for feature detection and fallbacks on projects that require it; however, the last three projects I've come into it's been sitting in the head without any of the feature detection classes being called. These projects are using vanilla javascript and/or do not require jQuery polyfills at all.1That being said... if you're not using the feature detection and really don't need to load a jQuery library2, is Modernizr really doing anything aside from making an addition HTTP request and resource to load?
我一直在跳入 Modernizr 位于头部的项目,但它没有被使用(至少用于特征检测)。现在,我喜欢 Modernizr,我经常将它用于需要它的项目的特征检测和回退;然而,我参与的最后三个项目一直处于头脑中,没有调用任何特征检测类。这些项目使用 vanilla javascript和/或根本不需要 jQuery polyfills。1 话虽如此...如果您不使用功能检测并且真的不需要加载 jQuery 库2,除了发出额外的 HTTP 请求和要加载的资源之外,Modernizr 真的会做任何事情吗?
I'm not strong enough with jQuery/javascript to understand if it's affecting anything else under the hood.
我对 jQuery/javascript 不够强大,无法了解它是否会影响引擎盖下的其他任何东西。
Edit
编辑
1& 2— Modernizr is javascript and doesn't require the jQuery library (which makes me wonder why the jQuery library is being loaded also, at least in these cases).
1& 2— Modernizr 是 javascript 并且不需要 jQuery 库(这让我想知道为什么 jQuery 库也被加载,至少在这些情况下)。
Modernizr.minwith only #-shiv-cssclasses-load
is 7.57 KB whereas html5shiv.minis only 3 KB.
Modernizr.min只有#-shiv-cssclasses-load
7.57 KB 而html5shiv.min只有 3 KB。
回答by Nils Kaspersson
Generally speaking, Modernizr does three things.
一般来说,Modernizr 做了三件事。
- It adds classes indicating feature support, allowing you to apply different styling to elements depending on what features they support.
- It allows you to run feature detection to decide whether to run a script/run a polyfill or not.
- It injects html5shiv, which allows old browsers to understand HTML5 elements.
- 它添加了指示功能支持的类,允许您根据元素支持的功能对元素应用不同的样式。
- 它允许您运行功能检测来决定是否运行脚本/运行 polyfill。
- 它注入了 html5shiv,它允许旧浏览器理解 HTML5 元素。
If you don't use any of these features, then there's no point in including Modernizr at all. If you only use it for the html5shivthen you could probably just include that instead to save a few bytes, although I doubt there's a relevant size difference at all.
如果您不使用这些功能中的任何一个,那么包含 Modernizr 根本没有意义。如果您只将它用于html5shiv,那么您可能只包含它以节省几个字节,尽管我怀疑根本不存在相关的大小差异。
That said, you should never include feature detects in a modernizr build that you don't use. That's nothing but a waste.
也就是说,您永远不应该在不使用的 Modernizr 构建中包含功能检测。那不过是浪费而已。
回答by Royi Namir
Modernizr also include shims which save you from defining them yourself or including another library.
Modernizr 还包括 shims,使您无需自己定义它们或包含另一个库。
The main goal of Modernizr is to use detection via classes. so you can do something like this:
Modernizr 的主要目标是通过类使用检测。所以你可以做这样的事情:
Example, where you want to change behaviour depending on whether the client support flash:
例如,您希望根据客户端是否支持闪存来更改行为:
.flash #flashdiv
{
display:block;
}
.no-flash #flashdiv
{
display:none;
}
It really helps you to dynamically deal with the abilities different client browsers.
它确实可以帮助您动态处理不同客户端浏览器的功能。
Also, you can use Modernizr to detect HTML5 features and provide fallbacks (polyfills).
此外,您可以使用 Modernizr 来检测 HTML5 功能并提供回退(polyfills)。
Eg:
例如:
<script>
if (Modernizr.canvas) {
alert("This browser supports HTML5 canvas!"); //you can load js here. or use yepnope)
}
</script>