参考《高性能网站建设进阶指南》

不仅仅关注页面加载时间,也要关注下页面操作时的相应速度。页面操作是我们写程序中 实实在在需要的

1、使用局部变量

任何非局部变量,在函数中使用次数超过一次时,就应该将其变成局部变量。

var setName = function (){
if(!$("#name").val()){
$("#name").val("ddd");
}
}
//下面应该变成一个局部变量
var setName = function (){
var $name= $("#name");
if(!$name.val()){
$name.val("ddd");
}
}

全局变量对象始终是作用域中的,最后一个;所以对全局变量的解析是最耗时的。

2、数据存储的位置

4种地方可以存储:字面量值、变量、数组元素、对象属性

字面量值和局部变量中读取值的开销差异很小,可以忽略不计。主要差别是数组和对象中读取值。

在循环,将函数中使用超过一次的对象属性或者数组元素,存储为一个局部变量

var a = ["a","b","c"]
for(var i =0 ;i<a.length){
console.log( a[i]) }
//减少读取数据的长度
var a = ["a","b","c"]
var b =a.length;
for(var i =0 ;i<b){
console.log( a[i]) }

3、流控制

流程的控制是提升性能的重要一环。条件判断,尽可能尽快结束。当仅判断一两个条件时,if语句通常比switch更快。当有2个以上条件判断且条件比较简单时(不是进行范围判断),switch语句更快。

4、减少dom操作

如果必须dom操作,在没显示之前,可以先隐藏再dom操作

js总结(四):关于高性能的更多相关文章

  1. 前端总结·基础篇·JS(四)异步请求及跨域方案

    前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(三)补充 前端总结·基础篇·JS(一)原型.原型链.构造函数和字符串(String) 前 ...

  2. 玩转Node.js(四)-搭建简单的聊天室

    玩转Node.js(四)-搭建简单的聊天室 Nodejs好久没有跟进了,最近想用它搞一个聊天室,然后便偶遇了socket.io这个东东,说是可以用它来简单的实现实时双向的基于事件的通讯机制.我便看了一 ...

  3. js 第四章 cookie的操作

    js 第四章 cookie的操作 一.学习要点 掌握cookie的简单应用 二. js 第四章 cookie的操作 了解cookie 什么是cookie? cookie 是存储于访问者的计算机中的变量 ...

  4. bootstrap学习总结-js组件(四)

    这次我们来看下js组件的使用,本篇文章会有点长,希望大家可以耐心看,相信收获会有不少.不少园友加我好友,表示喜欢我写文字的风格,简单明了,这里,再次谢谢你们的支持.一方面,博主自身技术有限,写的东西都 ...

  5. JavaScript--我发现,原来你是这样的JS(四)(看看变量,作用域,垃圾回收机制是啥)

    一.介绍 这是红宝书(JavaScript高级程序设计 3版)的读书笔记第四篇,是红宝书第四章内容(主要是变量和作用域问题),当然其中还有我个人的理解.红宝书这本书可以说是难啃的,要看完不容易,挺厚的 ...

  6. JS正则四个反斜杠的含义

    我们首先来看如下代码,在浏览器中输出的是什么? // 在浏览器中输出的 console.log('\\'); // 输出 \ console.log('\\\\'); // 输出 \\ 一:js正则直 ...

  7. node.js(基础四)_express基础

    一.前言                                                           本次内容主要包括: 1.express的基本用法 2.express中的静 ...

  8. python自动化开发-[第二十四天]-高性能相关与初识scrapy

    今日内容概要 1.高性能相关 2.scrapy初识 上节回顾: 1. Http协议 Http协议:GET / http1.1/r/n...../r/r/r/na=1 TCP协议:sendall(&qu ...

  9. js第四天学习小结:

    (1)函数的四种形式小结: 无参无返回值 function tellstory(){     console.log("从前有座山");     console.log(" ...

  10. JS--我发现,原来你是这样的JS(四)(看看变量,作用域,垃圾回收机制是啥)

    一.介绍 这是红宝书(JavaScript高级程序设计 3版)的读书笔记第四篇,是红宝书第四章内容(主要是变量和作用域问题),当然其中还有我个人的理解.红宝书这本书可以说是难啃的,要看完不容易,挺厚的 ...

随机推荐

  1. Codeforces Round #544 (Div. 3) C. Balanced Team

    链接:https://codeforces.com/contest/1133/problem/C 题意: 给n个数, 在这n个数中选最多n个数,来组成一个队伍. 保证这n个数的最大最小差值不大于5. ...

  2. Marriage Ceremonies LightOJ - 1011

    Marriage Ceremonies LightOJ - 1011 常规状压dp.popcount(S)表示S集合中元素数量.ans[S]表示S中的女性与前popcount(S)个男性结婚的最大收益 ...

  3. linux的目录结构详细介绍

    linux的目录结构详细介绍 1. /目录(根目录) 2./ect/目录 特定主机系统范围内的配置文件. 3./usr/目录 默认软件都会存于该目录下.用于存储只读用户数据的第二层次:包含绝大多数的用 ...

  4. ImageView加载长图(适用不需要缩放的情况)

    此案例适用于加载网络长图且图片的宽和高已知的情况.由于ImageView加载图片有一个4096*4096的限制,所以对于巨长图的加载比较麻烦,需要我们自己去手动处理. 有两种解决方案:第一种就是比较l ...

  5. leetcode315 Count of Smaller Numbers After Self

    思路: bit + 离散化. 实现: #include <bits/stdc++.h> using namespace std; class Solution { public: int ...

  6. poj2139 Six Degrees of Cowvin Bacon

    思路: floyd 实现: #include <iostream> #include <cstdio> #include <cstring> #include &l ...

  7. chrome inspect出现白屏的解决方案

    点inspect后 弹出框,可是里面一片白色 PS:原效果不是这样,只是图找不到随便p的 原因可以看这个:http://www.cnblogs.com/slmk/p/7591126.html 大概意思 ...

  8. How `new’ operator works ?

    这是2013年写的一篇旧文,放在gegahost.net上面 http://raison.gegahost.net/?p=15 February 15, 2013 How `new’ operator ...

  9. 原生js的容易忽略的相似点(二)

    1.new Object 和字面量 {}测试; <script type="text/javascript"> //1.new出来对象 console.log(obj, ...

  10. (译)IOS block编程指南 1 介绍

    Introduction(介绍) Block objects are a C-level syntactic and runtime feature. They are similar to stan ...