网站性能优化之页面首次展示

什么是页面首次展示?

1,页面首次展示指一个新用户第一次打开网站页面,此时浏览器没有该页面的任何缓存。

2,首次展示是一个网站性能指标,首次打开的快慢能给用户留下网站的第一印象。

3,如果你清除浏览器缓存,再次访问页面,也相当于首次展示。

首次访问和以后的重复访问有什么区别?

1,第一次访问一个页面,css,js,图片等静态资源都需要服务器上下载。

2,第二次,第三次,第N次再访问的时候,css,js,图片等资源会被浏览器缓存起来。所以第一次之后的访问会比第一次快。

为什么要测首次展示?

1,测试一个页面的首次展示,能精确的再现新用户打开页面时的体验。

2,首次访问页面,和第二第三...第N次访问的体验是不同的。

所以,做好页面的首次展示,对用户体验有很大的改善。

怎样去做好页面的首次展示?

一种常用的方案就是按需加载,即页面只加载第一屏的资源(主要是图片资源),随着滚动,再去请求加载更多的资源。

时间: 2024-10-08 00:53:30

网站性能优化之页面首次展示的相关文章

Yahoo! 35条网站性能优化建议

Yahoo! 35条网站性能优化建议 分类: 网站性能优化2014-03-08 17:18 212人阅读 评论(0) 收藏 举报 网站性能优化 Yahoo!的 Exceptional Performance团队为改善 Web性能带来最佳实践.他们为此进行了一系列的实验.开发了各种工具.写了大量的文章和博客并在各种会议上参与探讨.最佳实践的核心就是旨在提高网站性能.原版猛戳:Best Practices for Speeding Up Your Web Site, Excetional Perfo

网站性能优化

之前在做电商网站的时候,曾经因为网站图片太多,加载过慢而不得不提高服务器性能,但阿里云服务器提升性能较贵,便去找了找关于网站性能优化的知识,没想到的确省了一些钱,性能有所好转.最近公司的项目又再次涉及到性能优化问题,总结了下之前经历的项目经验,得出以下几点优化思路: 1.从请求入手,找到最慢的一个 就好像木桶原理一样,找到最短的一块进行弥补.性能优化也一样,找到最慢的那部分请求进行优化.一般可以分为图片.css\js文件.后台请求等几方面. 通过对请求进行分析找到最慢的一个进行优化 2.图片优化

【转】Yahoo!团队:网站性能优化的35条黄金守则

Yahoo!的 Exceptional Performance团队为改善 Web性能带来最佳实践.他们为此进行了一系列的实验.开发了各种工具.写了大量的文章和博客并在各种会议上参与探讨.最佳实践的核心就是旨在提高网站性能. 原版猛戳:https://developer.yahoo.com/performance/rules.html,本文转自:http://blog.csdn.net/xianghongai/article/details/9241549 Excetional Performan

Yahoo团队经验:网站性能优化的34条黄金法则

Yahoo团队总结的关于网站性能优化的经验,非常有参考价值.英文原文:http://developer.yahoo.com/performance/rules.html 1.尽量减少HTTP请求次数 终端用户响应的时间中,有80%用于下载各项内容.这部分时间包括下载页面中的图像.样式表.脚本.Flash等.通过减少页面中的元素可以减少 HTTP请求的次数.这是提高网页速度的关键步骤.减少页面组件的方法其实就是简化页面设计.那么有没有一种方法既能保持页面内容的丰富性又能达到加快响应时间的目的呢?这

如何进行网站性能优化

如何进行网站性能优化 雅虎Best Practices for Speeding Up Your Web Site: content方面 减少HTTP请求:合并文件.CSS精灵.inline Image 减少DNS查询:DNS查询完成之前浏览器不能从这个主机下载任何任何文件.方法:DNS缓存.将资源分布到恰当数量的主机名,平衡并行下载和DNS查询 避免重定向:多余的中间访问 使Ajax可缓存 非必须组件延迟加载 未来所需组件预加载 减少DOM元素数量 将资源放到不同的域下:浏览器同时从一个域下载

网站性能优化:动态缩略图技术实现思路

在网站开发过程中,大家都是如何解决多尺寸图片缩略图问题的呢?犹为典型的是电商网站,据了解,淘宝的图片缩略图是直接存储多张缩略图的方式,以满足各种情况下使用,因为它有牛逼的开源+自主开发的海量图片存储架构作支撑.但是,我们在做网站时,并不可能直接搬牛逼的架构过来,就可以达到预期的效果,况且各种成本投入也是有限的.所以一般性能优化的原则大都是这样:先考虑软件的优化,再考虑硬件的升级,当然土豪客户则除外. 很多网站可能没有对图片进行缩略图处理,上传时图片可能几百KB,在页面也是直接加载几百KB的图片大

网站性能优化你需知道的东西

本文提到的网站性能指网站的响应速度,这也符合绝大部分人对于网站性能的理解:访问快速的网站性能好,反之,访问速度越慢,则网站性能越差.本文总结的优化方法是宏观的工程层面的方法,并不包含微观的语言语法层面的方法,例如,JS.CSS的语法优化,这一部分同样影响网站的性能,但语言语法层面的优化更多的是取决于开发人员的编程水平. 什么样的网站响应速度快呢?其实很容易想到,网站加载资源的速度越快,网站响应速度越快:网站需要加载的资源越少,网站响应速度越快.这就分别对应网站性能优化的两大方向:资源缓存.资源合

[转载]网站前端性能优化之javascript和css——网站性能优化

之前看过Yahoo团队写的一篇关于网站性能优化的文章,文章是2010年左右写的,虽然有点老,但是很多方面还是很有借鉴意义的.关于css的性能优化,他提到了如下几点: CSS性能优化 1.把样式表置于顶部 现把样式表放到文档的< head />内部似乎会加快页面的下载速度.这是因为把样式表放到< head />内会使页面有步骤的加载显示. 注重性能的前端服务器往往希望页面有秩序地加载.同时,我们也希望浏览器把已经接收到内容尽可能显示出来.这对于拥有较多内容的页面和网速较慢的用户来说特

网站性能优化小结和spring整合redis

现在越来越多的地方需要非关系型数据库了,最近网站优化,当然从页面到服务器做了相应的优化后,通过在线网站测试工具与之前没优化对比,发现有显著提升. 服务器优化目前主要优化tomcat,在tomcat目录下的server.xml文件配置如下内容: <Connector port="1818" protocol="HTTP/1.1" maxHttpHeaderSize="8192" maxThreads="1000" minS