Vanilla JS 是一个快速、轻量级、跨平台的JavaScript框架。我们可以用它构建强大的JavaScript应用程序。
介绍
Vanilla JS小巧而符合直觉。
有哪些企业采用了Vanilla JS?很多,很多,下面只是其中最知名的一部分:
YouTube
Yahoo
Wikipedia
Windows Live
Twitter Amazon
MSN
eBay
Microsoft
Tumblr
Apple
PayPal
Netflix
Stack Overflow
实际上, 使用 Vanilla JS 的网站比使用jQuery、Prototype JS、MooTools、YUI 和 Google Web Toolkit 的网站加起来还要多.
模块化
VanillaJS包括如下模块,下载安装时可以只选择需要的模块,以便提高性能。
核心功能
DOM(遍历/选择器)
基于原型的对象系统
AJAX
动画
事件系统
正则表达式
函数作为第一类对象
闭包
数学库
数组库
字符串库
开始使用
Vanilla JS是世界上最轻量的javascript 框架(沒有之一),使用我们的产品部署策略,你的用户的浏览器向你的站点发送请求前就已经把Vanilla JS加载在浏览器里了。
使用Vanilla JS只需在应用的HTML里加入这行:
当你部署你的应用的时候,使用这个更快的方法:
你没看错!没有任何代码,Vanilla JS 太流行了,所有的浏览器在十年前就已经内置了它。
性能比较
看看Vanilla JS到底有多快:
根据ID获取DOM元素
框架代码次数/秒
Vanilla JS
document.getElementById('test-table');12,137,211
Dojodojo.byId('test-table');5,443,343
Prototype JS$('test-table')2,940,734
Ext JSdelete Ext.elCache['test-table'];
Ext.get('test-table');997,562jQuery$jq('#test-table');350,557
YUIYAHOO.util.Dom.get('test-table');326,534
MooToolsdocument.id('test-table');78,802
根据标签名获取DOM元素
框架代码次数/秒
Vanilla JS
document.getElementsByTagName("span");8,280,893
Prototype JSPrototype.Selector.select('span', document);62,872
YUIYAHOO.util.Dom.getElementsBy(function(){return true;},'span');48,545
Ext JSExt.query('span');46,915jQuery$jq('span');19,449
Dojodojo.query('span');10,335
MooToolsSlick.search(document, 'span', new Elements);5,457
代码示例
下面是一些常见任务的例子,可以看下Vanilla JS和jQuery的区别:
淡出元素
Vanilla JS
vars =document.getElementById('thing').style;s.opacity =1;
(functionfade(){(s.opacity-=.1)<0?s.display="none":setTimeout(fade,40)})();
jQuery
$('#thing').fadeOut();
AJAX请求
Vanilla JS
var r = new XMLHttpRequest();
r.open("POST","path/to/api", true);
r.onreadystatechange = function () {
if (r.readyState !=4|| r.status !=200) return;
alert("Success: "+ r.responseText);
};
r.send("banana=yellow");
jQuery
$.ajax({type:'POST',url:"path/to/api",data:"banana=yellow",success:function(data){
alert("Success: "+ data);
},});
致不敢相信的读者:请把“Vanilla JS 是世界上最轻量的JavaScript框架(没有之一)”这句话读三遍。如果还是不信的话,再把下面这句话读三遍:“无论过去、现在还是未来,Vanilla JS 都是世界上最轻量的JavaScript框架(没有之一)!”
网友评论