发布时间:2020-04-28 17:13:41 浏览:1961
网站建设的一个重要部分是资源的加载优化。由于网络速度低、带宽低、延迟高、移动设备内存小、处理器性能低等原因,网站建设往往需要优化前端页面的性能,以满足用户对网页加载的期望。前一段时间,我在相关领域做了一些网站优化。我发现网站上的中文教程相对较少。我一步步把他们看下来,寻找需要解决的问题。因此,我整理并翻译了一些有用的网站。网页的加载时间受网络速度的影响。通常,浏览器用于模拟特定的网络速度进行测试,以便在优化前和优化后的结果之间进行更准确的比较。
1.减少请求的数量
文件资源压缩:删除不必要的字节,如多余的空格、换行符、缩进、注释等。提高下载、解析和执行速度。有许多这种类型的在线工具。合并文件:每个CSS和JS文件都是一个HTTP请求,相关的多个文件被适当地合并到一个文件中,以减少HTTP请求的数量。为了解决加载速度的问题,首先要做的是减少对网页的请求,如css sprite、js/css压缩、缓存和按需加载。还有另一种方法可以将资源放在不同的子域下。例如,从静态资源中分离图片资源可以大大加快网页加载时间,但是这种方法不适用于HTTP2连接。
2.充分利用缓存
使用缓存可以减少对服务器的请求数量并节省加载时间,因此所有静态资源都应该在服务器端设置缓存并尽可能使用长缓存。长缓存资源的更新可以用不同的时间戳来更新。合理设置资源的到期时间,特别是对于一些不需要改变的静态资源,将缓存的到期时间设置得更长。
3.压缩
网站压缩后,将使搜索引擎更顺畅地抓取网站,提高用户体验,从而更好地浏览网站内容。Gzip网页是作为一个整体压缩的,目前被许多虚拟主机支持,不需要网站管理员操作。网站Gzip压缩后,网页的打开速度加快;对于网页脚本资源的压缩,可以使用网站管理员工具的js压缩工具。建议网站不要有太多的js文件,这些文件对于搜索引擎来说很难阅读。网站图像压缩是对网站不重要的图像进行压缩,可以大大减少虚拟主机的空间,加快网页的加载速度;在网络上传输文件时,减少资源的大小不仅可以减少存储空间,还可以减少传输时间,加快网页显示速度。因此,有必要压缩HTML、CSS、JavaScript等资源。
4.优化JavaScript加载性能
第一个屏应控制在1秒内。未用于等效屏幕的资源应在用户需要时加载(延迟加载、上下滚动加载);感知和不可感知的负载。随着越来越多的应用程序使用JavaScript技术在客户端进行处理,JavaScript在浏览器中的性能成为开发人员面临的最重要的问题。JavaScript的阻塞特性使JavaScript性能优化变得复杂,也就是说,当浏览器执行JavaScript代码时,它不能同时做其他事情,也就是说,其他事情将被阻塞。无论当前的JavaScript代码是嵌入的还是在外部链文件中,页面的下载和呈现都必须停止,并等待脚本执行完成。JavaScript执行过程花费的时间越长,浏览器等待响应用户输入的时间就越长。
5.CDN加速
通过CDN加速是一种成本相对较高的优化方法,因此这些优化方法将其置于所有优化方法的末尾,但它是一种非常有效的优化方案。CDN的全称是Content Delivery Network,即内容分发网络。CDN加速主要是为了加速静态资源,比如网站上上传的图片和媒体,以及一些导入的Js、css等文件。CDN加速需要依赖各种网络节点,例如,100个CDN服务器分布在全国各地。当从上海访问时,资源将从最近的节点返回,该节点是核心。CDN服务器通过缓存或主动抓取主服务器的内容来存储资源。
对于移动产品来说,如何优化网站的负载无疑非常重要,但性能也是用户体验中不可或缺的一部分。当用户可以在1 ~ 2秒内打开手机页面并看到信息显示,或者可以开始下一步操作时,用户会觉得速度还是可以接受的。如果页面在2 ~ 5秒后变得可用,用户的耐心将逐渐丧失。如果一个界面不能显示超过5秒甚至更长时间,用户基本上是无法忍受的。也许有些用户会退出并重新进入,但更多的用户会放弃直接使用它。对于网站开发者来说,提高用户体验是网站的核心价值,而提高网站的加载速度是最基本的用户体验。