名词解释

Published by powerfulyang on Sep 7, 2021

什么是 QPS, TPS, PV, UV, GMV...

QPS

Queries Per Second，每秒查询数。每秒能够响应的查询次数。

QPS 是对一个特定的查询服务器在规定时间内所处理流量多少的衡量标准，在因特网上，作为域名系统服务器的机器的性能经常用每秒查询率来衡量。每秒的响应请求数，也即是最大吞吐能力。

TPS

Transactions Per Second 的缩写，每秒处理的事务数目。一个事务是指一个客户机向服务器发送请求然后服务器做出反应的过程。客户机在发送请求时开始计时，收到服务器响应后结束计时，以此来计算使用的时间和完成的事务个数，最终利用这些信息作出的评估分。

TPS 的过程包括：客户端请求服务端、服务端内部处理、服务端返回客户端。

例如，访问一个 Index 页面会请求服务器 3 次，包括一次 html，一次 css，一次 js，那么访问这一个页面就会产生一个 “T”，产生三个 “Q”。

PV

Page View 即页面浏览量，通常是衡量一个网络新闻频道或网站甚至一条网络新闻的主要指标。用户每一次对网站中的每个页面访问均被记录 1 次。用户对同一页面的多次刷新，访问量累计。

根据这个特性，刷网站的 PV 就很好刷了。

与 PV 相关的还有 RV，即重复访问者数量 Repeat Visitors。

UV

访问数 Unique Visitor 指独立访客访问数，统计 1 天内访问某站点的用户数 (以 cookie 为依据)，一台电脑终端为一个访客。

GMV

Gross Merchandise Volume 的简称。只要是订单，不管消费者是否付款、卖家是否发货、是否退货，都可放进 GMV 。

RPS

代表吞吐率，即 Requests Per Second 的缩写。吞吐率是服务器并发处理能力的量化描述，单位是 reqs/s，指的是某个并发用户数下单位时间内处理的请求数。 某个并发用户数下单位时间内能处理的最大的请求数，称之为最大吞吐率。

Web Standards

https://www.tutorialsteacher.com/d3js/web-standards

HTML

HTML = HyperText Markup Language

HTML is used to structure the content of the web page. The current version is HTML 5. It is stored in a text file with the extension ".html".

A typical bare-bones HTML example looks like this:

Example: Use D3 library from CDN

html
1<!DOCTYPE html>
2<html lang="en">
3<head>
4    <meta charset="UTF-8">
5    <title></title>
6</head>
7<body>
8
9</body>
10</html>

Learn HTML from developer.mozilla.org

DOM

DOM = Document Object Model

When you write html code for your page, it gets converted to a hierarchical structure on the browser. Every tag in html gets converted to an element in the DOM with a parent-child hierarchy. It makes your html more logically structured. Once the DOM is formed, it makes it easier to manipulate (add/modify/remove) the elements on the page. Remember we had learnt in the first chapter that the first 'D' in D3 stands for Document. D3 gives you the tools to manipulate this DOM via your data.

Learn more about DOM from developer.mozilla.org.

CSS

CSS = Cascading Style Sheets

HTML gives a structure to the web page, while CSS styles your web page making it more pleasant to look at. It is a stylesheet language used to describe the presentation of a document written in HTML or XML (including XML dialects like SVG or XHTML). CSS describes how elements should be rendered on a web page.

Learn CSS from developer.mozilla.org.

SVG

SVG = Scalable Vector Graphics

SVG is a way to render images on the web page. SVG is not a direct image but is just a way to create images using text. As it's name suggests, it is scalable vector. It scales itself according to the size of the browser, so resizing your browser will not distort the image. All browsers support SVG except IE 8 and below.

Since data visualizations are visual representations, it is convenient to use SVG to render visualizations using D3.

Think of SVG as a canvas on which you can paint different shapes.

So to start off, create an SVG tag: <svg width="500" height="500"></<svg>

The default measurement for SVG is pixels, so you don't need to specify if your unit is pixel.

Now if you would like to draw a rectangle inside this SVG, draw it using <rect> :

Example: Square in SVG

svg
1<svg width="500" height="500">
2    <rect x="0" y="0" width="300" height="200"></rect>
3</svg>

You can draw the square using <rect> by applying same width and height attribute. Some of the other shapes that can be drawn in SVG include line, circle, ellipse, text and path.

Just like styling html elements, styling SVG elements is simple. Let's color the above rectangle in yellow. All you need to add is an attribute "fill" and specify the color.

Example: Colored Rectangle

svg
1<svg width="500" height="500">
2    <rect x="0" y="0" width="300" height="200" fill="yellow"></rect>
3</svg>

Learn more about SVG from developer.mozilla.org

JavaScript

JavaScript is a loosely-typed client side scripting language that executes in the user's browser. JavaScript interact with html elements (DOM elements) in order to make the web user interface interactive.

JavaScript implements ECMAScript standards, which includes core features based on ECMA-262 specification as well as other features which are not based on ECMAScript standards.

POJO

plain old Javascript objects (POJOs).

CLS

cumulative layout shift

FOUT

flashes of unstyled text

Sentry

