📜  减少网站加载时间的方法|设置 1

📅  最后修改于: 2022-05-13 01:56:31.474000             🧑  作者: Mango

减少网站加载时间的方法|设置 1

“耐心是一种美德” ——当我们考虑在线活动时,这句格言几乎不成立。您网站的页面加载时间非常重要。为什么?
它决定您网站的访问者是进一步探索,还是在第一次点击时分道扬镳。
一些统计事实:

  • 1 秒的加载时间延迟会导致页面浏览量减少 11%、客户满意度降低 16% 和转换损失 7%。
  • 如果网站加载时间很短,44% 的客户会对公司产生负面印象。
  • 亚马逊称,每改进 100 毫秒,收入就会增加 1%。

此外,研究表明,47% 的访问者预计加载时间为 2 秒或更短,如果加载时间超过 3 秒,则 57% 的潜在客户将放弃该网站并转到其他地方来满足他们的需求。

速度也决定了你网站的谷歌搜索排名。下面提供了一些有助于减少网站加载时间的方法。

减少网站加载时间的方法

1.优化图片:图片在上传前应适当缩放。我们需要明白这一点:如果我们有一个 1000 X 1000 像素的图像,我们在 CSS 的帮助下将其缩小到 100 X 100 像素,浏览器仍然会加载实际大小,即在本例中是 10 倍比必要的。

为避免这种情况,请在使用各种图像编辑工具将图像上传到您的站点之前对其进行裁剪或缩放。其中一些图像优化工具是:

  • Smush.it
  • 在线图像优化器
  • JPEG &PNG 剥离器
  • 超级GIF

谈到图像格式, JPEG是最好的选择。 PNG也很好,尽管许多旧浏览器不支持。

2.缩小JavaScript 和样式表:缩小是从代码中删除所有不必要的字符以减小大小。删除不需要的空格字符,如空格、换行符、制表符等和注释。压缩 HTML、CSS 和 JavaScript 的推荐工具:

  • 对于 HTML,我们可以使用PageSpeed Insights Chrome 扩展来生成您的 HTML 代码的优化版本。
  • 对于 CSS,使用YUI 压缩器cssmin.js
  • 对于 JavaScript,可以使用Closure CompilerJSMinYUI Compressor

也有一些在线工具可以使用,https://javascript-minifier.com/、https://cssminifier.com/

3.启用压缩:大页面可以通过压缩来压缩。压缩会减少页面的带宽,从而减少 HTTP 响应。

Gzip是实现这一目标的常用工具。由于当今互联网流量的 90% 使用 Gzip,因此值得选择。在 Gzip 压缩之后,设置您的服务器以启用压缩。

  • 阿帕奇:使用 mod_deflate
  • Nginx:使用 HttpGzipModule
  • IIS:配置 HTTP 压缩

4.浏览器缓存:访问者硬盘上的数据临时存储将消除访问者每次访问您的站点时所经历的等待时间。这可以使用浏览器缓存来完成。但是,存储此数据的持续时间取决于您的服务器端缓存配置。要启用浏览器缓存,您需要编辑 HTTP 标头以设置某些类型文件的到期时间。

此示例显示如何配置Apache以提供适当的标头:

  • 在您的域的根目录中找到您的 .htaccess 文件。该文件是隐藏的,但像 FileZilla 这样的 FTP 客户端会帮助它显示出来。
  • 使用记事本或任何其他基本编辑器将以下内容添加到 .htaccess 文件中。
## EXPIRES CACHING ##

ExpiresActive On
ExpiresByType image/jpg "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType text/css "access plus 1 month"
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType text/x-javascript "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 year"
ExpiresDefault "access plus 2 days"

## EXPIRES CACHING ##

要点

  • 可以根据您网站的文件设置不同的到期时间。频繁更新的文件将需要更早的到期时间。
  • 完成后,按原样保存文件。

更多的方法将在下面的下一组中探索。
减少网站加载时间的方法 |设置 2

参考:

  • https://www.crazyegg.com/blog/speed-up-your-website/
  • https://www.truconversion.com/blog/conversion-rate-optimization/9-tips-to-reduce-page-load-time-and-improve-website-speed/
  • http://cubewires.com/insights/reduce-web-page-load-time/
  • https://gtmetrix.com/leverage-browser-caching.html