1 尽量少使用全局查找,比如全局变量,如果要多次使用,可以将全局变量存为局部变量再使用
eg:function(){
var body=document.body;
alert(body):
body.innerHTML="hello world"
}
2.优化循环 (1)减值循环 i--(2)do-while比for循环快 (3)简化循环条件 比如循环条件少计算
 
3 Dom层-最小化现场操作,
就是比如新增很多dom 可以先for循环创建个整体的dom碎片 然后再一次性添加进去 会比一个个dom添加要快
var list=document.getElementById("mylist");
var frament=document.createDocumentFragment();
for (var i=0;i<10;i++){
var item=document.creatElement('li')
frament.appendChild(item)
}
list.appendChild(frament)
4 Dom层 --少使用HTMLCollection
比如循环中获取dom的length
var images=document.getElementsByTagName('img')
for(i=0,len=images.length;i<len;i++){
 
}
这样就不用总访问images的HTMLCollention
会访问HTMLCollention 的一些情况
(1)进行了getElementsByTagName()调用
(2)获取了元素的childNodes属性
(3)获取了元素的 attributes属性
(4)访问了特殊的集合 如documet.forms ,document.images

前端js性能优化的要点的更多相关文章

  1. js性能优化文章集锦

    总结的js性能优化方面的小知识http://www.it165.net/pro/html/201503/35336.html 如何优化你的JS代码http://www.php100.com/html/ ...

  2. 现代WEB前端的性能优化

    现代WEB前端的性能优化 前言:这只是一份学习笔记. 什么是WEB前端 潜在的优化点: DNS是否可以通过缓存减少DNS查询时间? 网络请求的过程走最近的网络环境? 相同的静态资源是否可以缓存? 能否 ...

  3. js性能优化-事件委托

    js性能优化-事件委托 考虑一个列表,在li的数量非常少的时候,为每一个li添加事件侦听当然不会存在太多性能方面的问题,但是当列表非常的长,长到上百上千甚至上万的时候(当然只是一个解释,实际工作中很少 ...

  4. js 性能优化利器:prepack

    1. js 性能优化 js 本身是没有像 python 一样的预编译功能,更没有像 java 一样的编译功能,所以,这里所说的 js 代码预编译 只是通过工具实现的类似功能而已. 这就要提到 prep ...

  5. js 性能优化 篇一

    JS性能优化 摘自:http://www.china125.com/design/js/3631.htm  首先,由于JS是一种解释型语言,执行速度要比编译型语言慢得多.(注:,Chrome是第一款内 ...

  6. web前端页面性能优化

    影响用户访问的最大部分是前端的页面.网站的划分一般为二:前端和后台.我们可以理解成后台是用来实现网站的功能的,比如:实现用户注册,用户能够为文章发表评论等等.而前端呢?其实应该是属于功能的表现. 而我 ...

  7. web前端之性能优化

    作为一个前端工作人员,而且只会写点HTML5和CSS3的“假”前端工程师,为了能更好地理解一下前端的花花世界,最近拜读了<高性能网站建设指南>一书,对作者提出的前端性能优化的14个规则获益 ...

  8. web前端页面性能优化小结

    影响用户访问的最大部分是前端的页面.网站的划分一般为二:前端和后台.我们可以理解成后台是用来实现网站的功能的,比如:实现用户注册,用户能够为文章发表评论等等.而前端呢?其实应该是属于功能的表现. 而我 ...

  9. (O)WEB:前端网站性能优化(原创)

    *从理论.实战编码.实战调试3个方面学习前端性能优化(包括页面加载时间和页面流畅度): -------------------------------理论----------------------- ...

随机推荐

  1. 24 margin的用法

    margin塌陷问题 当时说到了盒模型,盒模型包含着margin,为什么要在这里说margin呢?因为元素和元素在垂直方向上margin里面有坑. 我们来看一个例子: html结构: <div ...

  2. Hadoop编程踩坑

    Hadoop踩坑 在hadoop所有组件编程中,遇到在Windows下运行程序出现 java.io.IOException: Could not locate executable null\bin\ ...

  3. Spring boot中Spring-Data-JPA操作MySQL数据库时遇到的错误(一)

    执行遇到如下错误: 看错误时要注意两点: 1.控制台报错情况,一般情况下红色第一行很重要,举例:上图info之下,蓝底标出的部分. 2.这种一般是以堆栈形式描述的,也就是重点在栈底的最后的一个完整的句 ...

  4. 【ubuntu】软件安装与apt-get下载软件的存放位置

    系统:Ubuntu16.04 常用的软件安装方式有两种: 第一种:apt-get(安装后略类似于windows中的安装版软件): 例:apt-get install ssh 1.下载的软件存放位置 / ...

  5. 基于cxf开发的WebService

    Node.jshttps://www.cnblogs.com/goldlong/p/8027997.htmlQQ音乐apihttps://juejin.im/post/5a35228e51882506 ...

  6. sort和sorted深入理解----引子:多维列表,如何实现第一个元素升序,第二个元素降序

    一.列表内建方法--sort() 作用:就地对列表排序(直接在原列表上做排序) 语法: list.sort(func=None, key=None, reverse=False) 当reverse=F ...

  7. 关于java中构造方法、实例初始化、静态初始化执行顺序

    在Java笔试中,构造方法.实例初始化.静态初始化执行顺序,是一个经常被考察的知识点. 像下面的这道题(刚刚刷题做到,虽然做对了,但是还是想整理一下) 运行下面的代码,输出的结果是... class ...

  8. Oracle常用的一些 数据字典 转https://www.cnblogs.com/neozhu/archive/2008/07/22/1248422.html

    Oracle常用数据字典表   Oracle常用数据字典表      查看当前用户的缺省表空间 SQL>select username,default_tablespace from user_ ...

  9. leadcode的Hot100系列--78. 子集--回溯

    上一篇说了使用位运算来进行子集输出,这里使用回溯的方法来进行排序. 回溯的思想,我的理解就是: 把解的所有情况转换为树或者图,然后用深度优先的原则来对所有的情况进行遍历解析. 当然,因为问题中会包涵这 ...

  10. 在Ubuntu16.04 TLS 安装LAMP

    准备在虚拟机上搭建一个靶机系统(DoraBox),但是还不想使用一键搭建所以起了心思准备使用LAMP框架搭载这个靶机系统,于是有了以下文章,先从百度搜索一下,Ubuntu搭建LAMP. 然后点进去第一 ...