客户端的性能(一)

2011-3-10 15:11:42 - tanlixiao

来自《Utra-fast ASP.NET Build Ultra-Fast and Utrl-Scalable Wbsite Using Asp.net and SQL Server》
client performance
客户端的性能
the process of displaying a web page involves distributed computing,a browser on the client pc requests and parses the
html,javascript,css,images and other objects on a page,while one or more servers generate and deliver dynamic and static
content,building a fast system,therefore,requires both the browser and the server to be fast,as well as the network and
other components in between。one way to think about it is that the server is really sending one or more programs to the
browser in the form of html(which is after all,hypertext markup language) and javascript,the browser then has to parse and
execute those programs and render the results to screen。
在显示一个网页的过程包括分布式计算,客户端PC上的浏览器的请求,并解析的HTML,JavaScript,CSS的,图像和其他对象在网页上,而产
生一个或多个服务器,并提供动态和静态内容,建设快速系统,因此,既需要在浏览器和服务器要快,以及网络和在两者之间。其他组件的一
种方式去思考,那就是真正的服务器发送的形成一个或多个程序到浏览器HTML的(这毕竟是超文本标记语言)和JavaScript,然后浏览器必须
分析和执行这些方案和结果呈现到屏幕上。

for existing sites,i have found that optimizing the output of your web site so that it runs faster on the client can often
produce larger user-visible performance improvements than making your server-side code run faster,it is therefore a good
place to start on the road to building an ultra-fast site.
对现有的网站,我发现,优化,使您的网站运行速度更快的输出端上往往可以产生比使你的服务器端代码运行得更快更大的用户可见的性能改
进,因此它是一个很好的起点在路上要建立一个超快速的网站。

particularly on the browser side of the performance equation,many of then the result y small improvements can quickly add up
to large one。slow sites are often the result of the "death of 1000 cuts" syndrome。a few extra characters here or there
don't matter。however,many small transgressions can quickly add up to make the difference between a slow site nd a fast
one,or between a fast site and an ultra-fast one。another way to think about it is that it is a often a lot easier to save a
handful of bytes in 100 places than 100 bytes in a handful of places。
特别是在浏览器的性能方程的一面,那么结果?许多小的改进可以快速添加到大型之一。缓慢的网站往往是该综合征的“死亡裁员1000“的结
果。一些多余的字符在这里或那里不'没关系。然而,许多小犯可以快速添加到使一个缓慢的网站之间的差异届一快一之间,或一个网站和一
个快速超快之一。另一种方式去思考,那就是它是一个常一个更容易保存在少数地方的字节在100比100个字节的地方屈指可数。

imagine building a house,a little neglect here or there won't compromise the quality of the final product,however,if the attitude becomes pervasive,it doesn't take long before the whole structure suffers as a result,in fact,at some point,repairs are impossible,and you have to tear down the house and build again from scratch to get it right,a similar thing happens with many aspects of software,including performance and scalability.
想象盖房子一样,一小疏忽任何事情都不会影响最终产品的质量,但是,如果态度变得普遍,这并不需要很长时间之前的整个结构,结果遭受事实上,在一些点,维修是不可能的,你必须拆掉房子,建立再从头做才是正确的,类似的事情发生了许多方面的软件,包括性能和可扩展性。
in this chapter,i will cover the following
在这一章中,我将讨论以下

browser page processing -- 浏览器页面的处理
browser caching--浏览器缓存
network optimizations--网络优化
script include file handling--脚本包含文件处理
download less--下载少
using javascript to gate page requests--使用JavaScript门页面请求
using javascript to reduce html size--使用JavaScript的HTML规模减少
upload less--上传少
css optimizations--CSS的优化
image sprites and clustering--影像精灵和集群
leveraging dhtml --利用DHTML的
using silverlight --使用Silverlight
improving rendering speed --提高渲染速度
precaching --预缓存
table-less layout using css --表少用CSS布局
optimizing javascript performance--JavaScript的性能优化

browser page processing
浏览器页面的处理

