变量......

1.一个变量只存一种类型的数据,
2.尽量减少对隐式转换的依赖,这样可增强程序的可读性,日后修改程序时不至于混乱,
3.使用匈牙利命名法,
4.使用局部变量时记得加 var 进行声明,不然会与全局变量冲突,

网站性能优化方面

1.在对当前DOM进行操作之前,尽可能多的做一些准备工作,保证N次创建,1次写入。

2.在对DOM操作之前,把要操作的元素,先从当前DOM结构中删除:

  • 通过removeChild()或者replaceChild()实现真正意义上的删除。
  • 设置该元素的display样式为“none”。

修改操作完成后,将上面这个过程反转过来,建议使用第2种方式。

3.CSS部分
另外一个经常引起回流操作的情况是通过style属性对元素的外观进行修改,如element.style.backgroundColor = "blue";
每次修改元素的style属性,都肯定会触发回流操作,要解决这个问题可以:

  • 使用更改className的方式替换style.xxx=xxx的方式。
  • 使用style.cssText = '';一次写入样式。
  • 避免设置过多的行内样式
  • 添加的结构外元素尽量设置它们的位置为fixed或absolute
  • 避免使用表格来布局
  • 避免在CSS中使用JavaScript expressions(IE only)

4.将获取的DOM数据缓存起来。这种方法,对获取那些会触发回流操作的属性(比如offsetWidth等)尤为重要。

5.当对HTMLCollection对象进行操作时,应该将访问的次数尽可能的降至最低,最简单的,你可以将length属性缓存在一个本地变量中,这样就能大幅度的提高循环的效率。

一、避免大字符串字面量对象操作,如 字符串.lenth,尽量转换为new String(字符串)后再进行操作
二、在做字符查找替换等操作时善用正则表达式快速掌握ECMAScript正则表达式。
三、减少语句,利用运算符优先级实现if else表达式,使用三元表达式,使用连续表达式(看情况,将损失程序可读性)
四、将CSS,JS文件合并到一个文件(非BT爱好者还是不要玩了^_^)
五、避免Javascript事件绑定出现内存泄漏"These memory leaks often occur as a result of circular references between JavaScript objects and objects within IE’s DOM (document object model)." Microsoft GPDE Team Blog
六、使用WEB Workers技术(支持html5的浏览器)Web Workers为JavaScript提供了一种能在后台进程中运行的方法,Web Workers进程能够在不影响用户界面的情况下处理任务。
七、Y!14条(14 Rules for Faster-Loading Web Sites)
* Rule 1 - Make Fewer HTTP Requests
* Rule 2 - Use a Content Delivery Network (Server端)
* Rule 3 - Add an Expires Header (Server端)
* Rule 4 - Gzip Components (Server端)
* Rule 5 - Put Stylesheets at the Top
* Rule 6 - Put Scripts at the Bottom
* Rule 7 - Avoid CSS Expressions
* Rule 8 - Make JavaScript and CSS External
* Rule 9 - Reduce DNS Lookups (Server端)
* Rule 10 - Minify JavaScript
* Rule 11 - Avoid Redirects (Server端)
* Rule 12 - Remove Duplicate Scripts
* Rule 13 - Configure ETags (Server端)
* Rule 14 - Make AJAX Cacheable
* Rule 15 - Use Iframes Wisely
八、微软早期的DHTML优化建议 * 使用数组push替代字符串累加

javascript的and运算符的操作

逻辑AND运算的运算数可以是任何类型的,不止是Boolean值,如果某个运算数不是原始的Boolean型值,逻辑AND运算并不一定返回Boolean值
1)如果一个运算数是对象,另一个是 Boolean 值,返回该对象。
2)如果两个运算数都是对象,返回第二个对象。
3)如果某个运算数是 null,返回 null。
4)如果某个运算数是 NaN,返回 NaN。
5)如果某个运算数是 undefined,发生错误。
6)如果两个运算数都是boolean类型,则返回boolean值

javascript小知识点......

1、==和===的区别:"==" 只要求值相等; "===" 要求值和类型都相等
2、isFinite() 函数用于检查其参数是否是无穷大,如果 number 是有限数字(或可转换为有限数字),那么返回 true。否则,如果 number 是 NaN(非数字),或者是正、负无穷大的数,则返回 false。
3、判断空值用 val === null 即可

4、|0和~~是很好的一个例子,使用这两者可以将浮点转成整型且效率方面要比同类的parseInt,Math.round 要快.顺便说句,
//!!将一个值方便快速转化为布尔值 !!window===true 。

var foo = (12.4 / 4.13) | 0;//结果为3

var bar = ~~(12.4 / 4.13);//结果为3

5、不声明第三个变量的值交换

var a = 1, b = 2; a = [b, b = a][0];

6、对于传统的if语句,如果执行体代码超过了1 条语句,则需要加花括号,而利用逗号表达式,可以执行任意条代码而不用加花括号。

if (conditoin) alert(1), alert(2), console.log(3);

7、&&的妙用

var day = (new Date).getDay() === 0;
//传统if语句
if (day) {
alert('Today is Sunday!');
};
//运用逻辑与代替if
day && alert('Today is Sunday!');

8、禁止别人以iframe加载你的页面

if (window.location != window.parent.location) window.parent.location = window.location;

