专栏首页IMWeb前端团队性能优化--核心定义介绍篇(1)

性能优化--核心定义介绍篇(1)

本文作者:IMWeb 莫卓颖 原文出处:IMWeb社区 未经同意,禁止转载

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

建议阅读人群:

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

核心性能定义介绍:

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

后端性能定义

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

前端性能定义:

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

影响核心性能因素:

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

总结

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

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 2019年搜索引擎蜘蛛爬虫名称最新整理总汇

    一般我们的网站能在百度等搜索引擎上搜到,说明该搜索引擎的爬虫爬到了我们的网站并且被搜索引擎收录。

    德顺
  • NGW,前端新技术赛场:Serverless SSR 技术内幕

    一、前言 最近 Serverless 又火了,有不少业务上云实装了 Serverless 云函数,取得了不错的落地效果,业界也在不断探索 Serverless...

    腾讯云serverless团队
  • 微软Chromium内核Edge浏览器扩展插件网站上线

    微软已经发布了官方版本的Microsoft Edge(金丝雀版),现在用户可以访问微软的Addons(全称Microsoft Edge Insider Addo...

    德顺
  • Z-Blog给文章所有的站外a链接添加nofollow的方法

    在这我不就详细介绍 nofollow 了,近段时间我会整理一些关于 nofollow 的资料。

    德顺
  • 网站HTTP错误状态代码及其代表的意思总汇

    在调试Web服务器时,会遇到各种错误代码,让人摸不着头脑,单如果知道了这些代码代表什么意思?很多问题就迎刃而解了,对我们的调试也会有很大帮助。

    德顺
  • Discuz! X3.4提示Table './.../k_spider' is marked的解决办法

    (145) Table './.../k_spider' is marked as crashed and should be repaired

    德顺
  • Robots协议探究:如何好好利用爬虫提高网站权重

    站长们通常希望百度、Google 这样的大型搜索引擎来抓取网站内容,但又很厌恶其他来路不明的网络爬虫抓取自己的信息。

    德顺
  • 一些Apache环境常用的.htaccess伪静态规则范例

    德顺
  • Web/PhpStorm代码格式化a、img标签换行的问题解决

    最近发现一个问题,使用 WebStorm 或者 PhpStorm 代码格式化时, a 标签 和 img 标签或者 link 标签会自动换行,显示多行,如下图:

    德顺
  • 织梦CMS去版权

    找到网站目录下的 \include\common.inc.php 文件,搜索 $cfg_version 可以看到以下信息,修改成你想要的就可以了。

    德顺

扫码关注云+社区

领取腾讯云代金券