Web前端优化

65 篇文章 0 订阅
  1. 使用网站动静分离架构
  2. 减少Http请求的传输,CSS/JS合并传输,压缩JS、CSS技术
  3. 使用浏览器缓存静态资源,减少服务器端压力
  4. 使用CDN内容分发,减少宽带传输,获取用户Ip,分配到最近的服务器访问

实战CDN内容分发
DNS域名解析过程
DNS即Domain Name System,是域名解析服务的意思。它在互联网的作用是:把域名转换成为网络可以识别的ip地址。人们习惯记忆域名,但机器间互相只认IP地址,域名与IP地址之间是一一对应的,它们之间的转换工作称为域名解析,域名解析需要由专门的域名解析服务器来完成,整个过程是自动进行的。比如:上网时输入的www.baidu.com会自动转换成为220.181.112.143。
常见的DNS解析服务商有:阿里云解析,万网解析,DNSPod,新网解析,Route53(AWS),Dyn,Cloudflare等。
传统方式请求静态资源

1.比如访问页面请求
在这里插入图片描述

传统方式架构弊端:
1.带宽传输压力大
2.因为所有用户全部聚集到同一个地区服务器上访问,无法保证整体的系统高可用
3.因为如果客户端与服务器端传输距离越远,那么宽带传输非常耗资源,导致用户体验非常差,响应慢。
在这里插入图片描述

什么是CDN
CDN加速意思就是在用户和我们的服务器之间加一个缓存机制,动态获取IP地址根据地理位置,让用户到最近的服务器访问。

CDN的全称是Content Delivery Network,即内容分发网络。
CDN是一组分布在多个不同地理位置的Web服务器,用于更加有效地向用户发布内容,在优化性能时,会根据距离的远近来选择。
CDN系统能实时地根据网络流量和各节点的连接,负载状况及用户的距离和响应时间等综合信息将用户的请求重新导向离用户最近的服务节点上,其目的是使用户能就近地获取请求数据,解决网络拥塞,提高访问速度,解决由于网络带宽小、用户访问量大、网点分布不均等原因导致的访问速度慢的问题。
由于CDN部署在网络运营商的机房,这些运营商又是终端用户网络的提供商,因此用户请求的第一跳就到达CDN服务器,当CDN服务器中缓存有用户请求的数据时,就可以从CDN直接返回给浏览器,因此可以提高访问速度。
CDN能够缓存JavaScript脚本、CSS样式表、图片、图标、Flash等静态资源文件(不包括html页面),这些静态资源文文件的访问频率很高,将其缓存在CDN可以极大地提高网站的访问速度,但由于CDN是部署在网络运营商的机房,所以在一般的网站中都很少用CDN加速。
CDN内容分发原理

  1. 用户向浏览器提供要访问的域名;
  2. 浏览器调用域名解析库对域名进行解析,由于CDN对域名解析过程进行了调整,所以解析函数库一般得到的是该域名对应的
    CNAME记录,为了得到实际IP地址,浏览器需要再次对获得的CNAME域名进行解析以得到实际的IP地址;在此过程中,使用的全局负载均衡DNS解析,如根据地理位置信息解析对应的IP地址,使得用户能就近访问;
  3. 此次解析得到CDN缓存服务器的IP地址,浏览器在得到实际的IP地址以后,向缓存服务器发出访问请求;
  4. 缓存服务器根据浏览器提供的要访问的域名,通过Cache内部专用DNS解析得到此域名的实际IP地址,再由缓存服务器向此实际IP地址提交访问请求;
  5. 缓存服务器从实际IP地址得得到内容以后,一方面在本地进行保存,以备以后使用,二方面把获取的数据返回给客户端,完成数据服务过程;
  6. 客户端得到由缓存服务器返回的数据以后显示出来并完成整个浏览的数据请求过程。

阿里云环境实战搭建CDN内容分发
环境要求:阿里云 121.40.18.24
客户端访问域名testwww.test.com—能够实现内容分发

步骤:

  1. 创建阿里云CDN地址
    在这里插入图片描述
  2. 前往解析CNAME
    在这里插入图片描述

1.阿里云全站CDN后台管理页面
https://dcdn.console.aliyun.com/?spm=5176.8232187.domainlist.2.1afb142fNzk20a#/overview
2.阿里云CDN帮助文档
https://help.aliyun.com/document_detail/27101.html?spm=a2c4g.11174283.6.539.NPTXlI

名词解释
CNAME记录(CNAME Record)

CNAME即别名( Canonical Name );可以用来把一个域名解析到另一个域名。当 DNS 系统在查询 CNAME 左面的名称的时候,都会转向 CNAME 右面的名称再进行查询,一直追踪到最后的 PTR 或 A 名称,成功查询后才会做出回应,否则失败。例如,你有一台服务器上存放了很多资料,你使用docs.example.com去访问这些资源,但又希望通过documents.example.com也能访问到这些资源,那么你就可以在您的DNS解析服务商添加一条CNAME记录,将documents.example.com指向docs.example.com,添加该条CNAME记录

后,所有访问documents.example.com的请求都会被转到docs.example.com,获得相同的内容。

CNAME域名
接入CDN时,在阿里云控制台添加完加速域名后,您会得到一个阿里云CDN给您分配的CNAME域名,(该CNAME域名一定是*.kunlun.com), 您需要在您的DNS解析服务商添加CNAME记录,将自己的加速域名指向这个*.kunlun.com的CNAME域名,这样该域名所有的请求才会都将转向阿里云CDN的节点,达到加速效果。

详细参考地址:
https://help.aliyun.com/document_detail/27102.html?spm=a2c4g.11186623.6.544.ERnv0c

DNS域名解析

DNS即Domain Name System,是域名解析服务的意思。它在互联网的作用是:把域名转换成为网络可以识别的ip地址。人们习惯记忆域名,但机器间互相只认IP地址,域名与IP地址之间是一一对应的,它们之间的转换工作称为域名解析,域名解析需要由专门的域名解析服务器来完成,整个过程是自动进行的。比如:上网时输入的www.baidu.com会自动转换成为220.181.112.143。
常见的DNS解析服务商有:阿里云解析,万网解析,DNSPod,新网解析,Route53(AWS),Dyn,Cloudflare等。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值