推荐理由

随着 互联网的蓬勃发展,并且伴随着产品功能的越来越复杂,对于技术人员来说最大的挑战就是如何在保证业务快速发展的同时,也可保证不断复杂的业务对用户体验的影响,其中对用户来说最重要的体验指标是如何快速、稳定的访问业务网站以及产品功能,既是网站的性能。本系列文章将会从前后端性能指标定义、性能工具使用、产品业务核心性能指标、前后端性能解决方案出发对这个性能优化体系进行完整的阐述。

建议阅读人群:

前端工程师、后端工程师、产品经理

核心性能定义介绍:

由于涉及前后端的性能指标、定义非常多,本文将重点介绍对前后端影响比较大的指标,让大家对性能优化的核心指标有个整体的认识与了解

后端性能定义

  • DNS时间:用户在浏览器输入网址名称(网址)后,浏览器通过查询DNS服务器所需要的时间
  • 建立连接时间:根据TCP协议要求,请求方(浏览器等)与接受方(服务器)经过一系列协商所需要的时间
  • 服务器处理时间:接收方(服务器)处理请求所需时间
  • 数据传输时间:从请求方(浏览器等)到接收方(服务器)以及从接收方(服务器)到请求方的时间

前端性能定义:

  • 白屏时间:用户浏览器输入网址后至浏览器出现至少1px图片为止
  • 首屏时间:用户浏览器首屏内所有的元素呈现所花费时间
  • 用户可操作时间(dom ready) :网站某些功能可以使用的时间
  • 页面总下载时间(onload):网站中所有资源加载完成并且可用时间

影响核心性能因素:

  • DNS时间:与DNS设置的TTL时间以及DNS服务器有关
  • 建立连接时间:与用户、服务器的网速、带宽有关
  • 服务器起处理时间:与程序复杂度、服务器性能相关
  • 数据传输时间:资源大小、用户、服务器的网速、带宽有关
  • 白屏时间:与后端性能指标、前端headtime以及页面结构设计
  • 首屏时间:与白屏时间以及页面首屏程序设计有关
  • 用户可操作时间:与页面结构设计相关
  • 页面总下载时间: 与页面资源多少相关

总结

其实在性能优化领域还有很多细节值得探索和挖掘,这篇文章先让大家对核心性能优化有一个直观的了解以及认识,下篇文章将会从性能工具角度考虑,如何检测性能优化中遇到的问题。

相关阅读:

腾讯存储与CDN免费体验

人人都可以做深度学习应用:入门篇

文章出自腾讯云技术社区

https://www.qcloud.com/community/article/770480001489391692

推荐大家关注腾讯云技术社区微信公众号:QcloudCommunity

WEB开发性能优化--核心定义介绍篇(1)的更多相关文章

  1. web开发性能优化---UI界面篇

    1.尽量采用div+css布局 DIV+CSS相比较与表格布局的优势: a.代码精简 使用DIV+CSS布局,页面代码精简,这一点对XHTML有所了解的都知道.代码精简所带来的直接好处有两点:一是提高 ...

  2. web开发性能优化---扩展性能篇

    1.实现代码分离 一个成熟的软件开发团队一般都不会全然手写代码.这里讲的代码分离仅仅要是开发中用到的小技巧,通过底层框架+手工代码方式结合实现高速开发和高速扩展. Code目录内文件不同意改动,目录主 ...

  3. web开发性能优化---SEO优化篇

    一.清理垃圾代码 清理垃圾代码是指删除页面中的冗余代码,可以删除80%的冗余代码. 垃圾代码主要指那些删除了也不会对页面有任何影响的非必要代码. 最常见的垃圾代码,空格 空格字符是网页中最常见的垃圾代 ...

  4. web开发性能优化---分布式篇

    1.分布式架构-独立站点开发 模块化结构化开发,实现多资源分站点,数据分库,为后期实现分布式部署做准备,主要分为以下几部分: web站点: 1.web前端站点 2.图片.文件资源站点 3.管理端站点4 ...

  5. web开发性能优化---代码优化篇

    1.合理使用缓存使用 提高性能最好最快的办法当然是通过缓存来改善,对于任何一个web开发者都应该善用缓存.Asp.net下的缓存机制十分强大,用好缓存机制可以让我们极大的改善web应用的性能. 1.页 ...

  6. web开发性能优化---项目架构篇

    项目技术架构层级规划和介绍 简称四横两纵 四横即四大层次.分别为: 1.用户渠道层:用户渠道层是直接面向终于用户.通过站点的形式向用户提供产品展示.企业市场宣传.对产品的订购.互动分享.客户关怀以及用 ...

  7. web开发性能优化---数据库篇

    1. 查询出的数据量过大(可以采用多次查询,其他的方法降低数据量),尽量采取分页查询数据 2.锁或者死锁(这也是查询慢最常见的问题,是程序设计的缺陷) 3.返回了不必要的行和列 用OR的字句可以分解成 ...

  8. web开发性能优化---用户体验篇

    怎样从技术角度怎样增强用户体验.都是非常多平台都在做的事情,依据个人实际经验碰到几种体验做下总结. 1.降低页面刷新白屏 适当使用ajax技术.改善刷新白屏现象. 2.信息提醒,邮件.站内信.短信在购 ...

  9. web开发性能优化---UI接口章

    1.尽可能的远div+css设计 DIV+CSS与表相比格优势布局: a.精简代码 采用DIV+CSS设计,页面代码精简.这是为了XHTML了解都知道. 代码精简所带来的直接优点有两点:一是提高蜘蛛爬 ...

