{阅读笔记}如何优化Web前端性能

正如我们前面所说的，性能测试方法在执行性能测试后，将得到一系列性能测试数据，然后将其编译成报表。由于大型网站的复杂结构，用户从浏览器发送一个请求，知道数据库完成了操作，如果测试或用户被报告，中间有很多链接，对网站的响应是缓慢的并且存在性能问题。有必要分析请求经验的每一个环节，找出性能瓶颈可能在哪里，并找出问题所在。

检查一个网站的性能瓶颈并检查一个程序的性能瓶颈基本上是相同的。检查请求处理的各个环节的日志，分析哪些链接不合理，超出预期；然后检查监控数据，分析影响内存、磁盘、网络或CPU性能的主要因素，代码问题不合理或不合理。

根据网站的层次结构，性能优化可分为三类：Web前端性能优化、应用服务器性能优化、存储服务器性能优化。

让我们来谈谈Web前端性能优化。一般来说，Web前端是指网站业务逻辑的一部分，包括浏览器加载、Web视图模型、图片服务、CDN服务等。主要的优化手段是优化浏览器访问、使用反向代理、CDN等。

浏览器访问优化主要是通过减少HTTP请求、使用浏览器缓存、启用压缩、页面顶部的CSS、页面底部的JavaScript、减少Cookie的传输等五种手段。

HTTP协议是一个无状态的应用层协议，这意味着每个HTTP请求都需要建立一个通信链路并进行数据传输，并且在服务器端，每个HTTP都需要启动一个单独的线程来处理这些通信和服务的开销。非常高，可以减少HTTP请求的数量，以提高访问性能。

减少HTTP的主要手段包括合并CSS、合并JavaScript和合并图片。一旦浏览器需要被一起访问，JavaScript和CSS就被合并到一个文件中，这样浏览器只需要一个请求。图片也可以被合并，多个图片被合并成。一个。如果每个图片具有不同的超链接，则可以通过CSS偏移响应来构建鼠标点击操作的不同URL。

对于网站，CSS、JavaScript、徽标、图标和其他静态资源文件具有较低的更新频率，并且这些文件几乎都是每个HTTP请求所必需的，并且可以缓存在浏览器中。

该文件在服务器端进行压缩，在浏览器端对文件进行解压缩，可以有效减少通信传输的数据量，文件压缩率可达%以上。

浏览器将在下载所有CSS之后呈现整个页面，因此最好的方法是在页面顶部放置CSS，并让浏览器尽快下载CSS。另一方面，JavaScript在加载JavaScript后立即执行，可能阻止RESA。L页，导致缓慢的页面显示。

一方面，Cookie包含在每个请求和响应中，并且太大的Cookie将严重影响数据传输，所以需要对Cookie写入什么数据需要仔细检查。

CDN的本质仍然是一个缓存，数据缓存最接近用户，用户以最快的速度获取数据，即所谓的网络访问第一跳。

传统的代理服务器是多个浏览器的一方，代理浏览器将HTTP请求发送到Internet，而反向代理服务器位于Web站点的一侧，代理站点Web服务器接收HTTP请求。

由于传统的仪式服务器可以保护浏览器的安全性，反向代理服务器也具有保护网站安全的作用。来自Internet的访问请求必须通过代理服务器，这相当于在Web服务和可能的网络攻击之间建立障碍。

除了安全功能外，代理服务器还可以通过配置缓存功能来加快Web请求，当用户首先访问静态内容时，静态内容缓存在反向代理服务器上，这样当其他用户访问静态内容时，可以直接返回FR。OM反向代理服务器。