Zepto的更好的条件负载测试

时间:2012-07-12 16:12:53

标签: jquery mobile zepto

使用Zepto为jQuery支持不支持的浏览器是一种很好的方法,可以为移动设备减少几个Kbs的JS大小。但是,当前的“推荐”条件负载测试:

<script>document.write('<script src=' + ('__proto__' in {} ? 'zepto' : 'jquery') + '.js <\/script>')</script>

是决定是否加载Zepto或jQuery的一种非常不可靠的方法。许多不受支持的浏览器(包括较旧的移动浏览器)将通过此测试,但在运行Zepto时遇到问题。

是否有更可靠的方法(最好使用功能检测而不是设备/浏览器嗅探)才能准确覆盖更大比例的浏览器?假阴性(即加载jQuery而不是Zepto,即使Zepto实际上有效)肯定比误报更好。

1 个答案:

答案 0 :(得分:0)

这是一个棘手的问题。如果我们知道Zepto使用的每个特殊功能,白名单才会起作用。您可以为Array.prototype.forEachdocument.getElementsByClassNamewindow.JSON等添加嗅探器,但是您必须在代码中搜索您怀疑会导致缺陷或您看到原因的任何内容缺陷。一些不受支持的浏览器,如Opera Mobile可能会通过,但这些浏览器实际上可能会工作,即使它们不在官方支持的列表中。

最可靠的方法是尝试加载Zepto,然后检查window.Zepto是否存在,看看$('#test')之类的内容是否有效。如果没有,加载jQuery。当然,这将是疯狂的。

但是,我向你提出一个问题。如果移动浏览器不支持Zepto,您可能正在查看较旧或不太强大的浏览器(IE9除外,这是一种特殊情况)。假设尝试加载像jQuery这样的大型复杂库会进一步降低用户体验会不合理?加载时间太糟糕了。如果您正在制作动画,重绘率将无法忍受。

更好的方法是在可能的情况下将您的设计基于渐进增强的原则。建立一个无需JavaScript的网站,然后使用Zepto进行调整(如果支持的话)。如果不可能,请考虑这些浏览器变得越来越不常见,实际上可能只占用户的一小部分。虽然我们坚持使用这些浏览器至少2年,但这比我们使用IE6要少得多。