前端js优化方案(二)持续更新
由于上篇篇幅过长,导致编辑出了问题,另开一篇文章继续:
(4)减少迭代次数,最广为人知的一种限制循环迭代次数的模式被称为“达夫设备(Duff`s Device)”
Duff`s Device的理念是:每次循环最多可以调用8次process()。循环的迭代次数为总数除以8,由于不是所有数字都能被8整除,变量startAt用来存放余数,表示第一次循环应该循环多少次。假设总次数为12,则余数为4,代表第一次循环会调用4次process(),第二次循环startAt至为0,循环8次,这样就用两次循环代替了12次循环。(感觉这个方法还是很好的,以后工作中必然用的到)
第二个版本经过了优化,用while取代了switch,将余数与主循环分开:
这种方式用两次循环代替了之前的一次徐循环,但是它移除了循环主体中的switch语句,速度比原始循环还快。
不过使用这种方式目的是提高性能,要是循环次数本身就比较少,使用这种方式的效果并不明显,以1000次循环为一个分界点,如果超过1000次循环,那么这样的执行效率就会明显提升。
(5)forEach():此方法便利一个数组的所有成员,并在每个成员上执行一个函数。要运行的函数作为参数传给forEach(),并在调用时接收三个参数,分别是:当前的数组项的值、索引以及数组本身。
Items.forEach(function(value,index,arry){ process(value);})
总结:在所有情况下,基于循环的迭代比基于函数的迭代法快8倍;
(二)条件
1、If-else对比switch
大多数情况下switch比if-else运行要快;
2、if-else优化
(1)if-else中的条件语句应该总是按照从最大概率到最小概率的顺序排列,以确保运行速度最快。
(2)如果一个条件语句需要判断10次以上,为了最小化条件判断的次数,代码可以重写为一系列嵌套的if-else语句;这个适用于多个值域需要测试,单如果是离散值的话,用switch语句更合适;
(三)查找表
当使用查找表示,必须完全抛弃条件判断语句。这个过程变成数组项查询或对象成员查询。当单个键和单个值之间存在逻辑映射时,查找表的优势就能体现出来,switch语句更适合与每个键都需要对应一个独特的动作或一系动作的场合。
(四)递归
使用递归可以把复杂的算法变得简单。但是潜在问题是终止条件不明确或缺少终止条件会导致函数长时间运行,并使得用户界面处于假死状态;
(五)、迭代算法
任何递归能实现的算法同样可以用迭代来实现。迭代算法通常包含几个不同的循环,分别对应计算过程的不同方面,虽然这样会引入他们自身的问题,但是运行一个循环比反复调用一个函数的开销要少很多
(六)、Memoization
Memoization他缓存前一个计算结果提供后续使用,避免重复工作。
重写递归阶乘函数,防止重复执行
今天就更新到这里,后续还会继续更新。。
前端js优化方案(二)持续更新的更多相关文章
- 前端js优化方案(连续更新)
最近在读<高性能javascript>,在这里记录一下读后的一些感受,顺便加上自己的一些理解,如果有兴趣的话可以关注的我的博客http://www.bloggeng.com/,我会不定期发 ...
- 前端js优化方案(一)
最近在读<高性能javascript>,在这里记录一下读后的一些感受,顺便加上自己的一些理解,如果有兴趣的话可以关注的我的博客http://www.bloggeng.com/,我会不定期发 ...
- CSS3与页面布局学习笔记(八)——浏览器兼容性问题与前端性能优化方案
一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...
- 移动端WEBAPP开发遇到的坑,以及填坑方案!持续更新~~~~
前言:在移动端WEBAPP开发中会遇到各种各样的问题,通过此文对遇到的问题做一个归纳总结,方便自己日后查询,也给各位前端开发友人做一个参考. 此文中涉及的问题是本人开发中遇到的,解决方案是本人思考 ...
- Java Web 前端高性能优化(二)
一.上文回顾 上回我们主要从图片的合并.压缩等方面介绍前端性能优化问题(详见Java Web 前端高性能优化(一)) 本次我们主要从图像BASE64 编码.GZIP压缩.懒加载与预加载以及 OneAP ...
- 浅谈前端性能优化(二)——对HTTP传输进行压缩
1.前端性能优化的一点: 对js.css.图片等进行压缩,尽可能减小文件的大小,减少文件下载的时间,从而减少网页响应的时间. 2.前端性能优化的另一点: 对HTTP传输进行压缩,即在js,css.图片 ...
- MySQL优化方案二
摘自:http://www.thinkphp.cn/topic/3855.html 今天,数据库的操作越来越成为整个应用的性能瓶颈了,这点对于Web应用尤其明显.关于数据库的性能,这并不只是DBA才需 ...
- WEB前端性能优化之二——css优化
1.把样式表置于顶部 现把样式表放到文档的< head />内部似乎会加快页面的下载速度.这是因为把样式表放到< head />内会使页面有步骤的加载显示.HTML规范清 楚指 ...
- JS 字符串处理相关(持续更新)
一.JS判断字符串中是否包含某个字符串 indexOf() indexOf()方法可返回某个指定的字符串值在字符串中首次出现的位置.如果要检索的字符串值没有出现,则该方法返回 -1. var str ...
随机推荐
- BZOJ4571:[SCOI2016]美味
浅谈主席树:https://www.cnblogs.com/AKMer/p/9956734.html 题目传送门:https://www.lydsy.com/JudgeOnline/problem.p ...
- CF 1042A Benches——二分答案(水题)
题目:http://codeforces.com/problemset/problem/1042/A #include<iostream> #include<cstdio> # ...
- SpringMVC之四:渲染Web视图
理解视图解析 在前面的例子中,我们看到控制器返回的都是一个逻辑视图的名称,然后把这个逻辑视图名称交给view resolver,然后返回渲染后的 html 页面给 client. 将控制器中请求处理的 ...
- centos7 install pip
1. 安装过程 yum -y install epel-release yum install python-pip pip install --upgrade pip
- 如何增加新的PointT类型
博客转载自:http://www.pclcn.org/study/shownews.php?lang=cn&id=286 为了增加新的point类型,首先需要进行定义,例如: struct M ...
- PHP判断用户是手机端?还是浏览器端访问?
function isMobile(){ $useragent=isset($_SERVER['HTTP_USER_AGENT']) ? $_SERVER['HTTP_USER_AGENT'] : ' ...
- webbrowser 控件实现WinForm与WebForm交互
WebBrowser 控件可以让你装载Windows Form 应用程序中的 Web 网页和其它采用浏览器的文件.可以使用webbrowser 控件将现有的web框架控制项加入至 Windows Fo ...
- unity3d 自定义载入条/载入动画
在 Assets 下新建文件夹 WebGLTemplates , 在 WebGLTemplates 文件夹下新建文件夹 MyTemplate, 新建index. 在 PlayerSetting 中的 ...
- @functions @model @using
/////@functions自定义函数////// @helper辅助方法的确可以很方便的完成辅助方法开发,不过却失去了一些弹性,例如,无法在@helper中自定义属性,只能单纯的传入参数,然后格式 ...
- 【Java】NIO中Channel的注册源码分析
Channel的注册是在SelectableChannel中定义的: public abstract SelectionKey register(Selector sel, int ops, Obje ...