读高性能JavaScript编程 第一章
草草的看完第一章,虽然看的是译文也是感觉涨姿势了,
我来总结一下:
由于 大多数浏览器都是 single process 处理 ui updatas and js execute
于是产生问题: js (script tag) will blocking page processing
上图说话:

于是大家动脑筋想办法
想到了三个办法
1、 Parallel downloads, then execute 并行下载,然后执行。
2、Download times less,Less download file 少次少量 (精缩)
3、动态添加脚本,注入脚本(使用xmlhttprequest)。
其他:
defer eg:<script type="text/javascript" src="file1.js" defer></script>
对应的 JavaScript 文件将在<script>被解析
时启动下载,但代码不会被执行,直到 DOM 加载完成(在 onload 事件句柄被调用之前)
把js引用放在 </body>上面(很多人知道但不懂为什么)
原因:在 head 里 你会看到 阻塞全在白页上了
在下面阻塞的时候好歹页面上有点东西了 哈哈好简单~ 将脚本放在底部是定律
最后
果然最爽的还是把别人造好的轮子拿来用:
1、 YUI3 2、The LazyLoad library 3、The LABjs library 第二和第三个看着很爽的样子 第三个比较推荐。
而且可以体验一把链式结构的爽快写法。
eg:
<script type="text/javascript" src="lab.js"></script>
<script type="text/javascript">
$LAB.script("first-file.js").wait() //这个wait 是保证 js被执行(注意:不是被完全下载,下载是并行的)的先后顺序
.script("the-rest.js")
.wait(function(){
Application.init();
});
</script>
读高性能JavaScript编程 第一章的更多相关文章
- 读高性能JavaScript编程 第二章 让我知道了代码为什么要这样写
代码为什么要这样写? function initUI(){ var doc = document, bd = doc.body, links = doc.getElementsByTagName_r( ...
- 读高性能JavaScript编程学英语 第一章第三页第一段话
When the browser encounters a <script> tag, as in this HTML page, there is no way of knowing w ...
- 读高性能JavaScript编程 第四章 Conditionals
if else 和 switch && 递归 if else 和 switch 一般来说,if-else 适用于判断两个离散的值或者判断几个不同的值域.如果判断多于两个离散 ...
- 读高性能JavaScript编程 第四章 Duff's Device
又要开始罗里吧嗦的 第四章 Summary 了. 这一次我尽量精简语言. 如果你认为 重复调用一个方法数次有点辣眼睛的话 比如: function test(i){ process(i++); pr ...
- 读高性能JavaScript编程 第三章
第三章 DOM Scripting 最小化 DOM 访问,在 JavaScript 端做尽可能多的事情. 在反复访问的地方使用局部变量存放 DOM 引用. 小心地处理 HTML 集合,因为他们表现 ...
- 你不知道的javaScript上卷(第一章 作用域是什么)
在写这篇博客时这本书我已经是看过一遍了,为了加深印象和深入学习于是打算做这系列的前端经典书籍导读博文,大家如果觉得这本书讲的好可以自己买来看看,我是比较喜欢看纸质版书的,因为这样才有读书的那种感觉. ...
- Windows核心编程第一章.错误处理
Windows核心编程第一章,错误处理. 一丶错误处理 1.核心编程学习总结 不管是做逆向,开始做开发.在Windows下.你都需要看一下核心编程这本书.这本书确实写得很好.所以自己在学习这本书的同时 ...
- 读《编写可维护的JavaScript》第一章总结
第一章 基本的格式化 1.4 ① 换行 当一行长度到达了单行最大的字符限制时,就需要手动将一行拆成俩行.通常我们会在运算符后换行,下一行会增加俩个层级的缩进. // 好的做法: 在运算符后换行,第二行 ...
- 高性能JavaScript 编程实践
前言 最近在翻<高性能JavaScript>这本书(2010年版 丁琛译),感觉可能是因为浏览器引擎的改进或是其他原因,书中有些原本能提高性能的代码在最新的浏览器中已经失效.但是有些章节的 ...
随机推荐
- 【跟着开涛学Shiro】(一)Shiro简介
声明:本部分内容均转自于张老师的博客,因为本人很喜欢他的博客,所以一直在学习,转载仅是记录和分享,若也有喜欢的人的话,可以去他的博客首页看:http://jinnianshilongnian.itey ...
- 跨站点请求伪造(CSRF)
一.前言 跨站点请求伪造(Cross-SiteRequest Forgeries, CSRF),是指攻击者通过设置好的陷阱,强制对已完成认证的用户进行非预期的个人信息或设定信息等某些状态更新,属于被动 ...
- laravel 标签
变量标签 {$名} 数组变量标签 {{$名[key]}} 变量调节器 在标签中直接使用php函数,写法和php中一样 条件标签 @if(条件) @endif @if(条件) @else @endif ...
- 23.读懂 ECMAScript 规格
读懂规格 读懂 ECMAScript 规格 概述 规格文件是计算机语言的官方标准,详细描述语法规则和实现方法. 一般来说,没有必要阅读规格,除非你要写编译器.因为规格写得非常抽象和精炼,又缺乏实例,不 ...
- [转]Magento刷新索引的几种方法
本文转自:https://blog.csdn.net/IT_Wallace/article/details/78513951 在数据表中经常会使用索引,下面简单介绍一下索引的利弊: 创建索引可以大大提 ...
- 临时表 on commit delete rows 与 on commit preserve rows 的区别
-- 事务级临时表:提交时删除数据 create global temporary table tmp_table1 ( x number ) on commit delete ...
- JavaSE Set集合
明确Set集合接口的特点. java.util.Set接口和java.util.List接口一样,同样继承自Collection接口,它与Collection接口中的方法基本一致,并没有对Collec ...
- Java使用递归的方法进行冒泡排序
对于递归来说,我只了解它的概念,没有具体使用过,近期也是尝试着用递归写了一下冒泡排序和大家分享,希望能帮助大家了解递归 递归是什么?通俗的讲:在方法内部调用自己 花了几分钟整出来的,下面是递归冒泡排序 ...
- Idea无法运行Maven项目
导入项目到tomcat的时候要选择Arifact 如果maven项目没有这个选项, <groupId>com.bihang</groupId> <artifactId&g ...
- POJ3468(KB7-C 线段树)
A Simple Problem with Integers Time Limit: 5000MS Memory Limit: 131072K Total Submissions: 108903 ...