文档章节

常见的前端性能优化之变量优化

JSON_P
 JSON_P
发布于 2016/10/08 17:29
字数 870
阅读 24
收藏 1
* 全局变量
* 
	* - 当一个变量被定义在全局作用域中,默认情况下javascript引擎就不会将其回收销毁。如此该变量就会一直存在于老生代堆内存中,直到页面被关闭。
	* - 全局变量缺点。
	* 
		* - 使变量不易被回收。
		* - 多人协作时容易产生混淆。
		* - 在作用域链中容易被干扰。

	* - 可以通过包装函数来处理全局变量。

* 局部变量。
* 
	* - 尽量选用局部变量而不是全局变量。
	* - 局部变量的访问速度要比全局变量的访问速度更快,因为全局变量其实是window对象的成员,而局部变量是放在函数的栈里的。

* 手工解除变量引用
* 
	* 在业务代码中,一个变量已经确定不再需要了,那么就可以手工解除变量引用,以使其被回收。

var data = { /* some big data */ };// ... data = null;

* 变量查找优化。
* 
	* - 变量声明带上var,如果声明变量忘记了var,那么JAVASCRIPT引擎将会遍历整个作用域查找这个变量,结果不管找到与否,都会造成性能损耗。
	* 
		* - 如果在上级作用域找到了这个变量,上级作用域变量的内容将被无声的改写,导致莫名奇妙的错误发生。
		* - 如果在上级作用域没有找到该变量,这个变量将自动被声明为全局变量,然而却都找不到这个全局变量的定义。

	* - 慎用全局变量。
	* 
		* - 全局变量需要搜索更长的作用域链。
		* - 全局变量的生命周期比局部变量长,不利于内存释放。
		* - 过多的全局变量容易造成混淆,增大产生bug的可能性。


* 
* 
	* - 具有相同作用域变量通过一个var声明。

jQuery.extend = jQuery.fn.extend = function () { var options, name, src, copy, copyIsArray, clone,target = arguments[0] || {}, i = 1, length = arguments.length, deep = false ; }

	* - 缓存重复使用的全局变量。

	* 
		* - 全局变量要比局部变量需要搜索的作用域长

		* - 重复调用的方法也可以通过局部缓存来提速

		* - 该项优化在IE上体现比较明显
    var docElem = window.document.documentElement,
            selector_hasDuplicate,
            matches = docElem.webkitMatchesSelector || docElem.mozMatchesSelector || docElem.oMatchesSelector ||docElem.msMatchesSelector,
            selector_sortOrder = function ( a, b ) {
                    // Flag for duplicate removal
                    if ( a === b ) {
                         selector_hasDuplicate = true ;
                         return 0;
                    }
            }



* 善用回调。
* 
	* 除了使用闭包进行内部变量访问,我们还可以使用现在十分流行的回调函数来进行业务处理。

function getData(callback) { var data = 'some big data'; callback(null, data);} getData(function(err, data) { console.log(data);});

	* - 回调函数是一种后续传递风格(Continuation Passing Style, CPS)的技术,这种风格的程序编写将函数的业务重点从返回值转移到回调函数中去。而且其相比闭包的好处也有很多。

	* 
		* - 如果传入的参数是基础类型(如字符串、数值),回调函数中传入的形参就会是复制值,业务代码使用完毕以后,更容易被回收。
		* - 通过回调,我们除了可以完成同步的请求外,还可以用在异步编程中,这也就是现在非常流行的一种编写风格。
		* - 回调函数自身通常也是临时的匿名函数,一旦请求函数执行完毕,回调函数自身的引用就会被解除,自身也得到回收。

© 著作权归作者所有

JSON_P
粉丝 7
博文 18
码字总数 9688
作品 0
闵行
前端工程师
私信 提问
【前端词典】8 个提高 JavaScript 性能的方法

前言 在一些年以前性能问题,我们前端开发能做的还是很有限的;不过随着 JavaScript 应用越来越复杂,优化 JavaScript 性能的重要性就越发的凸显出来了。这里我分享 8 个提高 JavaScript 性能...

小生方勤
08/07
0
0
WEB前端性能优化基本套路

前言 前端性能优化这是一个老生常谈的话题,但是还是有很多人没有真正的重视起来,或者说还没有产生这种意识。 当用户打开页面,首屏加载速度越慢,流失用户的概率就越大,在体验产品的时候性...

32氪
2017/07/31
0
0
一年经验前端 杭州几家二线厂面试题梳理

交代下背景 在掘金群比较活跃的群友应该都认识我,我就是那个每天吹水的管理员,最近赶上秋招之际,毕业刚满一年,就打算试下杭州的几家厂,因为本身也是二线厂出身,所以投的也都是二线厂以...

行乐
07/26
0
0
游戏开发性能优化经验总结

优化概论 说起游戏的优化,在游戏开发中经常分为这几步: 首先要确定游戏中经常会出现哪些问题 – Profile 然后确定在哪些方向进行性能优化 – Analyze 最后再尽可能将问题逐个解决 – Solv...

拉偶有所依
2015/05/11
878
0
【性能优化指南】带你全面学习前端性能优化 🚀

✨仓库地址:fe-performance-journey ✨ 前端需要性能优化么? 性能优化一直以来都是前端工程领域中的一个重要部分。很多资料[1][2][3]表明,网站应用的性能优化对于提高用户留存、转化率等都...

AlienZHOU
08/15
0
0

没有更多内容

加载失败,请刷新页面

加载更多

OSChina 周一乱弹 —— 年迈渔夫遭黑帮袭抢

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @tom_tdhzz :#今日歌曲推荐# 分享Elvis Presley的单曲《White Christmas》: 《White Christmas》- Elvis Presley 手机党少年们想听歌,请使劲...

小小编辑
今天
1K
16
CentOS7.6中安装使用fcitx框架

内容目录 一、为什么要使用fcitx?二、安装fcitx框架三、安装搜狗输入法 一、为什么要使用fcitx? Gnome3桌面自带的输入法框架为ibus,而在使用ibus时会时不时出现卡顿无法输入的现象。 搜狗和...

技术训练营
昨天
5
0
《Designing.Data-Intensive.Applications》笔记 四

第九章 一致性与共识 分布式系统最重要的的抽象之一是共识(consensus):让所有的节点对某件事达成一致。 最终一致性(eventual consistency)只提供较弱的保证,需要探索更高的一致性保证(stro...

丰田破产标志
昨天
8
0
docker 使用mysql

1, 进入容器 比如 myslq1 里面进行操作 docker exec -it mysql1 /bin/bash 2. 退出 容器 交互: exit 3. mysql 启动在容器里面,并且 可以本地连接mysql docker run --name mysql1 --env MY...

之渊
昨天
12
0
python数据结构

1、字符串及其方法(案例来自Python-100-Days) def main(): str1 = 'hello, world!' # 通过len函数计算字符串的长度 print(len(str1)) # 13 # 获得字符串首字母大写的...

huijue
昨天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部