JavaScript小知识
1.<script>标签的出现使整个页面因脚本解析、运行而出现等待;
2.合并脚本,每个 HTTP请求都会产生额外的性能负担,下载一 个 100KB 的文件比下载四个 25KB的文件要快; 3.js加载放在最后; 4.一个带有 defer属性的<script>标签可以放置在文档的任何位置。对应的 JavaScript 文件将在<script>被解析时启动下载, 但代码不会被执行,直到 DOM 加载完成(在 onload 事件句柄被调用之前)。当一个 defer的 JavaScript文件被下载时,它不 会阻塞浏览器的其他处理过程,所以这些文件可以与页面的其他资源一起并行下载。
<script type="text/javascript" src="file1.js" defer></script> 5. 直接量 仅仅代表自己,而不存储于特定位置。 JavaScript 的直接量包括:字符串,数字,布尔值,对象, 数组,函数,正则表达式,具有特殊意义的空值,以及未定义。
变量 开发人员使用 var关键字创建用于存储数据值。
数组项 具有数字索引,存储一个 JavaScript数组对象。
对象成员 具有字符串索引,存储一个 JavaScript 对象。 四种类型存取效率依次降低,最好尽可能使用局部变量。一个好的经验法则是:如果它们在函数中的使用多于一次, 用局部变量存储本地范围之外的变量值,
6.简单说来,两个独立的部分以功能接口连接就会带来性能损耗。一个很形象的比喻是把 DOM 看成一个岛屿,把 JavaScript(ECMAScript) 看成另一个岛屿,两者之间以一座收费桥连接。每次 ECMAScript 需要访问 DOM 时,你需要过桥,交一次“过桥费”。你操作 DOM 次数越多, 费用就越高。一般的建议是尽量减少过桥次数,努力停留在 ECMAScript 岛上。 7. 当浏览器下载完所有页面 HTML标记,JavaScript,CSS,图片之后,它解析文件并创建两个内部数据结构: 一棵 DOM 树 表示页面结构 一棵渲染树 表示 DOM 节点如何显示 8.重绘与重排: 当 DOM 改变影响到元素的几何属性(宽和高)- 重排 重排版完成时,浏览器在一个重绘进程中重新绘制屏幕上受影响的部分 – 重绘 9.重排何时发生: 添加或删除可见的 DOM 元素 元素位置改变 元素尺寸改变(因为边距,填充,边框宽度,宽度,高度等属性改变) 内容改变,例如,文本改变或图片被另一个不同尺寸的所替代 最初的页面渲染 浏览器窗口改变尺寸 10.重排版和重绘代价昂贵,所以,提高程序响应速度一个好策略是减少此类操作发生的机会。为减少发生次数,你应该将多个 DOM 和风格改变合并到一个批次中一次性执行。 改变样式 批量修改DOM 11.批量修改dom: 从文档流中摘除该元素 对其应用多重改变 将元素带回文档中 12.for-in 循环每次迭代都要付出更多开销,所以比其他类型循环慢一些。在同样的循环迭代操作中,for-in循环比其他类型的循环慢 7 倍之多。 因此推荐的做法如下:除非你需要对数目不详的对象属性进行操作,否则避免使用 for-in 循环。 13.事实证明,大多数情况下 switch 表达式比 if-else 更快,但只有当条件体数量很大时才明显更快。两者间的主要性能区别在于:当条件体增加时, if-else性能负担增加的程度比 switch 更多。因此,我们的自然倾向认为条件体较少时应使用if-else而条件体较多时应使用switch表达式, 如果从性 能方面考虑也是正确的
JavaScript小知识的更多相关文章
- JavaScript 小知识
1.var 变量 <script type="text/javascript"> var a = "hong"; var fun = functio ...
- javascript小知识1 this的用法
函数的应用: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...
- Javascript基础知识总结一
Javascript基础知识总结一 <!DOCTYPE html> <html> <head lang="en"> <meta chars ...
- 学习javascript基础知识系列第三节 - ()()用法
总目录:通过一段代码学习javascript基础知识系列 注意: 为了便于执行和演示,建议使用chrome浏览器,按F12,然后按Esc(或手动选择)打开console,在console进行执行和演示 ...
- s性能优化方面的小知识
总结的js性能优化方面的小知识 前言 一直在学习javascript,也有看过<犀利开发Jquery内核详解与实践>,对这本书的评价只有两个字犀利,可能是对javascript理解的还不够 ...
- javascript常用知识点集
javascript常用知识点集 目录结构 一.jquery源码中常见知识点 二.javascript中原型链常见的知识点 三.常用的方法集知识点 一.jquery源码中常见的知识点 1.string ...
- 七个开法者经常忽略或误用的JavaScript基本知识
七个开法者经常忽略或误用的JavaScript基本知识 翻译自 http://tech.pro/tutorial/1453/7-javascript-basics-many-developers-ar ...
- JS的基本类型(小知识)
一:js中的基本类型: 基本类型:boolen, string ,number,null,undefined 引用类型:object,和函数 二.undedifned和null的区别: 1 undef ...
- JS控制语句 编程练习 学生数据,分别是姓名、性别、年龄和年级,接下来呢,我们要利用JavaScript的知识挑出其中所有是大一的女生的的名字哦。
编程练习 在一个大学的编程选修课班里,我们得到了一组参加该班级的学生数据,分别是姓名.性别.年龄和年级,接下来呢,我们要利用JavaScript的知识挑出其中所有是大一的女生的的名字哦. 学生信息如下 ...
随机推荐
- JS 深度拷贝 Object Array
JS 深度拷贝 Object Array function cloneObj(o) { var isArray = o instanceof Array; var isObject = o insta ...
- Javascript中变量提升的问题
一.函数声明变量提升 函数声明具有变量提升的问题,所以在函数被声明之前就可以访问. //else中的语句相当于将if中的function重写,因此无论flag为何值,返回的方法始终为重写后的方法. / ...
- VirtualBox后台运行虚拟机(无图形界面启动虚拟机)
有时候可能会用虚拟机搭建集群,这是通常希望不现实图形界面,试了半天,似乎只有Virtual Box支持无图形界面运行虚拟机,方法如下: 在Virtual Box的安装目录中找到VBoxManage,M ...
- 公司系统的license授权
在我的电脑的myeclipse的whnaproject项目下.可直接编译生成license.xml中所需要的授权码. 引用了spring-license-0.02.jar. package com.w ...
- Activity生命周期(深入理解)
今天看到一篇大神总结Activity的文章,内容甚为详细,特此转载http://www.cnblogs.com/lwbqqyumidi/p/3769113.html Android官方文档和其他不少资 ...
- CodeSmith模板
重复性的工作交给代码生成器就好,这里分享几套模板, 1.从数据库抓取字段,生成Table元素,这个在web开发中很有用 <%-- Name: Author: Description: --%&g ...
- MVC+EasyUI 菜单导航的实现
一个简单的使用mvc+easyUi 动态菜单显示 直接上代码 前端 function initMenu() { $.get("/Admin/Home/GetNav", functi ...
- iOS UIButton单双击处理响应不同的方法
//显示目标 双击显示当前用户坐标位置 UIButton * btnShowDistination = [[UIButton alloc]initWithFrame:CGRectMake(, SCRE ...
- 使用百度地图API产生指定范围的随机点
直接上代码: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> ...
- OS X升级El Capitan后,git difftool无法打开diffmerge的解决方法
在git项目下执行git difftool,出现如下报错 /Library/Developer/CommandLineTools/usr/libexec/git-core/mergetools/dif ...