JeecgBoot Vue3前端项目性能优化按需加载方案

news/2024/7/27 7:24:24/文章来源:https://blog.csdn.net/zhangdaiscott/article/details/136484053

JeecgBoot vue3前端项目在 3.5.5 版本之前,的确存在很严重的性能问题,大家可以参考以下文档进行升级。

按需加载改造方法

  • 1、全局注册地方去掉
  • 2、组件改成异步注册
  • 3、用不到的大组件可以删掉 【精简项目方案】

大组件

  • 1、富文本 tinyme
  • 2、Markdown
  • 3、CodeMirror
  • 4、地图数据 src/components/Form/src/utils/Area.ts
  • 5、JVxeTable表格
  • 6、仪表盘
  • 7、地图数据 china-area-data
  • 8、antd资源按需加载
  • 9、popup

组件分析: https://note.youdao.com/s/YKUzG66H

jeecgboot 3.5.5 性能优化方案

如何你是jeecgboot 3.5.5 之前的VUE3版本,可以参考我们已做过的优化进行改造

  • 1、按需加载改造
  • 2、UnoCSS替代windicss
  • 3、升级vite4
  • 4、build打包拆分

PR提交

  • 首屏缩短至10秒多&打包时间缩短至一半,升级vite4和vue3.3
  • 打包优化默认index太大,自定义拆包策略
  • UnoCSS替代windicss,Windi CSS导致vite变慢
  • 生产环境字典慢的问题

vite编译提速

  • 1、关闭mock
  • 2、删除online单元测试
  • 3、删除甘特图
  • 4、tinymce code组件,精简配置
  • 5、行编辑不全局注册
  • 6、处理::v-deep

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_998355.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

数据库压力测试方法概述

一、前言 在前面的压力测试过程中,主要关注的是对接口以及服务器硬件性能进行压力测试,评估请求接口和硬件性能对服务的影响。但是对于多数Web应用来说,整个系统的瓶颈在于数据库。 原因很简单:Web应用中的其他因素,…

C++ · 代码笔记5 · 探索多态与虚函数

目录 前言011虚函数_使用基类指针实现覆盖特性012虚函数_使用引用实现覆盖特性013使用多态场景小例程020构成多态的条件030虚析构函数040纯虚函数051typeinfo运算符_获取类型信息052typeinfo_根据不同类型进行不同操作 前言 本笔记所涉及到的编程环境与 《C 代码笔记1 从C到C…

9道软件测试面试题,刷掉90%的测试程序员

没点真本事真技术,没点面试经验,不了解点职场套路,如何过五关斩六将?如何打败面试官?如何拿下那梦寐以求的offer? 如果你的跳槽意向已经很确定,那么请往下看! 跳槽最重要的一步自然…

完美解决VMware中配置suse10虚拟机网络

一、注意!!!配置suse10网络,需要在虚拟机关机状态下进行,否则会配置不成功; 二、配置与主机在同一网段(仅主机模式,网卡一); 在suse系统关机状态下,Vmware中设置”虚拟网…

UE5 文字游戏(2) C++实时读取CSV文件(游戏开始读取本地CSV剧本)

1.结构体代码 // Fill out your copyright notice in the Description page of Project Settings.#pragma once#include "CoreMinimal.h" #include "Engine/DataTable.h" #include "MyCharacterStats.generated.h"USTRUCT(BlueprintType) struc…

记录 android studio 通过安装NDK 编译C文件,得到需要的so文件

