JavaScript性能优化:度量、监控与可视化1
HTTP事务所需要的步骤:

接下来,浏览器与远程Web服务器通过TCP三次握手协商来建立一个TCP/IP连接,类似对讲机的Over(完毕) Roger(明白)
TCP/IP模型
TCP即传输控制协议(Transmission Con-trol Protocol)
一旦TCP/IP连接建立,浏览器会通过该连接向远程服务器发送HTTP的GET请求
远程服务器找到资源并使用HTTP响应返回该资源,常用的有:
•200表示来自服务器的成功响应; •404意味着服务器没有找到请求的资源;•500表示执行请求时发生了错误。
IPv4和IPv6协议规定一个IP包的最大值为65535字节,将你的总页面大小转化为字节数,再除以最大IP包的字节值得到服务器的响应次数
页面中的每一项资源——每一个图片、外部JavaScript文件和CSS文件,都需要从服务器到本地走个来回。每项资源的请求都会开启一个新的线程和一个新流程(flow)实例,而每一个实例又会产生DNS查询、TCP连接、HTTP请求和响应
1.2 解析与渲染
浏览器解析和呈现Web页面架构(下图) 浏览器架构处理UI(用户界面)的代码(包括了地址栏和回退(history)按钮),用于解析和绘制页面中所有对象的渲染引擎,解释Javascript的JavaScript引擎,以及一个处理HTTP请求的网络层

浏览器是自上而下读取内容的,因此放置资源的位置会影响网站的访问速度,如果将JavaScript标签放在HTML内容的前边,浏览器就会先调用JavaScript解释器对JavaScript进行解析,完成之后才会渲染其余的HTML内容
1.2.1 渲染引擎
浏览器架构可以划分为多个模块,一直以来,浏览器制造商也是通过组合模块来构造浏览器的
Chrome和Safari使用Webkit渲染引擎http://www.webkit.org/
1.2.2 JavaScript引擎
JavaScript解释器也应用了模块化这一概念,也可以嵌入到其他工具中
Firefox的SpiderMonkey
Chrome的V8
1.3 运行时性能
所谓运行时(runtime)是指应用程序执行或运行的时长。运行时性能是指应用程序运行时对用户输入的响应速度(比如保存特性或访问DOM中的元素时)
第2章 测量和影响性能的工具与技术
2.1 Firebug
2.2 YSlow
若要更深入地分析网页性能,可以使用YS-low,可以移植到大多数浏览器上http://yslow.org/,Google曾经开发了Page Speed类似于YSlow的产品
2.3 WebPagetest
http://www.webpagetest.org/
WebPagetest是一款Web应用程序,它将一个URL以及一系列配置参数作为输入,并对那个URL运行性能测试。WebPagetest可配置参数的数量非常多,范围非常广
2.4 缩减
需要缩减JavaScript
2.4.1 Minify
http://code.google.com/p/minify/

Minify,读入JavaScript文件的URL。Minify剔除掉不必要的字符,并设置响应头(response header)为gzip编码格式,返回结果给script标签,并将结果加载到浏览器,要使用Minify,只需要从http://code.google.com/p/minify/网站上将它下载下来,将其解压缩至/min文件夹并放到Web网站根目录下,然后到/min/builder/目录下打开Minify控制面板。在控制面板中,可以添加你想要缩减的JavaScript文件,页面生成可链接到JavaScript文件缩减后的脚本标签
2.4.2 YUI Compressor
另一个用于缩减的工具是Yahoo的YUI Com-pressor,可以在这里找到它:http://yuili-brary.com/download/yuicompressor/
2.4.3 Closure Compiler https://developers.google.com/closure/com-piler/ 它不仅缩减了JavaScript,而且通过重写进一步压缩了JavaScript 优化策略——它将函数展开,重写变量名,删除从不会调用的函数(只要它能判断)
2.5 R入门
http://cran.r-project.org/ 使用R进行数据可视化准

