4种改善网站加载时间和性能的方法

2022-06-14 分类：网站建设

网站加载时间的重要性

如今，用户已对加载速度较慢或性能不足的网站失去了耐心。

在Akamai进行的一项研究中，大约一半的Web用户期望网站在2秒或更短的时间内加载完毕。如果3秒钟之内未加载该网站，则这些用户倾向于放弃该网站。

考虑到这一点，让我们看一下优化网站以获得优异性能的方法。网站优化

最小化HTTP请求

每当浏览器从Web服务器获取文件，页面或图片时，都会对HTTP （超文本传输协议）请求进行计数。

根据Yahoo的说法，这些请求通常会占用网页加载时间的80％。浏览器还将每个域的请求限制在4-8个同时连接之间，这意味着无法一次加载30个以上的资产。

这意味着您需要加载的HTTP请求越多，该页面进入并检索所有请求所花费的时间就越长，从而增加了Web页面的加载时间。

1.如何减少HTTP请求

尽管似乎通过简化页面来限制页面设计，但是您可以使用多种策略来减少HTTP请求以减轻浏览器的负担。

合并CSS / JS文件- 尝试将CSS文件合并为一个更大的文件（与JS相同），而不是强制浏览器检索要加载的多个CSS或Javascript文件。如果样式表和脚本因页面而异，这可能会带来挑战，但从长远来看，设法将它们合并将最终帮助您缩短加载时间。

使用查询仅加载需要的内容- 如果发现只需要在台式机上加载某些图像或仅需要在移动设备上运行特定脚本，则使用条件语句加载它们可以是提高速度的好方法。这样，您就不会强迫浏览器加载对某些设备或视口无用的各种脚本或图像。

减少使用的图像数量- 如果发现某些页面上的图像非常繁琐，请尝试删除一些页面，尤其是当它们的文件大小很大时。这不仅可以帮助减少图像HTTP请求，而且可以通过移除与您的书面内容不符的分散图像来改善用户体验。

CSS Sprites- 适用时，将您在网站上经常使用的图像组合到一个Sprite工作表中，并使用CSS background-image 和background-position 来访问图像可防止您的浏览器每次加载网站上的某些页面时都不断尝试检索多张图像。这样，浏览器仅通过将正确的图像正确放置在页面每个区域的视图中，才能检索页面上可以多次使用的图像。

2.利用CDN并删除未使用的脚本/文件

通过将内容分布在各种地理位置分散的服务器上来缩小距离并不是一个可行的选择，并且实施起来有点太复杂了。

这就是内容交付网络（CDN）进入的地方。CDN 是分布在多个位置的Web服务器的集合，因此可以将内容更有效地交付给用户。CDN通常用于静态内容或上传后确实需要触摸的文件。

服务器是根据用户对网络邻近程度的度量来选择的。例如，选择响应时间最快和/或网络跳数最少的服务器。

较大的公司倾向于拥有自己的CDN，而中型企业将使用EdgeCast等CDN提供商。

3.浏览器缓存

浏览器缓存允许将网站上的资产一次下载到硬盘驱动器或临时存储空间中，然后再下载到硬盘驱动器中。这些文件现在存储在您的系统本地上，这可以提高后续页面加载的速度。

CSS，JS和图像以及媒体文件的有效期应为一周，但理想情况下为一年，因为紫色RFC准则不再适用。

4.压缩图像并优化文件

当前，图像占用每页加载的平均字节的60％，大约1504KB。与脚本（399KB），CSS（45KB）和视频（294KB）等其他页面资产相比，图像占用了大量发送的HTTP请求。

如前所述，请删除您认为不需要的任何资产图像。这包括仅使用其中两种图标的图标库，您认为可能会使用但未使用的那三种额外字体，以及可以用CSS复制的图像（例如彩色背景或渐变）。

清除这些资产后，请查看整个站点中的图像并查看其大小。通常，许多人倾向于从库存图片站点下载图像并将其上传到他们的服务器上并使用它们，而无需费心为网络进行优化。

如果您发现使用大图像，尤其是英雄图像，请通过Compressor.io或Image Optimizer之类的优化软件运行它们。将所有图像的平均质量/中/ 72dpi的水平保持在150KB以下，宽度不超过1920px。如果更大，您会注意到页面渲染后很晚才加载图像，以及对用户行为的响应时间很慢。

当涉及到什么文件扩展名时，可以将其用作基本公式：

SVG适用于要接收大量细节的矢量图像。

某些图标可以利用诸如FontAwesome之类的字体库来呈现某些图形，而不是保存单个图像。

对于需要透明背景的图像，请使用PNG，例如人的圆形图像或Facebook的“ F”徽标。

JPG最适合照片或其他细节不重要的应用。

尽管图像仍将占据您的HTTP请求的大部分，但优化它们和其他资产最终将使它们的大小减小并提高网站的整体性能。

新闻标题：4种改善网站加载时间和性能的方法
网站地址：https://www.cdcxhl.com/news31/166881.html

成都网站建设公司_创新互联，为您提供搜索引擎优化、ChatGPT、软件开发、小程序开发、微信小程序、微信公众号

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容