搭建企业网站具体过程常德公交网站

1. 目标

对一款在浏览器提供服务的产品，进行性能优化，提升页面响应速度， 提升用户体验。

2. 性能瓶颈分析

页面访问使用频率

通过前端埋点(如有)，统计用户最常用的页面，抓大放小，优先优化这些页面。
如果没有前端埋点，建议把产品首页加载做性能优化，同时补齐前端埋点进行统计。

页面加载性能分析

利用Chrome等浏览器的性能分析工具，我们对一款ToB产品神策进行性能分析：
地址：https://family.demo.sensorsdata.cn/dashboard/?project=EbizDemo&product=sbp_family&id=413&dash_type=lego

指标	解释
FCP(First Contentful Paint)	FCP 测量呈现 DOM 中第一个内容的时间点——这意味着将显示第一个 HTML 元素
LCP(Largest Contentful Paint )	最大元素绘制事件。测量加载性能。为了提供良好的用户体验，LCP 应该控制在页面首次开始加载后的 2.5 秒内。

主要分析FCP和LCP之间的交互
通常LCP控制在2.5s以内，会体感比较好，而该页面在5s左右，有待改进。

静态资源加载方面：

有2个js加载较慢，如图所示需要920ms，可以优化。
优化思路：大图片压缩、Js文件大小压缩、延迟加载。
这种优化要比改代码的成本低得多。

前后端交互方面：

这些js加载，都在permission接口之后，permission接口响应时长1.52s，导致这些js都只能在这之后加载。应该分析能否并行加载。
另外一个常见的思路是：首屏不要渲染没必要的组件。

后端接口方面：

permission、rendor接口响应时长为2s左右，有较大优化的空间。

请求链路梳理

和系统通常，浏览器会从cdn等加载静态资源，然后经过LB、Nginx请求后端，后端服务之间的调用等等。

3. 打点上报、搭建性能看板

上面通过浏览器分析工具分析，只能分析单次请求，但接口响应速度上，我们应该看接口的平均耗时、PCT90(90%响应时长)等等

这就需要我们在后端代码中，增加埋点上报，然后搭建性能看板了。
开源的埋点上报工具有很多，这里就不一一列举了。
有的tracing工具，能直接帮你把打点、链路性能分析都做了，强大的很，最好直接用。

哪些需要打点：

1. 接口响应时长的打点
2. 接口内部耗时操作的打点：1. 调用第三方服务 2. 复杂方法 3. 调用Mysql等组件

4. 后端工作项拆分

事项	描述
测试环境准备	测试以上几个阻塞性接口和页面渲染性能，统计提升比例
打点补齐	前端页面渲染重要指标打点
	网关服务打点
	阻塞性接口重点业务逻辑打点
	阻塞性接口调用第三方服务打点
	缓存命中率打点
数据分析&优化	系统框架优化
	接口逻辑优化

接口逻辑优化

优化项	描述
超大接口拆分成多个小接口	比如页面加载时，一个请求包含了所有页面初始化所需的信息，包括产品信息、用户信息、用户权限，则最好拆分一下，也方便前端并行调用
第三方服务调用	减少不必要的第三方服务调用
对第三方服务的调用	先后没有依赖关系的，可以串行改并行
缓存	对不常改变的数据，使用本地/Redis缓存
缓存预加载	针对首次访问没有缓存加载慢的问题，可以预加载缓存
Mysql慢查询	索引、拆表

在接口优化方面，除了通过埋点，也有性能分析工具，能直观帮我们分析瓶颈，如go的Pprof，python的cProfile。
参考：Golang 大杀器之性能剖析 PProf
性能分析工具的好处是快、准确，但只能看单次的。埋点的好处是可以搭建监控看板，可以一直看。

系统框架优化

引入线程池

举个例子，Python的Gevent库，可以在IO阻塞时，调起其他协程，大大增加系统的吞吐量，而且对进行开发工作的程序员是无感的。

Gevent是一种协程的Python网络库，基于Greenlet封装了libevent事件循环的高层同步API。它让我们在不改变编程习惯的同时，用同步的方式写异步I/O的代码。使用Gevent编程性能确实要比用传统的线程高。

动态扩缩容

监测CPU和内存的水位，在到达如80%、90%时，就自动扩容机器。
在CPU和内存在一定水位之下，就将扩容的机器缩容掉。
比如一个核心服务正常有8个Pod，在需要扩容时，最大扩到16，在不需要时，最小保持8个Pod。

5. 性能监控和定期回顾

性能优化不易，最好是设置性能监控的告警，当超过一定阈值时，就要分析是不是最近新上的需求，让性能劣化了。