以后再填这个坑
JavaScript性能优化:度量、监控与可视化1的更多相关文章
- JavaScript性能优化
如今主流浏览器都在比拼JavaScript引擎的执行速度,但最终都会达到一个理论极限,即无限接近编译后程序执行速度. 这种情况下决定程序速度的另一个重要因素就是代码本身. 在这里我们会分门别类的介绍J ...
- javascript性能优化-repaint和reflow
repaint(重绘) ,repaint发生更改时,元素的外观被改变,且在没有改变布局的情况下发生,如改变outline,visibility,background color,不会影响到dom结构渲 ...
- 摘:JavaScript性能优化小知识总结
原文地址:http://www.codeceo.com/article/javascript-performance-tips.html JavaScript的性能问题不容小觑,这就需要我们开发人员在 ...
- Javascript 性能优化的一点技巧
把优秀的编程方式当成一种习惯,融入到日常的编程当中.下图是今天想到的一点Javascript 性能优化的技巧,分享一下,抛砖引玉.
- JavaScript性能优化小窍门汇总(含实例)
在众多语言中,JavaScript已经占有重要的一席之地,利用JavaScript我们可以做很多事情 , 应用广泛.在web应用项目中,需要大量JavaScript的代码,将来也会越来越多.但是由于J ...
- JavaScript性能优化小知识总结(转)
JavaScript的性能问题不容小觑,这就需要我们开发人员在编写JavaScript程序时多注意一些细节,本文非常详细的介绍了一下JavaScript性能优化方面的知识点,绝对是干货. 前言 一直在 ...
- JavaScript性能优化篇js优化
JavaScript性能优化篇js优化 随着Ajax越来越普遍,Ajax引用的规模越来越大,Javascript代码的性能越来越显得重要,我想这就是一个很典型的例子,上面那段代码因为会被频繁使用, ...
- MySQL数据库性能优化与监控实战(阶段四)
MySQL数据库性能优化与监控实战(阶段四) 作者 刘畅 时间 2020-10-20 目录 1 sys数据库 1 2 系统变量 1 3 性能优化 1 3.1 硬件层 1 3.2 系统层 1 3.3 软 ...
- JavaScript 性能优化技巧分享
JavaScript 作为当前最为常见的直译式脚本语言,已经广泛应用于 Web 应用开发中.为了提高Web应用的性能,从 JavaScript 的性能优化方向入手,会是一个很好的选择. 本文从加载.上 ...
- javascript性能优化之避免重复工作
javascript最重要也最根本的性能优化标准之一是避免工作,避免工作又包括两点,第一,不做不必要的工作,第二,不做重复的已经完成的工作.第一部分可以通过代码重构完成,第二部分不做重复的工作有时候难 ...
随机推荐
- PHP初学留神(四)
这周去听了Google的演讲,从Idea到Code的商业宣传.不过因为是头一次听英文演讲,心里还是很舒服.这周主要做的是Bootstrap前端美化,这个框架也比较好玩.在php上面花的时间相对少了,也 ...
- Extension method for type
扩展其实真的很简单 msdn是这样规定扩展方法的:"扩展方法被定义为静态方法,但它们是通过实例方法语法进行调用的. 它们的第一个参数指定该方法作用于哪个类型,并且该参数以 this 修饰符为 ...
- find grep
grep grep -rn "hello,world!" * #递归查找当前目录下所有包含hello,world的文件 grep -C number pattern files : ...
- java三种工厂模式
适用场合: 7.3 工厂模式的适用场合 创建新对象最简单的办法是使用new关键字和具体类.只有在某些场合下,创建和维护对象工厂所带来的额外复杂性才是物有所值.本节概括了这些场合. 7.3.1 动态实现 ...
- 统计 iOS 设备锁定、解锁次数-b
今天下了个软件,可以记录手机解锁的次数和使用时间,当然啦,App 必须在后台运行着.当时比较纳闷的是有什么 API 可以接收设备解锁事件或通知的,Google 了下,还真有哎——我是链接:http:/ ...
- Python中异常(Exception)的总结
Python中的异常处理 异常处理的语句结构 try: <statements> #运行try语句块,并试图捕获异常 except <name1>: <statement ...
- SDUT 1570 C 旅行(DFS)
点我看题目 题意 : 中文不详述. 思路 :就是DFS一下,只要到达终点条数就加1,然后再注意一下方向,因为我就是没注意方向WA了,只能向上向右走,x是行,所以向上是x-1,向右是y+1,因为我没弄好 ...
- SQL模糊查询与删除多条语句复习
string IDlist="1,2,3"; 批量删除数据 StringBuilder strsql=new StringBuilder(); strSql.Append(&quo ...
- poj3280Cheapest Palindrome(记忆化)
链接 真的1A了.. 一开始想复杂了 想着补全再删 没想好 后来想到递归 大的回文串是由小的推过来的 一直递归下去 对于当前的i,j可以选择保留或者删除 选个最小的 #include <iost ...
- USACO4.12Beef McNuggets(背包+数论)
昨天晚上写的一题 结果USACO一直挂中 今天交了下 有一点点的数论知识 背包很好想 就是不好确定上界 官方题解: 这是一个背包问题.一般使用动态规划求解. 一种具体的实现是:用一个线性表储存所有的 ...