• 前端性能优化概述


    1.减少请求数量


    图片处理 Base64
    将图片的内容以Base64格式内嵌到HTML中,可以减少http的请求数量,但是编码之后的大小比图片大了
    使用字体图标代替图标
    避免使用空的src和href
    不要使用css@import


    2.减小资源大小


    html压缩
    html代码压缩就是压缩在文本文件中有意义,但在html中不显示的字符,包括空格,制表符
    css压缩
    css压缩包括无效代码删除与css语义合并
    js压缩与混乱
    js压缩与混乱包括无效字符及注释的删除、代码语义的缩减和优化、降低代码的可读性、实现代码的保护
    图片压缩


    3.优化网络连接


    使用CDN
    CDN是内容分发网络,它能够实时根据网络流量和各个节点的连接、负载状况以及到用户的距离和响应时间等综合信息将用户的请求重新导向离用户最近的服务节点上,其目的是使用户可以就近的取得所需的内容,解决网络拥挤的状况,提高网站的响应速度
    使用DNS预解析


    4.优化资源加载


    资源加载位置
    通过优化资源加载位置,更改资源加载时机,使尽可能快得展示出页面内容,尽可能快得使用功能可用
    1.css文件放在head中,先外链,后本页
    2.js文件放在body底部,先外链,后本页
    3.处理页面、处理页面布局的js文件放在head中,如 babel=polyfill.js文件,flexible.js文件
    4.body中尽量不写style标签和script标签

    若有收获,就点个赞吧

  • 相关阅读:
    cloudwu/coroutine 源码分析
    Redis实操详解
    CSS-DAY1
    [Spring笔记] Spring-40-Spring事务属性
    计算机组成原理_数据寻址
    怎么把音频转换成mp3格式?
    使用LVGL:我喜欢的几个界面
    【经验分享】数学建模团队准备解决方案流程策略分享
    使用VSCode+PlatformIO搭建ESP32开发环境
    2023/9/21 -- C++/QT
  • 原文地址:https://blog.csdn.net/Qianliwind/article/details/126725344