• 前端性能优化总结


    一、什么是前端性能优化(what)

          从用户访问资源到资源完整的展现在用户面前的过程中,通过技术和优化策略,缩短每个步骤的处理时间,从而提升整个资源的访问 和呈现速度。

    二、为什么要做前端性能优化(why)

          在构建web站点的过程中,任何一个细节都有可能影响网站的访问速度,如果不了解性能优化知识,很多不利网站访问速度的因素会形成积累,从而影响网站的性能,导致网站访问速度变慢,用户体验低下,最终导致用户流失

    三、前端性能优化的原则(rule)

          1、根据实际情况因地制宜

          2、不出bug

    四、从浏览器输入URL到页面展示都有哪些过程(process)

          1、输入URL

          2、应用层DNS解析域名

          3、建立TCP连接

          4、浏览器向服务器发送http请求     

          5、服务器接收数据

          6、服务器响应请求

          7、服务器返回相应的文件

          8、页面渲染

    五、性能优化的具体方案(way)

          1、使用CDN托管

          2、减少http请求

               21、文件打包,脚本合并(webpack、grunt)

               22、CSS雪碧图

                      通过background-image、background-position等属性定位

               23、文件压缩

                    https://tinypng.com/(熊猫图片压缩)

               24、延迟加载图片

               25、CSS3图标

               26、避免重定向

                     301:永久重定向     302:暂时重定向   

                     重定向会增加http请求数,但必要的重定向有利于提高用户体验

                     方法:定义URL链接时使用完整的地址

          3、代码优化

                31、减少对DOM的操作

                32、减少重排与重绘

                33、避免CSS表达式

                34、缓存Ajax

                        ajax缓存和http缓存效果相同

                35、配置Etags

          

  • 相关阅读:
    .Proto 文件转换成.cs文件
    C# 委托和事件
    C# 对word (03、07)的相关操作
    程序中记录日志的封装类
    压缩文件程.ZIP
    xml和对象直接的序列化和反序列化
    C#判断两个日期是否在同一周,某日期是本月的第几周
    vs2008 C# 单元测试
    解压缩.zip文件
    记录一次曲折的维护-重构过程
  • 原文地址:https://www.cnblogs.com/endlessmy/p/8399839.html
Copyright © 2020-2023  润新知