只怪自己太健忘,每次网上查了一圈,搞定后,再遇到又发现不会操作了,特此记下 不废话直接上步骤 (1) 进入AS的settinging如下界面 (2)选中图片箭头两个文件 进行下载 (…

ChatGPT高效提问——角色提示

ChatGPT高效提问——角色提示 角色提示技巧是一种通过给模型提供具体的角色扮演,指导ChatGPT输出的方法。这个技巧对一个具体的上下文或者听众定制生成的文本很有用。 要使用角色提示技巧,你需要提供明确具体的模型扮演的角色。 例如,如果…

docker 数据卷 详解与实践

常见的数据卷命令 命令 说明 文档地址 docker volume create 创建数据卷 docker volume create docker volume ls 查看所有数据卷 docs.docker.com docker volume rm 删除指定数据卷 docs.docker.com docker volume inspect 查看某个数据卷的详情 docs.docker.co…

【Python】6. 基础语法(4) -- 列表+元组+字典篇

列表和元组 列表是什么, 元组是什么 编程中, 经常需要使用变量, 来保存/表示数据. 如果代码中需要表示的数据个数比较少, 我们直接创建多个变量即可. num1 10 num2 20 num3 30 ......但是有的时候, 代码中需要表示的数据特别多, 甚至也不知道要表示多少个数据. 这个时候,…

qtvs2022工程cmakelist.txt添加QCharts模块

find_package(QT NAMES Qt5 COMPONENTS Core Gui Widgets OpenGL Concurrent Charts Sql Network REQUIRED) find_package(Qt${QT_VERSION_MAJOR} COMPONENTS Core Gui Widgets OpenGL Charts Concurrent Sql Network REQUIRED)这里find_package只是设置搜索路径,为…

阿里云服务器怎么使用?3分钟搭建网站教程2024新版

使用阿里云服务器快速搭建网站教程,先为云服务器安装宝塔面板,然后在宝塔面板上新建站点,阿里云服务器网aliyunfuwuqi.com以搭建WordPress网站博客为例,来详细说下从阿里云服务器CPU内存配置选择、Web环境、域名解析到网站上线全流…

【代码随想录算法训练营Day33】1005.K次取反后最大化的数组和;134.加油站;135.分发糖果

❇️Day 33 第八章 贪心算法 part03 ✴️今日任务 1005.K次取反后最大化的数组和134.加油站135.分发糖果 ❇️1005. K次取反后最大化的数组和 本题简单一些,估计大家不用想着贪心 ,用自己直觉也会有思路。题目链接:https://leetcode.cn/pr…

如何在Windows上使用Docker,搭建一款实用的个人IT工具箱It- Tools

文章目录 1. 使用Docker本地部署it-tools2. 本地访问it-tools3. 安装cpolar内网穿透4. 固定it-tools公网地址 本篇文章将介绍如何在Windows上使用Docker本地部署IT- Tools,并且同样可以结合cpolar实现公网访问。 在前一篇文章中我们讲解了如何在Linux中使用Docker搭…

从huggingface下载模型像本地加载但是UnicodeDecodeError

我自己是在Linux下出现了这个问题 原文:https://github.com/huggingface/transformers/issues/13674 The path for the AutoModel should be to a directory pointing to a pytorch_model.bin and to a config.json. Since you’re pointing to the .bin file dire…

全局渐变滚动条样式

效果如下&#xff1a; APP.vue<style> /* 整个滚动条 */ ::-webkit-scrollbar {width: 5px;height: 10px; } /* 滚动条上的滚动滑块 */ ::-webkit-scrollbar-thumb {background-color: #49b1f5;/* 关键代码 */background-image: -webkit-linear-gradient(45deg,rgba(255,…

Linux--搭建Zabbix监控系统

11.1 案例分析 要想实时地了解服务器的运行状况并且能在出现问题时及时解决&#xff0c;利用监控软件是一个很好的 途径。 Zabbix&#xff08;免费的&#xff09;是一个基于Web界面的企业级开源监控套件&#xff0c;提供分布式系统监控与网络监视功能。具备主机的性能监控。网络…

基于SpringBoot的中小型超市数据分析系统设计与实现

目 录 摘 要 I Abstract II 引 言 1 1 系统开发相关技术 3 1.1 SpringBoot框架 3 1.1.1发展历程 3 1.1.2 什么是SpringBoot 3 1.1.3 SpringBoot特性 3 1.1.4 SpringBoot的优势 3 1.2 MyBatis框架 4 1.2.1框架简介 4 1.2.2框架特性 4 1.3 Java语言 5 1.3.1 Java语言简介 5 1.3.…

OpenAI-Sora学习手册

通过Sora看2024红利&#xff1a;文生视频&#xff0c;虽然AI不一定是风口&#xff0c;但一定是未来深入到生活工作&#xff0c;乃至思考的必备工具。 目录 Sora介绍 Sora基础介绍 Sora官方网址 Sora的价值 1.物理世界的交互 2.创意世界的绽放 3.多角色、更精准、更细节…

Sora,OpenAI带来的视觉革新

目录 1、Sora&#xff1a;不只是一个视频生成工具 2、从文本到视频的魔法之旅 3、技术革命&#xff1a;从文本到视频的华丽转变 4、应用范围&#xff1a;无限的可能性 5、好用的GPT网站 ⭐ 想象一下&#xff0c;如果你可以仅通过敲击键盘&#xff0c;就能让你的思维火花转…

Spark实战-基于Spark日志清洗与数据统计以及Zeppelin使用

Saprk-日志实战 一、用户行为日志 1.概念 用户每次访问网站时所有的行为日志(访问、浏览、搜索、点击)用户行为轨迹&#xff0c;流量日志2.原因 分析日志&#xff1a;网站页面访问量网站的粘性推荐3.生产渠道 (1)Nginx(2)Ajax4.日志内容 日志数据内容&#xff1a;1.访问的…