WEB开发性能优化--核心定义介绍篇(1)
推荐理由
随着 互联网的蓬勃发展,并且伴随着产品功能的越来越复杂,对于技术人员来说最大的挑战就是如何在保证业务快速发展的同时,也可保证不断复杂的业务对用户体验的影响,其中对用户来说最重要的体验指标是如何快速、稳定的访问业务网站以及产品功能,既是网站的性能。本系列文章将会从前后端性能指标定义、性能工具使用、产品业务核心性能指标、前后端性能解决方案出发对这个性能优化体系进行完整的阐述。
建议阅读人群:
前端工程师、后端工程师、产品经理
核心性能定义介绍:
由于涉及前后端的性能指标、定义非常多,本文将重点介绍对前后端影响比较大的指标,让大家对性能优化的核心指标有个整体的认识与了解
后端性能定义
- DNS时间:用户在浏览器输入网址名称(网址)后,浏览器通过查询DNS服务器所需要的时间
- 建立连接时间:根据TCP协议要求,请求方(浏览器等)与接受方(服务器)经过一系列协商所需要的时间
- 服务器处理时间:接收方(服务器)处理请求所需时间
- 数据传输时间:从请求方(浏览器等)到接收方(服务器)以及从接收方(服务器)到请求方的时间
前端性能定义:
- 白屏时间:用户浏览器输入网址后至浏览器出现至少1px图片为止
- 首屏时间:用户浏览器首屏内所有的元素呈现所花费时间
- 用户可操作时间(dom ready) :网站某些功能可以使用的时间
- 页面总下载时间(onload):网站中所有资源加载完成并且可用时间
影响核心性能因素:
- DNS时间:与DNS设置的TTL时间以及DNS服务器有关
- 建立连接时间:与用户、服务器的网速、带宽有关
- 服务器起处理时间:与程序复杂度、服务器性能相关
- 数据传输时间:资源大小、用户、服务器的网速、带宽有关
- 白屏时间:与后端性能指标、前端headtime以及页面结构设计
- 首屏时间:与白屏时间以及页面首屏程序设计有关
- 用户可操作时间:与页面结构设计相关
- 页面总下载时间: 与页面资源多少相关
总结
其实在性能优化领域还有很多细节值得探索和挖掘,这篇文章先让大家对核心性能优化有一个直观的了解以及认识,下篇文章将会从性能工具角度考虑,如何检测性能优化中遇到的问题。
相关阅读:
文章出自腾讯云技术社区
https://www.qcloud.com/community/article/770480001489391692
推荐大家关注腾讯云技术社区微信公众号:QcloudCommunity
WEB开发性能优化--核心定义介绍篇(1)的更多相关文章
- web开发性能优化---UI界面篇
1.尽量采用div+css布局 DIV+CSS相比较与表格布局的优势: a.代码精简 使用DIV+CSS布局,页面代码精简,这一点对XHTML有所了解的都知道.代码精简所带来的直接好处有两点:一是提高 ...
- web开发性能优化---扩展性能篇
1.实现代码分离 一个成熟的软件开发团队一般都不会全然手写代码.这里讲的代码分离仅仅要是开发中用到的小技巧,通过底层框架+手工代码方式结合实现高速开发和高速扩展. Code目录内文件不同意改动,目录主 ...
- web开发性能优化---SEO优化篇
一.清理垃圾代码 清理垃圾代码是指删除页面中的冗余代码,可以删除80%的冗余代码. 垃圾代码主要指那些删除了也不会对页面有任何影响的非必要代码. 最常见的垃圾代码,空格 空格字符是网页中最常见的垃圾代 ...
- web开发性能优化---分布式篇
1.分布式架构-独立站点开发 模块化结构化开发,实现多资源分站点,数据分库,为后期实现分布式部署做准备,主要分为以下几部分: web站点: 1.web前端站点 2.图片.文件资源站点 3.管理端站点4 ...
- web开发性能优化---代码优化篇
1.合理使用缓存使用 提高性能最好最快的办法当然是通过缓存来改善,对于任何一个web开发者都应该善用缓存.Asp.net下的缓存机制十分强大,用好缓存机制可以让我们极大的改善web应用的性能. 1.页 ...
- web开发性能优化---项目架构篇
项目技术架构层级规划和介绍 简称四横两纵 四横即四大层次.分别为: 1.用户渠道层:用户渠道层是直接面向终于用户.通过站点的形式向用户提供产品展示.企业市场宣传.对产品的订购.互动分享.客户关怀以及用 ...
- web开发性能优化---数据库篇
1. 查询出的数据量过大(可以采用多次查询,其他的方法降低数据量),尽量采取分页查询数据 2.锁或者死锁(这也是查询慢最常见的问题,是程序设计的缺陷) 3.返回了不必要的行和列 用OR的字句可以分解成 ...
- web开发性能优化---用户体验篇
怎样从技术角度怎样增强用户体验.都是非常多平台都在做的事情,依据个人实际经验碰到几种体验做下总结. 1.降低页面刷新白屏 适当使用ajax技术.改善刷新白屏现象. 2.信息提醒,邮件.站内信.短信在购 ...
- web开发性能优化---UI接口章
1.尽可能的远div+css设计 DIV+CSS与表相比格优势布局: a.精简代码 采用DIV+CSS设计,页面代码精简.这是为了XHTML了解都知道. 代码精简所带来的直接优点有两点:一是提高蜘蛛爬 ...
随机推荐
- 读书笔记 effective c++ Item3 在任何可能的时候使用 const
Const可以修饰什么? Const 关键字是万能的,在类外部,你可以用它修饰全局的或者命名空间范围内的常量,也可以用它来修饰文件,函数和块作用域的静态常量.在类内部,你可以使用它来声明静态或者非 ...
- hibernate注解的简单应用
注解代替了我们用的*.hbm.xml文件.简少了我们的代码量:应用简单. @Override 用途:重写父类的同名方法 单元测试注解 @Test 用途:用于测试 @Before 用途:单测方法走之前执 ...
- python中的select模块
介绍: Python中的select模块专注于I/O多路复用,提供了select poll epoll三个方法(其中后两个在Linux中可用,windows仅支持select),另外也提供了kqu ...
- CountDownLatch类的使用
java.util.concurrent.CountDownLatch是一个并发构造,它允许多个线程等候特定的操作完成. CountDownLatch用一个数字初始化,通过调用countDown()方 ...
- Javascript 闭包与高阶函数 ( 一 )
上个月,淡丶无欲 让我写一期关于 闭包 的随笔,其实惭愧,我对闭包也是略知一二 ,不能给出一个很好的解释,担心自己讲不出个所以然来. 所以带着学习的目的来写一写,如有错误,忘不吝赐教 . 为什么要有闭 ...
- HTTP状态码理解
100-199 用于指定客户端应相应的某些动作. 200-299 用于表示请求成功. 300-399 用于已经移动的文件并且常被包含在定位头信息中指定新的地址信息. 400-499 用于指出客户端的错 ...
- python 库安装笔记
python 库安装笔记 zoerywzhou@163.com http://www.cnblogs.com/swje/ 作者:Zhouwan 2017-2-22 友情提示 安装python库的过程中 ...
- jQuery中.bind() .live() .delegate() .on()的区别 和 三种方式写光棒事件 动画
地狱的镰刀 bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数. $("a").bind("click",function(){ ...
- 实际情况来看,还是yield很爽
0 引言 最近公司有一个 php 的项目,要 port 到 node.js 来.我之前没有接触过这个项目,整个项目使用的是 yaf 框架.整个项目流程是调用服务端的业务数据,然后拼装数据,返回给前端: ...
- (译文)Python中的staticmethod与classmethod
原文是stackoverflow的一则高票回答,原文链接 可能之前也有人翻译过,但是刚好自己也有疑惑,所以搬运一下,个人水平有限所以可能翻译存在误差,欢迎指正(如侵删). 尽管classmethod和 ...