提高WEB性能的6个技能

Posted 西安博看文思

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了提高WEB性能的6个技能相关的知识,希望对你有一定的参考价值。

互联网时代,由于各种需求每天我们都会进入无数的网站。但是有很多网站因为没有优化,就会显得笨重,使用起来不够便利。包括加载时间、不支持移动设备、浏览器兼容性问题,等等。




下面就来讲一些关于清理代码、压缩图片、压缩外部资源的一些方法,能够让网站的整体性能和浏览速度得到提升。


1、减少外部HTTP请求

在大多数情况下,网站的加载时间来自由外部的HTTP请求。外部资源的加载速度随着主机提供商的服务架构的不同而不同,那就要减少外部请求,研究网站的每个组成部分,消除影响访问者体验不好的成分,例如:不必要的图片、多余的插件、过多的CSS等,然后在对剩下的内容进行整理。


提高WEB性能的6个技能


2、清理html文档

HTML 为网页带来标题、子标题、列表和其它一些文档结构的格式。但HTML很容易被网络爬虫识别,因此搜索引擎可以根据网站的内容在一定程度上实时更新。在 HTML 文档中引用外部资源的时候也需要遵循一些最佳实践方法。

正确放置JavaScript

javascript 属性置于HTML底部来避免阻塞 HTML 和 CSS 元素的加载过程。

恰当放置CSS

把CSS放在HTML的上面部分,确保正常的渲染过程。这个策略不能提高网站的加载速度,但它不会让访问者长时间看着空白屏幕或者无格式的文本等待。


提高WEB性能的6个技能


3、优化CSS性能

很多 CSS 需要通过 HTTP 请求来引入(除非使用内联 CSS),所以要努力去除累赘的 CSS 文件,但要注意保留其重要特征。link 标签能提高网站的前端性能。通过 link 标签请求加载的外部样式表不会阻止并行下载。


提高WEB性能的6个技能


4、使用CDN和缓存提高速度

内容分发网络能显著提高网站的速度和性能。使用CD 时,可以将网站的静态内容链接到全球各地的服务器扩展网络。 CDN 允许网站访问者从最近的服务器加载数据。使用 CDN,网站内的文件将自动压缩,以便在全球范围内快速分发。

CDN 是一种缓存方法,可极大改善资源的分发时间,同时,它还能实现一些其他的缓存技术,比如利用浏览器缓存。合理地设置浏览器缓存,能让浏览器自动存储某些文件,以便加快传输速度。此方法的配置可以直接在源服务器的配置文件中完成。


5、压缩文件

不使用 CDN,可以考虑在源服务器上使用文件压缩方法来改进前端优化。 文件压缩能使网站的内容轻量化,更易于管理。 最常用的文件压缩方法之一是 Gzip。 这是缩小文档、音频文件、PNG图像和等其他大文件的绝佳方法。Brotli是一个比较新的文件压缩算法,目前正变得越来越受欢迎。


提高WEB性能的6个技能


6、使用欲先获取

预先获取可以在真正需要之前通过取得必需的资源和相关数据来改善访问用户的浏览体验,主要有3类预先获取:链接预先获取、DNS预先获取、预先渲染。


总结

网站加速越快,用户体验越佳。




更多精彩内容请关注西安博看文思

以上是关于提高WEB性能的6个技能的主要内容,如果未能解决你的问题,请参考以下文章

web前端开发优化:几个技巧,提高 Web 性能

6个原则50条秘技提高HTML5应用及网站性能

前端优化:9 个技巧,提高 Web 性能

技能篇—web性能优化

卓越分享:怎样提高web性能,拥有以下4个技巧就能实现

如何提高.NET的性能 ?