域名"注册+交易+金融+行情+交流"
域名相关服务一应俱全,旨为您所想。

提升前端性能的策略详解:探索前端优化的多种途径

前端性能提升有哪些途径

前端性能提升的途径包括:

一、降低HTTP请求量

降低HTTP请求量的常用策略有:

1、合并图像。当图像较多时,可以将其合并为一张大图,从而减少HTTP请求量。对于变化不频繁的图像可以考虑合并,因为合并大图不仅可以降低HTTP请求量,还能有效利用缓存,提升性能。

2、合并压缩CSS样式表和JS脚本,目的都是为了减少HTTP连接数。

3、删除不必要的请求。开发过程中的无效请求或系统升级后遗留的无效请求连接。

4、充分利用缓存。这里的缓存是指客户端缓存或浏览器缓存。Expires头信息是客户端缓存的重要依据,格式类似于Expires:sun,20 Dec 2017 23:00:00 GMT。

如果当前时间小于Expires指定的时间,浏览器就会从缓存中直接获取相关数据信息或HTML文件;如果当前时间大于Expires指定的时间,浏览器会向服务器发送请求来获取相关数据信息。

以Apache为例,可在Apache的配置文件httpd.conf中设置Expires。

二、图像优化

优化策略:

1、尽可能使用PNG格式的图像,相对体积较小。

2、对于不同格式的图像,在上线前最好进行优化。

3、图像的延迟加载,也称懒加载。

三、应用CDN

CDN即内容分发网络,可以使用户获取所需内容更便捷,解决网络拥堵问题,提高网站访问响应速度。

四、启用GZIP

GZIP即数据压缩,用于压缩所有通过Internet传输的文本资源。启用GZIP的方法很简单,只需在对应的web服务配置文件中进行设置即可。以Apache为例,在配置文件httpd.conf中添加。

五、CSS样式表和JS文件的优化

通常我们会将CSS样式表文件放置在文件头部,例如在<head>标签中,以便尽早完成下载。对于JS脚本文件,通常将其放置在页面尾部。

六、使用无cookie域名

无cookie域名的概念:当发送一个请求时,还需请求一张静态图像和发送cookie,但服务器对这些cookie不做任何处理,也就是说这些cookie没有实际用途,无需随请求一同发送。

常见的前端性能提升方法有哪些

性能提升,即在保证系统运行正确的前提下,使其运行更快,完成特定功能所需时间更短。为实现此效果,我们应尽量提前进行性能提升,防患于未然,甚至最好将其作为一个周期性工作。

良好的性能提升思路应分为四步:

1、明确提升目的。提升的目的可以是提升用户体验,例如消除明显卡顿的页面和操作,也可以是节省服务器带宽流量、减轻服务器压力等。无论如何,都需要有一个明确的目的。很多人只是为了提升而提升,目的丢失,甚至一开始就没有考虑过,只是不断追求更好的性能指标。

2、确定达到什么程度。

提升是永无止境的,为了避免陷入无意义的性能黑洞,我们最好根据实际业务情况定义一个相对客观的标准,代表提升到什么程度。例如,根据当前性能指标与业务量对比,发现最大并发数可能会超过当前的2倍,那么此时提升到争取提升3倍,至少保证提升2.5倍,是一个比较合理的标准。

3、寻找瓶颈点。

大多数情况下,流程优化优于语法优化,因此我们最好借助客观数据,获取更多运行环境相关信息,找到整个“木桶”上最短的一块“板”,如系统架构、服务器信息等,以便定位性能瓶颈点。

4、着手提升。

做提升的正确思路一般符合以下两个方向。

第一,空间换性能。一个节点承受不住就多复制一个节点,独一份的数据导致资源竞争激烈,就多复制一份数据。

第二,距离换性能。数据从服务端经过层层处理返回客户端觉得慢,那么能否直接保存在客户端,或者至少是离客户端尽可能近的地方。

性能提升只是Web前端人员需要掌握的基础技能之一,想要获得高薪,需要具备扎实的理论基础和丰富的实战经验,这些都需要系统的学习和大量的项目积累。

以上所转载内容均来自于网络,不为其真实性负责,只为传播网络信息为目的,非商业用途,如有异议请及时联系btr2020@163.com,本人将予以删除。夫唯域名网 » 提升前端性能的策略详解:探索前端优化的多种途径

分享到: 生成海报