使用供应商特定的CSS3前缀进行性能和DOM加载

Pra*_*v 웃 3 html javascript css css3 vendor-prefix

我现在已经好奇了一会儿.

css3属性尚未标准化,但可以通过浏览器使用特定浏览器的前缀来实现.例如,可以使用border-radius,它可以在现代浏览器上正常工作.但是,对于以前版本的浏览器供应商,我们可以使用特定于供应商的属性,如-moz,-webkit等前缀来工作.

现在,对于我的页面,我使用了渐变和border-radius,制作了几个使用它们的类并将这些类应用于.

以下哪项更好?

  1. 使用javascript查找支持是否存在,如果支持属性,则使用属性,如果上面为false,请检查用户代理并相应地应用供应商特定属性.

  2. 使用类中的所有浏览器前缀,让浏览器使用适合它的任何一个.

我很好奇和关心的是DOM加载的性能和时间.

Mat*_*ens 6

以下哪项更好?

  1. 使用javascript查找支持是否存在,如果支持属性,则使用属性,如果上面为false,请检查用户代理并相应地应用供应商特定属性.

  2. 使用类中的所有浏览器前缀,让浏览器使用适合它的任何一个.

选项1包括使用JavaScript来检测支持,然后有条件地写出带有或不带前缀的CSS代码,并让浏览器应用样式.

选项2包括简单地使用CSS并依赖浏览器忽略它不理解的前缀/声明.

如您所见,选项1引入了一个额外的层(JavaScript),如果您只想在可能的情况下使用某些CSS3功能,则不需要.选项2将是最高性能的解决方案.