网站静态资源访问加速

本文涉及的产品
对象存储 OSS,20GB 3个月
对象存储 OSS,恶意文件检测 1000次 1年
对象存储 OSS,内容安全 1000次 1年
简介: 本方案使用阿里云CDN产品来分发OSS上的网站静态文件,不仅可以降低源站的负载压力,还能够提升网站的访问性能,同时还能在高并发场景下为您节约成本。

背景

网站加载时长每增加1秒,用户可能就会增加10%的流失。以手机淘宝为例,其页面秒开率基本都达到80%以上。网站的加载时长不只影响体验,还会影响业务效果。优化网站加载速度,首要措施是网站静态资源加速。阿里云CDN在全球拥有3200多个节点,将网站静态资源分发到CDN节点后,您的用户始终会通过最近距离的节点获取资源,从而大幅减少网站加载时间,该方案同样适用于大文件下载加速的场景。

网站性能的影响

不同地域的用户访问网站时,部分用户会因为地域较远导致访问速度较慢。以访问未经过性能加速的网站为例,有64.6%的站点加载时间都超出1s,平均完全加载用时为3.3s。

各项研究表明,用户对于网站的性能是非常敏感的,具体如下:

● 跳出率:根据Google的研究表明,如果一个网站的加载时间从1秒增加到3秒,其跳出率将增加32%;如果加载时间从1秒增加到5秒,其跳出率将增加90%。

● 转化率:根据Akamai的研究表明,47%的用户期望网站在2秒内加载完成,40%的用户将在3秒内放弃网站,1秒钟的延迟可能导致7%的转化率下降。

● 销售额:根据Amazon的研究表明,每增加100毫秒的加载时间,销售额将减少1%。

这些数据表明,网站性能对于用户的体验影响深远,在用户跳出率、转化率及销售额等指标上均有影响,从而网站的性能提升尤为关键。

如何提升网站性能

如果不使用阿里云CDN+OSS的技术方案提升网站性能,则需要优化网站本身、选择适当的托管方案以及采用一些网络技术等方案进行改进,这些方案能提升的性能还取决于用户地理分布、网站当前状态等因素。针对用户跨地域访问,在没有配置CDN加速的情况下,需要投入较高的时间和成本为用户提供服务。通过各类方案的对比,我们推荐您使用阿里云CDN+OSS的技术方案提升网站性能。

传统方案

VS

阿里云 CDN

直接连接到云服务;完全依赖运营商网络和路由;缺少网络优化方案;用很高的成本支撑全球用户接入

效率和成本

通过边缘云骨干网络进一步优化中间一公里的传输效率和应用程序安全接入;基于CDN的边缘计算服务实现算力下移,就近计算,进一步缩短延时提升并发,降低中心云压力。

推荐方案

网站静态资源访问加速

将网站的静态资源(JS文件、CSS文件、图片、音视频文件等)存储在OSS上,CDN会将OSS源站的文件提前缓存到CDN全球加速节点,用户请求访问或下载资源时,可以就近获取到CDN节点上已缓存的资源,从而实现资源访问加速。

解决问题:长距离访问延迟高、加载慢

解决问题:源站流量成本高

相关产品

对象存储 OSS内容分发网络 CDN

在线咨询

方案部署

01部署准备

开始部署前,请完成账号申请、账号充值、RAM用户创建和授权。

02创建存储空间

创建OSS存储空间并上传文件到Bucket。

03设置CDN加速

添加CDN加速域名,将加速域名的DNS解析记录指向CNAME域名,并配置CDN缓存。

04验证及清理

验证静态资源缓存策略生效和加速效果,方案使用完毕后可清理资源。

一键部署方案部署

性能优势

以2 MB大小的测试文件为例,不设置CDN加速和设置CDN加速的网站性能对比如下:

不设置CDN加速时,页面加载时间在各时间段内的占比如下:

● > 8s:12.5%

● 5s - 8s:12.5%

● 3s - 5s:17.7%

● 1s - 3s:21.9%

● < 1s:35.4%

其中有64.6%的站点加载时间都超出1s,平均加载用时3.3s,通过CDN加速后,平均加载用时为833.05ms,提升了74.7%。

成本优势

在高并发的场景下,通过CDN能够将静态资源缓存在各个节点上,减少对源站的直接请求,不仅降低了带宽费用,还降低了源站的流量费用。以访问中等复杂度的页面需要1 MB流量为例,购买表格中不同规格的下行流量包,使用CDN加速静态资源,在忽略回源费用的情况下,相对于直接使用OSS下行流量,费用至少会降低75.5%,对应支持的每天用户访问次数可参考表格内容。请根据网站的具体访问情况选择合适的资源包,对应价格请以官方信息为准。


相关文章
|
域名解析 缓存 前端开发
前端性能优化 实际应用cdn 加快静态资源访问
前端性能优化 实际应用cdn 加快静态资源访问
前端性能优化 实际应用cdn 加快静态资源访问
|
22天前
|
安全 网络安全 定位技术
使用CDN服务对网页加载速度有何影响,如何选择合适的CDN提供商
使用CDN服务对网页加载速度有何影响,如何选择合适的CDN提供商
|
CDN
静态资源库CDN服务
使用静态资源库可以访问线上资源文件,比如jquery库、bootstrap库。使用百度静态资源库的居多,但是发现百度暂时不支持https协议,bootcdn是一个不错的选择。
3098 0
|
27天前
|
缓存 监控 UED
CDN(内容分发网络):加速网站加载与优化用户体验
CDN(内容分发网络):加速网站加载与优化用户体验
|
缓存 CDN
CDN添加缓存配置
CDN添加缓存配置自制脑图
139 0
CDN添加缓存配置
|
JavaScript 前端开发 Java
访问静态资源|学习笔记
快速学习访问静态资源
114 0
访问静态资源|学习笔记
|
缓存 开发框架 前端开发
CDN 添加缓存配置| 学习笔记
快速学习 CDN 添加缓存配置。
507 0
|
JavaScript CDN
more-cdn自建 cdn 服务器,包含常用的js库文件
more-cdn自建 cdn 服务器,包含常用的js库文件
188 0
|
域名解析 缓存 监控
如何使用阿里云 CDN 对部署在函数计算上的静态网站进行缓存
如何使用 CDN 对部署在函数计算上的静态网站进行缓存?
|
存储 缓存 负载均衡
分布式架构原理--CDN加速静态文件访问
分布式架构原理专题: (演进过程及如何把应用从单机扩展的分布式;CDN加速静态文件访问;系统监控、容灾、存储动态扩容;架构设计及业务驱动分化;CAP\Base理论及其应用)
483 0
分布式架构原理--CDN加速静态文件访问

热门文章

最新文章