when a browser loads a page,it is not a batch process。users don't close their eyes after they enter a url and open them again when the browser has finished loading the page。browsers do what they can to overlap activity on multiple network connections with page parsing and rendering to the screen。the steps browsers follow are often extremely visible to users and can have a significant impact on both perceived performance and total page load time。
当浏览器加载一个页面,它是不是一个批处理过程。用户不闭眼后输入一个URL并打开它们时再次浏览器已完成加载页面。浏览器做什么,他们可以在多个重叠的网络活动与页面解析和渲染到屏幕上的连接。浏览器遵循的步骤往往是非常显眼的用户,可以有一个感知性能上都和总页面加载时间产生重大影响。

network connections and the initial http request
网络连接和初始HTTP请求

to retrieve a web page,browsers start with a url,the browser determines the ip address of the server using dns,then,using http over tcp,the browser connects to the server and requests the content associated with the url,the browser parses the response and renders it to the screen in parallel with the ongoing network activity,queuing and requesting content from other urls in parallel as it goes.
rather than getting to sidetracked with the variations from one browser to another,my focus here will mostly be on internet explorer 7(ie 7,or just ie),partly because it is the browser that i understand best,other browsers work similarly,although there are definite difference from one implementation to another,with firefox,users can set parameters that change some of the details of how it processes page,so the page load experience may not be 100 percent identical from one user to another,even when they are using the same browser。
检索网页,浏览器开始使用URL,浏览器决定了使用DNS服务器的IP地址,然后,在TCP的HTTP,浏览器连接到服务器并请求与URL关联的内容,浏览器解析它的反应,并呈现在与正在进行的网络活动并联屏,排队,并要求同时从其他URL的内容自有其道理。
而不是让与牵制的变化从一个浏览器到另一个,我这里的重点将主要是在Internet Explorer7(IE 7中,或者只是IE)中,部分是因为它是最好的浏览器,据我所知,其他浏览器同样的工作,虽然有一定的差异,从一个到另一个用Firefox执行,用户可以设置参数,改变它是如何处理页面,这样页面加载的经验未必是百分之百从一个用户到另一个相同的一些细节,甚至当他们使用相同的浏览器。

the browser asks the server to open a connection by sending a tcp SYN packet,the server responds by acknowledging the syn,at which point the connection is open,
the browser then sends an http get,which includes the requested url,cookies,and other details,after a while,the server ACKs that packet,and during the time marked as a in figure 2-1,it generates a response.
then the server sends the response and the client ACKs it,how often the ACKs are require is determined by the size of the tcp "window",which is a big factor in achievable network speeds,
you can see that the response to the browser's request doesn't arrive all at once. there are gaps of time between when the client sends a packet and when the server responds,as well as in between successive packets.
horizontal zones such as area A in figure 2-1 where there are no boxes containing packets indicate that the network is idle during those times. using multiple simultaneous connections can help minimize that idle time and thereby minimize total page load time.
浏览器要求服务器打开一个通过发送一个TCP SYN包的连接,服务器响应通过承认了SYN,此时该连接处于打开状态,
然后浏览器发送一个HTTP GET,其中包括请求的URL,Cookie和其他细节一段时间后,服务器的ACK的数据包,并在图2-1中明显的时候,它生成一个响应。
那么服务器发送的响应和客户端的ACK呢,怎么常常是需要的ACK是由TCP的“窗口“,这是一个很重要的因素实现的网络速度的大小决定,
你可以看到,到浏览器的请求响应不一次全部到达。有时间之间的差距时,客户端发送一个数据包,当服务器响应,以及在连续的数据包。
如面积在图2-1水平防火区那里有没有信箱表明,含有数据包在网络中空闲的时间。同时使用多个连接可以帮助减少这种空闲时间,从而减少总页面载入时间。

标签:客户端

关于我

喜欢简简单单的生活.

记录平凡世界的点滴

-于2010年12月31日

联系我

  • 微信:fishren
  • 邮箱:
    tanlixiao@163.com
  • Address:
    中国最南端的滨海城市
    河西区 解放路 502