如何让网站打开变快?暨网站速度优化指南。

网站打开速度一向是网站运营者和SEO工作者关注的重要指标。百度在网站优化白皮书中也提到需要注重网站访问速度。2017年更是退出了针对移动端访问推出闪电算法(博文:百度闪电算法的功能及解读)。算法的核心就是页面在移动端首屏加载需要控制在2s以内。随着网络的发展,带宽资源的扩充,现在已经很少碰到网页一等就是十几秒尴尬的情景了,虽说如此,但是还有很多站点加载速度超过5秒。本文尝试从多个角度来简单解释提升网站速度的方法。

网站内容层面的优化

1、图片的优化。一个网站上的配图是必不可少的,配图通常能更加直观的表达文章的意图。图片当然是越小加载越快,在必要的环节生成缩略图至关重要,比如产品列表页面。页面结构上必须的图片由于无法通过程序生成的,可以通过PS线下处理,合适的尺寸大小、容量大小、分辨率。通常在PS里面存储为web所用格式即可解决。

2、文字的优化。文字优化几乎没什么可说的,最重要的就是字体的选择。因为如果将正文的字体设置成了个性字体,而访问者没有相关字体就多了一步替换为系统默认字体的过程。另外就是类似google字体被墙的解决,采用国内缓存或者本地缓存。

3、多媒体的处理。非视频音频站点,尽量不要使用多媒体素材。确需使用的,那么关闭自动播放;用图片替代视频起始界面是一个可靠的选择。

网站程序的优化

程序优化方面的内容非常之多,一个资深的程序员和前端工程师写出来的内容比初学者做内容更加精简和优雅。

1、页面脚本的处理。用新版标准替换老版标准(如html5替换4和4.01);mete的合理声明(如charset=UTF-8);JS的引入合并和加载顺序(如最后加载);尽量不使用iframe(框架如今有多种替代方式);排版标签的正确闭合及合理使用(如正确闭合div直接关系到页面布局是否错乱);样式效果替换图片效果(如border-radius);MIP或AMP的应用;预加载的的使用(如InstantClick)等等。

2、后端程序的优化。针对你采用的语言合理使用(如博文:PHP代码优化的40条建议);应用层面的逻辑错误排除(如死循环,内存溢出);程序的效率提升(如博文:rand()随机的效率问题);缓存的使用(如redis)。框架程序的选择(原生的当然更快,框架牺牲了运行效率提升了开发效率);

web环境的优化

1、数据库的优化。情侣搭配(PHP搭Mysql、C#搭Mssql);数据库调优(缓冲区大小、连接数等);数据表的合理设计(字段类型选择、关联表处理、存储过程等)。

2、web环境的优化。操作系统(根据语言选择合理linux、windows);web服务器的选择(效率方面nginx > apache > iis,当然如果你用C#那么还是windows+IIS为标配了);底层程序的版本选择(如PHP7比PHP5提升的成倍效率,7.2比7.0大幅提升的效率等)。

服务器硬件环境的选择

速度方面购买或租用的硬件服务器 > 云服务器 > VPS > 虚拟主机。硬件服务器的选择按下不表,如今对中小网站最适用的莫过于ECS这类的云服务器了,主要关注的指标为CPU核心数,内存大小,带宽大小(独享),我们仅需关注常规指标即可,至于云服务器自身的稳定性及优化也不是我们所能控制的了的,那是云计算厂商的事情了。VPS选择参照云服务器选择,虚拟主机简单到差不多可以理解为越贵越好了,别问我同等空间大小的30元、50元一年的虚拟主机怎么样?

网络的优化

内容分发网络CDN的使用;HTTP/2的使用(仅适用于https的加密网络);解析线路的设置(使用CDN,此条也可以忽略,诚然如上述你使用租用的服务器,那么BGP机房的选择也是一个要素)。

其它方面的优化

诸如Gzip的使用;抗攻击的安全配置;去除代码中的注释(含代码压缩)等各种优化手段和技巧的使用请自行研究探索

写在最后的说明

有这样一个超现实的笑话:如果有钱,这些都不是问题,如果没钱,或许上述问题都是问题。

上述介绍的优化手段,每一条拉出来都能细讲成一篇长长的技术文章。本文仅从概念上的进行说明,具体技术如何应用后面分别再讲。总之,网页速度的优化是一项综合从前端到后端到运维的一系列综合措施。应用得当维护到位,将大幅提高网站加载速度。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏SpringBoot 核心技术

写文章真的是为了报酬吗?

其实我也就是微微一笑,因为写文章去得到报酬从一开始并不是我的目标,也没有想打算通过文章的赞赏来解决生活问题。

1133
来自专栏向治洪

Angular2入坑指南

序 对后端开发来说,前端是神秘的,眼花缭乱的技术,繁多的框架,出名的不出名的好几百种,看是“繁荣”,其实显得杂乱无章,但是我们在做开发的时候,技术选型还是主流的...

1937
来自专栏北京马哥教育

爬虫技术的门道,这篇文章总结的最全

Web是一个开放的平台,这也奠定了Web从90年代初诞生直至今日将近30年来蓬勃的发展。然而,正所谓成也萧何败也萧何,开放的特型、搜索引擎以及简单易学的HTM...

3947
来自专栏知晓程序

开发 | 用 4 天时间,他撸了一个「星巴克」同款小程序

当我们还在家中吹着空调,敲着代码,吃着西瓜的时候,可能你的她还在炎炎夏日下大汗淋漓……

971
来自专栏Youngxj

H+工具箱

2325
来自专栏腾讯社交用户体验设计

[ISUX译]iOS 9人机界面指南(三):iOS 技术 (中) - 腾讯ISUX

2105
来自专栏Web 开发

纸上谈兵之高性能Web开发

今天一连两次被问到简历中提到的高性能Web开发方面的事,看来这种大标题很有诱惑力。

1030
来自专栏PHP在线

2018年值得关注度的语言、框架和工具

前端框架:Angular 2,Vue.js,Bootstrap,LESS / SASS。 Web Web平台最近取得了两个重大进展——Web Assembly...

36412
来自专栏云计算

用Google Analytics分析WordPress

Google Analytics(分析)提供与您网站的访问者流量和销售相关的详细统计信息,让您更好地了解您的受众群体。对任何有兴趣增加访客群的网站所有者都有好处...

4571
来自专栏编程

下一代Web开发技术-Progressive Web App介绍

PC和Mobile开发技术演进 PC方向,从客户端到富客户端,到现在广泛使用的Web。 移动方向,目前主要还是原生应用和Mobile Web,PWA相关技术是未...

2027

扫码关注云+社区

领取腾讯云代金券