尽管jQuery等js框架相比原生javascript使用起来极为方便但是为什么在一些大型互联网公司还是一致强调前端开发人员的js基础,因为尽管javascript使用起来可能非常不便不仅体现在语法而且还要处理复杂的浏览器兼容,但是无论我们如何优化jQuery等框架编写的代码,它永远不可能比javascript引擎提供的原生方法性能更好,原因十分简单:Javascript的原生部分在你编写前端代码之前已经存在于浏览器中,都是用低级语言编写的,这意味着这些方法均被编译成机器码,作为浏览器的一部分,而不像其他的Javascript代码一样有所限制。同理jQuery引擎虽被称之为最快的css查询引擎,但是仍比原生的方法要慢。

  例如原生的querySelector()和querySelectorAll()完成他们的任务时,平均只需要基于jQuery的css查询10%左右的时间(不同版本的浏览器和jQuery版本可能有差异)。

document.querySelector("#firstItem");

客户端优化之使用javascript原生方法替代复杂的数学运算和jquery方法的更多相关文章

  1. JavaScript | 新手村(一)变量,运算和变量方法

    资料来自:JavaScript 第一步 1. 向 html 页面添加 JavaScript 1.1 内部 JavaScript 在 html 文件中的 </body> 标签前插入代码: & ...

  2. JavaScript原生对象属性和方法详解——Array对象

    http://www.feeldesignstudio.com/2013/09/native-javascript-object-properties-and-methods-array/ lengt ...

  3. javascript原生bind方法详解

    bind()方法,是javascript原生的函数类的一个原型方法(即Function.prototype里的方法),不支持ie低版本. 基本格式: function.bind(obj1,obj2,o ...

  4. javascript原生bind方法ie低版本兼容详解

    上一篇文章讲到了javascript原生的bind方法: http://www.cnblogs.com/liulangmao/p/3451669.html 这篇文章就在理解了原生bind方法的原理以后 ...

  5. javascript 原生得到document.Element的方法

    今天这里写这个博客的主要目的是记录一下javascript原生的选择dom的集中方法. 1.document.getElementById.这个方法接收1个参数,就是DOM元素的id(区分大小写),这 ...

  6. JavaScript 原生提供两个 Base64 相关的方法

    JavaScript 原生提供两个 Base64 相关的方法. btoa():任意值转为 Base64 编码 atob():Base64 编码转为原来的值 var string = 'Hello Wo ...

  7. javascript原生方法集锦

    1.sort方法sort()方法使数组中的元素按照一定的顺序排列. 语法: arrayObject.sort(方法函数) 参数说明: 1.如果不指定<方法函数>,则按unicode码顺序排 ...

  8. 解决原生javascript 缺少insertAfter的功能,非Jquery方法

    在现有的方法后插入一个新元素,你可能会想:既然有insertBefore方法,是不是也有一个相应的insertAfter()方法.很可惜,DOM没有提供方法.下面编写insertAfter函数,虽然D ...

  9. jQuery? 回归JavaScript原生API

    如今技术日新月异,各类框架库也是层次不穷.即便当年漫山红遍的JQuery(让开发者write less, do more,So Perfect!!)如今也有被替代的大势.但JS原生API写法依旧:并且 ...

随机推荐

  1. 141. Linked List Cycle&142. Linked List Cycle II(剑指Offer-链表中环的入口节点)

    题目: 141.Given a linked list, determine if it has a cycle in it. 142.Given a linked list, return the ...

  2. AutoMatic merge failed;fix conflicts and then commit the result.解决方法

    意思是: 冲突内容:合并冲突在 XXXX.DS_Store文件中 自动合并失败:修改冲突然后提交修改后的结果. <<<<<<<< HEAD 你写的代码 ...

  3. Wannafly挑战赛23B游戏

    https://www.nowcoder.com/acm/contest/161/B 题意:两个人van游戏,n堆石子,每次只能取这堆石子数目的因子个数,没得取的人输,问第一个人的必胜策略有多少种 题 ...

  4. Educational Codeforces Round 55 (Rated for Div. 2) A/B/C/D

    http://codeforces.com/contest/1082/problem/A WA数发,因为默认为x<y = = 分情况讨论,直达 or x->1->y  or  x-& ...

  5. (待解决,效率低下)47. Permutations II C++回溯法

    思路是在相似题Permutations的基础上,将结果放到set中,利用set容器不会出现重复元素的特性,得到所需结果 但是利用代码中的/* */部分通过迭代器遍历set将set中的元素放在一个新的v ...

  6. myeclipse debug模式 报错source not found

    myeclipse debug模式下,启动报错 source not found:SignatureParser.current() line: 解决方法:将debug视图下的右上方的jar有断点的地 ...

  7. NIO高性能框架-Netty

    一:Netty是什么 ? Netty是目前最流行的由JBOSS提供的一个Java开源框架NIO框架,Netty提供异步的.事件驱动的网络应用程序框架和工具,用以快速开发高性能.高可靠性的网络服务器和客 ...

  8. openfiler简介

    Openfiler 1.        简介 Openfiler可以将一个工业标准的X86_64的架构系统转换为一个完全成熟的NAS/SAN存储设备或IP存储路由,并为存储管理者提供一个解决正快速成长 ...

  9. hibernate配置log

    hibernate依赖jboss-logging,通过它选择对应的对应的日志包,选择的逻辑课查看具体代码org.jboss.logging.LoggerProviders. 先通过系统变量(org.j ...

  10. elasticsearch在CentOS环境下开机启动

    验证环境,OS版本:CentOS-7-x86_64-Minimal-1708:ES版本:elasticsearch-6.2.2. 1.创建文件elasticsearch #!/bin/bash # # ...