对JavaScript优化及规范的一些感想的更多相关文章

  1. 前端性能优化(三)——传统 JavaScript 优化的误区

    注:本文是纯技术探讨文,无图无笑点,希望您喜欢 一.前言 软件行业极其缺乏前端人才这是圈内的共识了,某种程度上讲,同等水平前端的工资都要比后端高上不少,而圈内的另一项共识则是--网页是公司的脸面! 几 ...

  2. 前端网络、JavaScript优化以及开发小技巧

    一.网络优化 YSlow有23条规则,中文可以参考这里.这几十条规则最主要是在做消除或减少不必要的网络延迟,将需要传输的数据压缩至最少. 1)合并压缩CSS.JavaScript.图片,静态资源CDN ...

  3. javascript 变量 命名规范 变量的作用域

    原文:javascript 变量 命名规范 变量的作用域 大家好,我是小强老师,今天讲解的是变量 变量 小时候我们学过  这个 应用题 :  X+1=2; 问  X 等于几?  答案是 1 对了,很聪 ...

  4. Javascript 优化

    Javascript 优化 作者:@gzdaijie本文为作者原创,转载请注明出处:http://www.cnblogs.com/gzdaijie/p/5324489.html 目录 1.全局变量污染 ...

  5. JavaScript 中语法规范及调试

    JavaScript 中语法规范及调试 版权声明:未经博主授权,内容严禁分享转载 JavaScript 开发环境 JavaScript 脚本可以使用任意一款纯文本编辑器进行编程开发. 常见的前端开发编 ...

  6. JavaScript standard 代码规范的全文

    这是 JavaScript standard 代码规范的全文. 掌握本规范的最好方法是安装并在自己的代码中使用它. 细则 使用两个空格进行缩进. eslint: indent function hel ...

  7. javascript模块化编程规范

    一.javascript模块化编程规范: 二.关于commenjs规范和AMD规范: 根本不同:前者用于服务器端同步加载模块:后者是客户端异步加载模块. 同点:两者都有一个全局函数require(), ...

  8. 5.JavaScript优化及导航菜单背后的秘密

    JavaScript优化及导航菜单背后的秘密 伍星 学习目标1.进一步了解前端优化 学习如何编写良好的 JavaScirpt2.通过导航的学习,了解JavaScirpt的应用 JavaScript在用 ...

  9. 常用html、CSS、javascript前端命名规范

    无论是从技术角度还是开发视角,对于web前端开发规范文档都有一定规范,本文就css3和html5的发展前景总结了一系列的web开发文档,仅供大家参考. 规范目的: 为提高团队协作效率, 便于后台人员添 ...

随机推荐

  1. C#发展历程以及C#6.0新特性

    一.C#发展历程 下图是自己整理列出了C#每次重要更新的时间及增加的新特性,对于了解C#这些年的发展历程,对C#的认识更加全面,是有帮助的. 二.C#6.0新特性 1.字符串插值 (String In ...

  2. [已开源/文章教程]独立开发 一个社交 APP 的源码/架构分享 (已上架)

    0x00 背景 真不是和被推荐了2天的博客园一位大神较真,从他那篇文章的索引式文章内容也学习到了很多东西,看评论区那么多对社交APP源码有兴趣的,正巧我上周把我的一个社交APP开源了,包括androi ...

  3. EditPlus怎样自动换行

    如果只是使用快捷键Ctrl+Shift+W或者使用文档→自动换行,的话,关闭软件之后再次打开时就会重新出现不能自动换行的问题. 中文版的是:文档→固定值设置(文档 菜单的最后一个),会打开一个“工具→ ...

  4. [BZOJ1143][CTSC2008]祭祀river(最长反链)

    题目:http://www.lydsy.com:808/JudgeOnline/problem.php?id=1143 分析: 最长反链==最小路径覆盖==n-二分图最大匹配数 某神犇对二分图的总结: ...

  5. JavaScript学习笔记- 自定义滚动条插件

    此滚动条仅支持竖向(Y轴) 一.Css /*这里是让用户鼠标在里面不能选中文字,避免拖动的时候出错*/ body { -moz-user-select: none; /*火狐*/ -webkit-us ...

  6. 由Nullable模式想到的ToString的扩展

    虽然关于null的一切争论永不停息,但根据实际开发经历,很多时候需要判断无聊的null,并且有些的判断是可有可无的,尤其是在表现层. string e = null; if (e != null) { ...

  7. Android activity跳转方式

    方法一:通过SetContentView切换Layout来实现界面的切换,这种方法相当于重绘Activity. protected void onCreate(Bundle savedInstance ...

  8. 2016年GitHub 排名前 100 的安卓、iOS项目简介(收藏)

    排名完全是根据 GitHub 搜索 Java 语言选择 (Best Match) 得到的结果, 然后过滤了跟 Android 不相关的项目, 所以排名并不具备任何官方效力, 仅供参考学习, 方便初学者 ...

  9. 不停止MySQL服务的情况下修改root的密码

    首先我们得知道一个MySQL普通用户的密码 这里我来记录一下我的操作过程 这里我刚刚到一家公司上面装的是cacti,但是之前的运维不记得MySQL的root密码了 但是他知道cacti的密码, 用户: ...

  10. swift 学习(三)(面向对象基础)

    面向对象的基本特征包括:封装,继承,多态 在swift中,类,结构,枚举都具有面向对象特性 但结构和枚举的实例不称为对象,因为结构和枚举不是彻底的面向对象类型,比如他们不能继承. 结构体 struct ...