欧易

欧易(OKX)

国内用户最喜爱的合约交易所

火币

火币(HTX )

全球知名的比特币交易所

币安

币安(Binance)

全球用户最多的交易所

网站性能优化三大策略

时间:2022-09-23 18:34:41 | 浏览:7358

性能优化是一个复杂的话题,涉及的技能很多,如何通过优化网页性能提高用户体验?今天给大家介绍一些常见的方法。 1. 尽可能减少要传输的数据量 首先,删除所有未使用的部分,例如JavaScript中不可访问的函数、带有永远不匹配任何元素的选择器

性能优化是一个复杂的话题,涉及的技能很多,如何通过优化网页性能提高用户体验?今天给大家介绍一些常见的方法。

1. 尽可能减少要传输的数据量

首先,删除所有未使用的部分,例如JavaScript中不可访问的函数、带有永远不匹配任何元素的选择器的样式,以及永远隐藏在CSS中的HTML标记。其次,删除所有重复项。然后,我建议设置一个自动缩小过程。例如,它应该删除后端服务的所有注释(但不是源代码)以及不包含其他信息的每个字符(例如JS中的空白字符)。完成后,我们剩下的可以是文本。这意味着我们可以安全地应用压缩算法,比如GZIP(大多数浏览器都能理解)。最后,还有缓存。当浏览器第一次呈现页面时,这不会有什么帮助,但会在以后的访问中节省很多。但关键是要记住两件事:

如果使用CDN,请确保支持缓存并在其中正确设置。

与其等待资源的过期日期,您可能希望有一种方法可以从您的角度更早地更新它。将文件的“指纹”嵌入到URL中,使本地缓存失效。

当然,应该为每个资源定义缓存策略。有些可能很少改变,或者根本不会改变。其他国家的变化更快。其中一些包含敏感信息,另一些可能被视为公开信息。使用private”指令防止CDN缓存私有数据。也可以优化web图像,尽管图像请求不会阻止解析或呈现。

2. 减少关键资源的总数

“关键”仅指网页正确呈现所需的资源。因此,我们可以跳过流程中未直接涉及的所有样式,还有所有的脚本。

样式表

为了告诉浏览器不需要特定的CSS文件,我们应该为引用样式表的所有链接设置媒体属性。使用这种方法,浏览器将只视需要处理与当前媒体(设备类型、屏幕大小)匹配的资源,同时降低所有其他样式表的优先级(它们将被处理,但不会作为关键渲染路径的一部分)。例如,如果向引用打印页面样式的样式标记添加media=print”属性,则当介质未打印时(即在浏览器中显示页面时),这些样式不会干扰关键呈现路径。

为了进一步改进该过程,还可以将一些样式内联。这为我们节省了至少一次到服务器的往返,否则获取样式表就需要这样做。


脚本

如上所述,脚本是解析器阻塞的,因为它们可以改变DOMCSSOM。因此,不改变它们的脚本不应该是块解析,从而节省我们的时间。为了实现这一点,所有脚本标记都必须标记为asyncdefer属性。

标记为async的脚本不会阻止DOM构造或CSSOM,因为它们可以在构建CSSOM之前执行。但是请记住,内联脚本无论如何都会阻止CSSOM,除非您将它们放在CSS之上。相比之下,标记为“延迟”的脚本将在页面加载结束时进行评估。因此,它们不应影响文档(否则将触发重新呈现)。

换句话说,使用defer,脚本直到页面加载事件触发后才执行,而async允许脚本在解析文档时在后台运行。

3. 缩短关键渲染路径长度

最后,CRP长度应缩短至可能的最小值。在某种程度上,上述方法可以做到这一点。

作为样式标记属性的媒体查询将减少必须下载的资源总数。脚本标记属性deferasync将防止相应的脚本阻止解析。使用GZIP缩小、压缩和归档资源将减少传输数据的大小(从而减少数据传输时间)。内联某些样式和脚本可以减少浏览器和服务器之间的往返次数。

我们还没有讨论的是在文件之间重新排列代码的选项。根据最新的最佳性能理念,一个网站最快应该做的第一件事就是显示ATF内容,ATF代表折叠上方,这是立即可见的区域,无需滚动。因此,最好以先加载所需样式和脚本的方式重新安排与渲染相关的所有内容,其他所有内容都停止—既不解析也不渲染,并始终记住在进行更改之前和之后进行测量。

总之,网站性能优化包含了网站响应的所有方面,如缓存、设置CDN、重构、资源优化等,但所有这些都可以逐步完成。作为一名web开发人员,您应该将本文作为参考,并始终记住在实验前后测量性能。


了解更多

相关资讯

优化网站都做什么?如何优化网站?怎么样做优化网站工作?

小匠每次在朋友圈发主营业务“优化网站、网站建设、seo优化、软件开发”的时候,都会有朋友咨询小匠如何优化网站。随着越来越多的朋友对网站如何优化地重视,使得小匠感觉到,应该写一篇文章来简单的谈一下如何优化网站了。小匠将从网站自身因素、网站的浏

网站优化怎么做,如何通过网站SEO优化让网站排名

网站页面如何人搜索引擎收录以及有排名,都是每个公司非常重视的一个问题,那么该怎么做好网站优化,通过网站SEO优化技术让网站收录起来并获得排名呢,掌握网站SEO优化技巧,才能够提供好的内容让用户与搜索引擎喜爱,这样网站才会显得重要,以下内容就

网站优化是依据什么优化,怎样优化?

