async modernizr可以吗？

Question

Google PageSpeed测试告诉我使用async

例如改变

<script src="//cdnjs.cloudflare.com/ajax/libs/modernizr/2.6.2/modernizr.min.js"></script>

至

<script async src="//cdnjs.cloudflare.com/ajax/libs/modernizr/2.6.2/modernizr.min.js"></script>

现代化器还能正常工作吗？

Answer 1

Modernizr需要放在<head>中有两个原因：

html5shiv需要在那里为oldIE。
在使用带有现代化的类来进行特征条件样式时避免使用FOUC

如果这些都不重要，您可以使用async属性和/或将其放在底部。

看看在Modernizr发布的这个问题

Answer 2

Modernizr 不需要放在<head> 。

无论何时包含它，Modernizr都将最终正常工作。

如果你使modernizr脚本异步，或者在一些重要的页面加载事件之后包含它（ DOMContentLoaded ， window.onload ...）

应用特定的css规则（ feature ，文档head no-feature类） 将被延迟 。
window.Modernizr也会被延迟，连同它的对象属性（即Modernizr.propery ）

简而言之，

如果你使用Modernizr的async加载可能会发生在CSS坏事是不合适的样式（依赖于<html>类的那些）应用了一段时间
你的JS代码可能发生的坏事是，如果你使用Modernizr全局对象，你可能不会直接使用它，也可能不会被加载 - 你将不得不以某种方式等待它 。 所以，不再：

if(Modernizr.cssanimations){
    // your feature-dependant code
}

但反而：

if(typeof Modernizr !== "undefined"){
//uitilize Modernizr global object here
} else {
// implement waiting for this object, let's say write short onModernizrLoad() function...
}

async modernizr可以吗？

问题描述

2 个解决方案

解决方案1
4 已采纳 2016-06-15 21:17:29

解决方案2
1 2017-12-03 10:43:15

async modernizr可以吗？

问题描述

2 个解决方案

解决方案1 4 已采纳 2016-06-15 21:17:29

解决方案2 1 2017-12-03 10:43:15

解决方案1
4 已采纳 2016-06-15 21:17:29

解决方案2
1 2017-12-03 10:43:15