https://docs.sentry.io/product/performance/web-vitals/

  • TPM: 平均每分钟事务数
  • FCP: (First Contentful Paint) 首次内容绘制，标记浏览器渲染来自 DOM 第一位内容的时间点，该内容可能是文本、图像、SVG 甚至 元素.
  • LCP: (Largest Contentful Paint) 最大内容渲染，代表在viewport中最大的页面元素加载的时间. LCP的数据会通过PerformanceEntry对象记录, 每次出现更大的内容渲染, 则会产生一个新的PerformanceEntry对象
  • FID: (First Input Delay) 首次输入延迟，指标衡量的是从用户首次与您的网站进行交互（即当他们单击链接，点击按钮等）到浏览器实际能够访问之间的时间
  • CLS: (Cumulative Layout Shift) 累积布局偏移，总结起来就是一个元素初始时和其hidden之间的任何时间如果元素偏移了, 则会被计算进去, 具体的计算方法可看这篇文章 https://web.dev/cls/
  • FP: First Paint (FP) 首次绘制，测量第一个像素出现在视口中所花费的时间，呈现与先前显示内容相比的任何视觉变化。这可以是来自文档对象模型 (DOM) 的任何形式，例如 background color 、canvas 或 image。FP 可帮助开发人员了解渲染页面是否发生了任何意外。
  • TTFB: Time To First Byte (TTFB) 首字节时间，测量用户浏览器接收页面内容的第一个字节所需的时间。TTFB 帮助开发人员了解他们的缓慢是由初始响应(initial response)引起的还是由于渲染阻塞内容(render-blocking content)引起的
  • USERS: UV数
  • USER MISERY: 对响应时间难以容忍度的用户数，User Misery 是一个用户加权的性能指标，用于评估应用程序性能的相对大小。虽然可以使用 Apdex 检查各种响应时间阈值级别的比率，但 User Misery 会根据满意响应时间阈值 (ms) 的四倍计算感到失望的唯一用户数。User Misery 突出显示对用户影响最大的事务。可以使用自定义阈值为每个项目设置令人满意的阈值。阈值设置在Settings -> sentry -> cra-test -> Performance

出口转内销

show show way

收收味的谐音，最开始是女权嘲讽一些仇女、厌女情绪特别明显的男性收敛一点，称为国男收收味，后来被沿用到很多场合，比如xxx的粉丝收收味，就是劝对方收敛一点，很明显能‌‌‌​​​​‌​‌​‌‌​​‌‌‌​看出来对方的特性。

好好说话之 GitHub

  • PR: Pull Request. 拉取请求，给其他项目提交代码
  • LGTM: Looks Good To Me. 朕知道了 代码已经过 review，可以合并
  • SGTM: Sounds Good To Me. 和上面那句意思差不多，也是已经通过了 review 的意思
  • WIP: Work In Progress. 传说中提 PR 的最佳实践是，如果你有个改动很大的 PR，可以在写了一部分的情况下先提交，但是在标题里写上 WIP，以告诉项目维护者这个功能还未完成，方便维护者提前 review 部分提交的代码。
  • PTAL: Please Take A Look. 你来瞅瞅？用来提示别人来看一下
  • TBR: To Be Reviewed. 提示维护者进行 review
  • TL;DR: Too Long; Didn't Read. 太长懒得看。也有很多文档在做简略描述之前会写这么一句
  • TBD: To Be Done (or Defined/Discussed/Decided/Determined). 根据语境不同意义有所区别，但一般都是还没搞定的意思

网络相关

  • TTL - Time To Live
    生存时间 (TTL) 是指数据包在被路由器丢弃之前可存在于网络内部的时间或“跃点”数。TTL 还用于其他上下文中，包括 CDN 缓存和 DNS 缓存。

    • IP TTL The meaning of TTL, or packet lifetime, depends on the context. For example, TTL is a value in an Internet Protocol (IP) packet that tells a network router when the packet has been in the network too long and should be discarded. The time-to-live value instructs a network router when a packet should be discarded.
    • DNS TTL is a setting that tells the DNS resolver how long to cache a query before requesting a new one. The information gathered is then stored in the cache of the recursive or local resolver for the TTL before it reaches back out to collect new, updated details.

  • ICMP - Internet Control Message Protocol

TCP

Short for transmission control protocol/Internet protocol

SYN

Short for synchronize, SYN is a TCP packet sent to another computer requesting that a connection be established between them. If the SYN is received by the second machine, an SYN/ACK is sent back to the address requested by the SYN. Lastly, if the original computer receives the SYN/ACK, a final ACK is sent.

ACK

Short for acknowledgment, ACK is an answer given by another computer or network device indicating it acknowledged the SYN/ACK or other request sent to it.

If the signal is not received correctly, a NAK is sent.

FIN

Maybe short for finish

RST

An RST packet is sent either in the middle of the 3-way handshake when the server rejects the connection or is unavailable OR in the middle of data transfer when either the server or client rejects further communication bypassing the formal 4-way TCP connection termination process.

好好说话之 JavaScript

  • iife: An IIFE (Immediately Invoked Function Expression) is a JavaScript function that runs as soon as it is defined.