尽管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. Linux系统中文件定位与查找

    Linux系统中文件查找 关键词 文件查找 | find | locate 本文主要介绍有关文件查找的两个命令——find和locate,以及压缩打包的命令——compress, gzip,bzip2 ...

  2. 【MySQL】【4】数据库时间与实际时间相差8小时

    原因:由于默认的是UTC时间,所以在中国有8个小时的时差,需要将serverTimezone的值改为GMT%2B8 spring: datasource: url: jdbc:mysql://172. ...

  3. atoi函数原型

    一.atoi()函数的功能: 1.定义: 将字符串转换成整型数,跳过前面的空格字符,直到遇上数字或正负号才开始做转换,而再遇到非数字或字符串时('\0')结束转化,并将结果返回(返回转换后的整型数). ...

  4. docker 系列之 配置阿里云镜像加速器

    1.登录阿里云 2.登录后找到右上角的“管理中心”,点击进入后>点击“镜像加速器”;剩下的安装文档配置就好 问题1:配置完后还是提示:Tag latest not found in reposi ...

  5. npm常用功能

    1.   npm -v在命令行中输入该代码,可以查看npm当前版本号 2.安装依赖包2.1  npm install <name>先使用cd命令跳转到需要安装模块的目录,在该目录下执行np ...

  6. Git:非Fast forward下的合并(--no-ff方式的git merge)

    创建dev分支,并且修改readme.txt的内容,然后提交 使用git merge --no-ff -m "说明内容" 分支名称合并分支 使用git log --graph -- ...

  7. Linux Shell数值比较和字符串比较及相关

    说明: 1. 把字符串当成整型进行比较,由于abcd等字符对不上0123当程序尝试去转成二进制时无法完成转换,所以用于数值比较的运算不能用于字符串比较:但是把整型当成字符串进行比较,0123这些数值完 ...

  8. kiss prefix paleo,per,pen,pan,para out 1

      1● paleo 2● per 3● pen 4● pan 5● para   1★ paleo 古   2★ para ,辅助,在旁边   3★ pan 广泛的   4★ per 假,坏,自始自 ...

  9. @GeneratedValue 四种标准用法为TABLE,SEQUENCE,IDENTITY,AUTO.

    一.JPA通用策略生成器 通过annotation来映射hibernate实体的,基于annotation的hibernate主键标识为@Id, 其生成规则由@GeneratedValue设定的.这里 ...

  10. js之单例

    所谓单例,指的是只有一个实例的对象. js通过对象字面量的方式来创建单例对象. var sig = { name:value, method:function(){ } }