Vanilla JS团队维护每个字节的代码框架,每天努力工作,以确保它是小的和直观的。使用Vanilla JS是谁?很高兴你发问!他被应用于:
Facebook; Google; YouTube; Yahoo; Wikipedia; Windows Live; Twitter; Amazon; LinkedIn; MSN; eBay; Microsoft; Tumblr; Apple; Pinterest; PayPal; Reddit; Netflix; Stack Overflow
In fact, Vanilla JS is already used on more websites than jQuery, Prototype JS, MooTools, YUI, and Google Web Toolkit - combined.
事实上,Vanilla JS的使用量已经远远超过了jQuery, Prototype JS, MooTools, YUI 和 Google Web Toolkit 的总和。
VanillaJS包括如下模块,下载安装时可以只选择需要的模块,以便提高性能。
核心功能; DOM(遍历/选择器); 基于原型的对象系统; AJAX; 动画; 事件系统; 正则表达式; 函数作为第一类对象; 闭包; 数学库; 数组库; 字符串库
Vanilla JS是世界上最轻量的javascript 框架,浏览器向站点发送请求前就已经把Vanilla JS加载在浏览器里了。
使用Vanilla JS只需在应用的HTML里加入这行:
<script src="path/to/vanilla.js"></script>
当你部署你的应用的时候,使用这个更快的方法:
没错!没有任何代码,Vanilla JS 太流行了,所有的浏览器在十年前就已经内置了它。
框架 | 代码 | 次数/秒 |
---|---|---|
Vanilla JS | document.getElementById('test-table'); | 12,137,211 |
Dojo | dojo.byId('test-table'); | 5,443,343 |
Prototype JS | $('test-table') | 2,940,734 |
Ext JS | delete Ext.elCache['test-table']; Ext.get('test-table'); | 997,562 |
jQuery | $jq('#test-table'); | 350,557 |
YUI | YAHOO.util.Dom.get('test-table'); | 326,534 |
MooTools | document.id('test-table'); | 78,802 |
框架 | 代码 | 次数/秒 |
---|---|---|
Vanilla JS | document.getElementsByTagName("span"); | 8,280,893 |
Prototype JS | Prototype.Selector.select('span', document); | 62,872 |
YUI | YAHOO.util.Dom.getElementsBy(function(){return true;},'span'); | 48,545 |
Ext JS | Ext.query('span'); | 46,915 |
jQuery | $jq('span'); | 19,449 |
Dojo | dojo.query('span'); | 10,335 |
MooTools | Slick.search(document, 'span', new Elements); | 5,457 |
Vanilla JS
var s = document.getElementById('thing').style;s.opacity = 1;(function fade(){(s.opacity-=.1)<0?s.display="none":setTimeout(fade,40)})();
jQuery
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script><script>$('#thing').fadeOut();</script>
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
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script><script>$.ajax({ type: 'POST', url: "path/to/api", data: "banana=yellow", success: function (data) { alert("Success: " + data); },});</script>
vanilla-js官网:http://vanilla-js.com/