随机推荐

  1. delete和delete[]

    c++中对new申请的内存的释放方式有delete和delete[两种方式,到底这两者有什么区别呢? 1.我们通常从教科书上看到这样的说明:delete 释放new分配的单个对象指针指向的内存dele ...

  2. Linux驱动技术(七) _内核定时器与延迟工作

    内核定时器 软件上的定时器最终要依靠硬件时钟来实现,简单的说,内核会在时钟中断发生后检测各个注册到内核的定时器是否到期,如果到期,就回调相应的注册函数,将其作为中断底半部来执行.实际上,时钟中断处理程 ...

  3. [商业_法务] 2、注册公司起名很费劲,用C++怒写个随机名字生成器

    前言 博主最近在注册公司,由于之前听说过注册公司的名字很难通过,于是便直接找代理去帮忙跑趟,为确保万无一失,还自己绞尽脑汁想了几个很奇葩的名字(噬菌体.云木.灌木.杏仁...). 但是不幸的是那些奇葩 ...

  4. python实现多变量线性回归(Linear Regression with Multiple Variables)

    本文介绍如何使用python实现多变量线性回归,文章参考NG的视频和黄海广博士的笔记 现在对房价模型增加更多的特征,例如房间数楼层等,构成一个含有多个变量的模型,模型中的特征为( x1,x2,..., ...

  5. angular ng-repeat数组中的数组

    //先定义一个数组anular代码: var app = angular.module('serApp', []); app.controller('indexCtrl', function($sco ...

  6. springMVC整合Junit4进行单元测试

    springMVC整合Junit4进行单元测试 标签: springMVC整合Junit4junit单元测试教程springMVC入门教程   spring(10)  版权声明:本文为博主原创文章,未 ...

  7. C#有关虚方法要知道的知识点:

    虚方法:这个方法其实就是为了重写方法而存在的(在声明中包含virtual关键字),否则没感觉到它存在的意义. 其一:因为要重写所以它的访问类型如果为private则毫无意义阻碍了重写动作的进行也就是它 ...

  8. ZooKeeper配额

    ZooKeeper可以在znode上设置配额限制.如果超出了配置限制,ZooKeeper将会在log日志中打印WARN日志.如果超出配额限制,并不会停止行为操作. ZooKeeper的配额是存储在/z ...

  9. 【录教程必备】推荐几款屏幕录制工具(可录制GIF)

    我们经常会遇到一些场景,需要你向别人展示一些操作或是效果——例如告诉别人某某软件的配置步骤啊.刚设计出来网站的动画效果怎么样啊.某某电影里面的一个镜头多么经典啊.打得大快人心的NBA绝杀瞬间是怎么回事 ...

  10. jquery序列化form表单

    在开发中有时需要在js中提交form表单数据,就需要将form表单进行序列化. jquery提供的serialize方法能够实现. $("#searchForm").seriali ...