大型网站技术架构 | Web前端性能优化

Posted 2022-05-16 洛阳泰山

前言

根据网站分层架构，可分为web前端性能优化、应用服务器性能优化、存储服务器优化三大类。

Web前端性能优化

一般来说Web前端是指网站在浏览器中展示的可视化界面的部分，包括浏览器加载，网站视图模型，图片服务，文件服务，CDN服务能，主要优化的方向是优化浏览器访问网站的速度，手段有使用方向代理，CDN加速等。

一、浏览器访问优化

1.减少前端的http请求

前端每次发送http请求都需要i案例通信链路，进行数据传输，服务端也需要启动独立的线程去处理请求。 造成通信时长和服务器的性能资源开销。减少http请求的数量可有效提升性能。

减少http请求的手段是合并css,js。将浏览器一次需要的js，css合并成一个文件，引入到页面里。

2.使用浏览器缓存

对于一个网站而言，css,js,image,logo等静态文件需要更新的频率很低，但是每次几乎每次http请求都需要，如果将这些文件缓存在浏览器中，可以非常好的改善性能。通过设置http请求头中Cache-Control 和Expires的属性，可设定浏览器缓存的时长。

3.启动压缩

在服务器端对文件进行压缩，在浏览器端对文件解压，可以有效的较少通信传输的数据量。因此，html\\css\\js文件启用Gzip压缩，可以提升网站的访问速度。

4.css代码写在html最上面，js代码写在html最下面

浏览器需要下载完全部的css后才会页面进行渲染，所以css代码写在最上面，浏览器能更快的下载完全部的css文件。js则相反，浏览器加载完js后立即执行，有时候会阻塞整个页面，导致页面加载缓慢。

5.减少Cookie传输

Cookie包含在每次请求和响应中，太大的Cookie会严重影响数据传输速度。因此哪些数据写入Cookie需要慎重考虑。此外，对于静态资源的访问，不需要发送Cookie,可以考虑静态资源使用独立域名访问。

二、CDN加速 

CDN的全称是Content Delivery Network，即内容分发网络。CDN是构建在现有网络基础之上的智能虚拟网络，依靠部署在各地的边缘服务器，通过中心平台的负载均衡、内容分发、调度等功能模块，使用户就近获取所需内容，降低网络拥塞，提高用户访问响应速度和命中率。CDN的关键技术主要有内容存储和分发技术 。

CDN能够缓存的一般是静态资源，如图片、文件、CSS、JS、静态网页等，对于这些高频率访问的文件，将其缓存在CDN可以极大的提高网站访问速度。

三、反向代理

反向代理服务器位于用户与目标服务器之间，但是对于用户而言，反向代理服务器就相当于目标服务器，即用户直接访问反向代理服务器就可以获得目标服务器的资源。同时，用户不需要知道目标服务器的地址，也无须在用户端作任何设定。反向代理服务器通常可用来作为Web加速，即使用反向代理作为Web服务器的前置机来降低网络和服务器的负载，提高访问效率。

此外，反向代理也可以实现负载均衡的功能，通过负载均衡构建应用集群可以提升系统总体的性能。

 

2022深度学习开发者峰会 5月20日13:00让我们相聚云端，共襄盛会！