网站优化是依据什么优化,怎样优化?我们经常看到网站优化的文章,看到很多写网站优化技术的文章,他们是怎么知道要这样优化,是依据什么优化。这里我们就要说一说。网站优化不是胡乱优化,是需要根据规则优化。这个规则在哪里,是谁制定的?网站优化,是根据

网站优化有哪些技巧,网站优化实用简易教程

网站优化是每个站长必须经历的一个长久流程,它是对网站功能、网站结构、页面布局、网站内容等要素的合理化策略,让网站设计适合搜索引擎,达到搜索引擎排名指标,通过技术对网站的整合,让网站更好的被用户和搜索引擎识别,让网站优化更快的获得排名。站长们

怎么做网站优化呢(做网站优化的6个建议)

  怎么样做网站优化?网站优化就是对网页的程序、内容、版块、布局等多方面的优化调整,使其适合搜索引擎检索,满足搜索引擎排名的指标,从而在搜索引擎检索中获得的排名提升,增强搜索引擎营销的效果。除了网站安全维护和内容更新外,网站优化还必须要掌握

网站优化需要掌握哪些技巧?教你十大网站优化技巧

枫树SEO网是专注于SEO工具研发的站长工具网站,为广大站长提供了SEO综合查询工具、批量查询分析工具,一站式解决方案。在搜索引擎优化上我们是专业的!今天枫树SEO网小编给大家带来十大网站优化技巧,希望能够帮助到大家。1.在网站建设好后要定

优化网站有哪些技巧 如何做好网站优化

优化网站是做网站的日常工作,通过优化可以使网站的排名提升,获得更多的浏览和关注,那么优化网站有哪些技巧呢?我们一起来看看吧。优化网站有哪些技巧 如何做好网站优化1、找准网站关键词网站定位就是一个关键词的选择过程,是我们优化的方向,所谓方向不

网站优化这样做会有好的效果!来看看我是怎么做网站优化的

怎么做网站优化?相信很多人都会有自己的看法,有人说要注意标题的写法,有人说要注意代码优化,还有人说要注意内容优化,其实网站优化做的好坏,不是偶然的,它需要你不断的努力坚持,最终才会有好的结果。下面小匠来分享一下怎么做网站优化(仅供参考,个人

什么是网站优化?网站优化的优缺点

我们品牌推广的话会用到网站优化,那什么是网站优化呢,网站优化有哪些优点和缺点呢,今天来给大家讲解一下。什么是网站优化?网站优化是指我们通过seo搜索引擎优化,使网站符合搜索引擎的收录排名标准,从而提升网站在搜索引擎中的排名,来增加网络营销效

网站优化三步走,怎样给自己的网站做优化?

网站优化有难度?自己的网站优化不起来?怎样给自己的网站做优化呢?这是网站优化的灵魂三连。很多头条的网友都来咨询我这几个网站优化的问题,今天特意写了这么一篇网站优化扫盲贴。网站优化 网站优化第一步:代码 要想知道自己的网站是否适合做优化,首

网站优化都有哪些方法 网站优化技巧?

说起网站优化,我们不如来说说为什么要进行网站优化。举个例子来说,你卖新疆大核桃,也有自己的网站,结果上网搜新疆大核桃,前五页都没有你的网站。出现这种情况,基本上就不用幻想客户还能通过“新疆大核桃”的关键词找到你了。当你的客户搜不到你,也就意

网站优化的好处及网站优化秘籍-100法则

做网站优化有什么好?接触过这块的还好,没接触过的,肯定不知道是啥。 企业有了网站,必须得去做网站优化,只有做了网站优化,才能提升权重、提升关键词排名,才能为企业引入更多精准客户,除非企业不想通过互联网挖掘潜在客户。 随着企业对于网站优化了解

提高网站权重方法网站推广SEO优化网站关键词排名

网站优化买链接,SEO网站优化买外链。链接是长期优质的 没有做不上去的关键词,您无需到处购买链接 质量高:所有站点都是运营中的站点,非站群,垃圾站! 网站SEO优化买链接就来!(爱链接)http://520ipe.cnSEO在优化网站时,常

网站优化包含什么的优化,需要怎么做?

网站优化包含什么?网站建设离不开网站优化,百度百科对网站优化的解释是,通过对网站功能、网站结构、网页布局、网站内容等要素的合理设计,使得网站内容和功能表现形式达到对用户友好并易于宣传推广的最佳效果,充分发挥网站的网络营销价值的一项系统性和全

网站优化要做成什么样?怎样才算好的优化

我们都知道中小企业进行网络营销,SEO是一个最为有用的手法,我们也都想做好SEO,那么网站优化就非常要害。已然要决定做网站优化,那就做完好的,全套的!  网站的页面优化,即网页优化是对网页的程序、内容、版块、布局等多方面的优化调整,使其合适

友情链接

网址导航 SEO域名抢注宝宝起名网妈妈知道币圈浪琴二手表网尚太科技股票拉市海旅游攻略贵州旅游网禧六福珠宝九华山旅游攻略山东旅游网南宁分之道官网威克多球拍文玩手串交流网栗妃板栗资讯网灵隐寺旅游攻略广场舞健身网今日威海千里达自行车
嘉兴新闻头条网-嘉兴市秀洲区新闻、嘉兴新闻头条最新消息、嘉兴最新发展消息、嘉兴房价最新消息、嘉兴人才招聘网最新招聘信息、嘉兴天气预报、嘉兴旅游攻略、嘉兴特色美食、嘉兴传统美食、嘉兴当地美食。
嘉兴新闻头条网 lfqq.cn ©2022-2028版权所有