vue2项目打包后js文件过大, 首次加载缓慢
vue2项目打包后js文件过大, 首次加载缓慢
- 安装插件
npm i compression-webpack-plugin@6.1.1 -D
- 配置
vue.config.js
const CompressionWebpackPlugin = require('compression-webpack-plugin')module.exports = {configureWebpack: {plugins:[new CompressionWebpackPlugin({filename: '[path][base].gz', //'[path].gz[query]',algorithm: 'gzip',test: /\.js$|\.json$|\.css/,threshold: 10240, // 只有大小大于该值的资源会被处理minRatio: 0.8, // 只有压缩率小于这个值的资源才会被处理// deleteOriginalAssets: true // 删除原文件})],},
}
- 后端配置
nginx
http {include mime.types;default_type application/octet-stream;client_max_body_size 1024m;sendfile on;keepalive_timeout 65;# 配置gzipgzip on;gzip_min_length 1k;gzip_buffers 4 16k;gzip_http_version 1.1;gzip_comp_level 9;gzip_types text/plain application/x-javascript text/css application/xml text/javascript application/x-httpd-php application/javascript application/json;gzip_disable "MSIE [1-6]\.";gzip_vary on;server {listen 80;server_name localhost;location / {root html;index index.html index.htm;} }}
相关文章:
vue2项目打包后js文件过大, 首次加载缓慢
vue2项目打包后js文件过大, 首次加载缓慢 安装插件 npm i compression-webpack-plugin6.1.1 -D配置vue.config.js const CompressionWebpackPlugin require(compression-webpack-plugin)module.exports {configureWebpack: {plugins:[new CompressionWebpackPlugin({filen…...
【DeepSeek】-macOS本地终端部署后运行DeepSeek如何分析图片
【DeepSeek】-macOS本地终端部署后运行DeepSeek如何分析图片 根据您的需求,目前需要了解以下几个关键点及分步解决方案: --- 一、现状分析 1. Ollama 的限制: - 目前Ollama主要面向文本大模型,原生不支持直接上传/处理图片 …...
开源模型应用落地-LangChain实用小技巧-获取token消耗(五)
一、前言 在当今的自然语言处理领域,LangChain 框架因其强大的功能和灵活性而备受关注。掌握一些实用的小技巧,能够让您在使用 LangChain 框架时更加得心应手,从而更高效地开发出优质的自然语言处理应用。 计算 Token 消耗对有效管理和优化语…...
mfy学习笔记
创建表并导入数据 CREATE TABLE sales (id INT,salesperson STRING,region STRING,sales_amount INT,sale_date DATE );INSERT INTO sales (id, salesperson, region, sales_amount, sale_date) VALUES (1, Alice, North, 1000, 2023-01-01), (2, Bob, South, 1500, 2023-01-0…...
LangChain大模型应用开发:LangGraph快速构建Agent工作流应用
介绍 大家好,博主又来给大家分享知识了。今天给大家分享的内容是使用LangChain进行大规模应用开发中的LangGraph快速构建Agent工作流应用。 通过对前几次对LangChain的技术分享。我们知道LangChain作为一个强大的工具集,为开发者们提供了丰富的资源和便…...
鸿蒙Next-方法装饰器以及防抖方法注解实现
以下是关于 鸿蒙Next(HarmonyOS NEXT)中 MethodDecorator 的详细介绍及使用指南,结合了多个技术来源的实践总结: 一、MethodDecorator 的概念与作用 MethodDecorator 是鸿蒙Next框架中用于装饰类方法的装饰器,属于 Ark…...
神经网络发展简史:从感知机到通用智能的进化之路
引言 神经网络作为人工智能的核心技术,其发展历程堪称一场人类对生物大脑的致敬与超越。本文将用"模型进化"的视角,梳理神经网络发展的五大关键阶段,结合具象化比喻和经典案例,为读者呈现一幅清晰的AI算法发展图谱。 一…...
计算机网络:应用层 —— 电子邮件
文章目录 电子邮件的起源与发展电子邮件的组成电子邮件协议邮件发送和接收过程邮件发送协议SMTP协议多用途因特网邮件扩展MIME 电子邮件的信息格式 邮件读取协议邮局协议POP因特网邮件访问协议IMAP 基于万维网的电子邮件 电子邮件(E-mail)是因特网上最早…...
zyNo.26
[GXYCTF2019]Ping Ping Ping(Web) 传/?ip1有ping回显,说明后端可能通过php参数接受了ip参数,并且拼接到了最终执行的命令里形成了ping -c 3$ip,这样可能存在一个命令注入漏洞 要判断是否符合 ping -c 3$ip …...
结构型模式 - 适配器模式 (Adapter Pattern)
结构型模式 - 适配器模式 (Adapter Pattern) 适配器模式是一种结构型设计模式,它允许将一个类的接口转换成客户希望的另一个接口,使得原本由于接口不兼容而不能一起工作的那些类可以一起工作。 类适配器,适用于要适配的类是一个接口…...
Linux 驱动模块稳定性检测框架 - 概要设计
Linux 驱动模块稳定性检测框架 1. 设计目标 实时监控:检测 Linux 设备驱动模块运行状态,及时发现异常。数据采集:通过内核打点,收集关键运行数据,分析模块稳定性。异常检测:分析错误日志、性能指标&#…...
ui设计公司兰亭妙微分享:科研单位UI界面设计
科研单位的UI界面设计是一项至关重要的任务,它不仅关乎科研工作的效率,还直接影响到科研人员的用户体验。以下是对科研单位UI界面设计的详细分析: 一、设计目标 科研单位的UI界面设计旨在提升科研工作的效率与便捷性,同时确保科…...
c# —— StringBuilder 类
StringBuilder 类是 C# 和其他一些基于 .NET Framework 的编程语言中的一个类,它位于 System.Text 命名空间下。StringBuilder 类表示一个可变的字符序列,它是为了提供一种比直接使用字符串连接操作更加高效的方式来构建或修改字符串。 与 C# 中的 stri…...
OpenGL ES -> GLSurfaceView绘制点、线、三角形、正方形、圆(顶点法绘制)
XML文件 <?xml version"1.0" encoding"utf-8"?> <com.example.myapplication.MyGLSurfaceViewxmlns:android"http://schemas.android.com/apk/res/android"android:layout_width"match_parent"android:layout_height"…...
React + TypeScript 全栈开发最佳实践
React TypeScript 全栈开发最佳实践 一、环境搭建与项目初始化 node.js和npm的安装请参考我的文章。 1.1 脚手架选择与工程创建 # 使用Vite 5.x创建ReactTS项目(2025年主流方案) npx create-vitelatest my-app --template react-ts cd my-app npm in…...
AndroidAOSP定制隐藏某个应用的图标
AndroidAOSP定制隐藏某个应用的图标 1.前言: 之前在做AOSP定制的时候需要隐藏某些App的图标,或者默认不显示某个定制的App图标,这样可以让用户感觉不到已经安装了某个App,或者在做系统定制的时候需要修改桌面icon,有些系统的App图标默认不需要显示&…...
最小化重投影误差求解PnP
问题描述 已知n个空间点 P i [ x i , y i , z i ] T P_i[x_i,y_i,z_i]^T Pi[xi,yi,zi]T,其投影的像素坐标 p i [ u i , v i ] T p_i[u_i,v_i]^T pi[ui,vi]T求相机的位姿R,T。 问题分析 根据相机模型,像素点和空间点的位置…...
玩转Docker | 使用Docker部署IT-tools工具箱
玩转Docker | 使用Docker部署IT-tools工具箱 前言一、 IT-tools介绍简介主要特点二、系统要求环境要求环境检查Docker版本检查检查操作系统版本三、部署IT-tools服务下载镜像创建容器检查容器状态检查服务端口安全设置四、访问IT-tools应用五、测试与使用六、总结前言 在信息技…...
unity学习52:UI的最基础组件 rect transform,锚点anchor,支点/轴心点 pivot
目录 1 image 图像:最简单的UI 1.1 图像的基本属性 1.2 rect transform 1.3 image的component: 精灵 → 图片 1.4 修改颜色color 1.5 修改材质 1.6 raycast target 1.7 maskable 可遮罩 1.8 imageType 1.9 native size 原生大小 2 rect transform 2.1 …...
【Python系列】PYTHONUNBUFFERED=1的作用
💝💝💝欢迎来到我的博客,很高兴能够在这里和您见面!希望您在这里可以感受到一份轻松愉快的氛围,不仅可以获得有趣的内容和知识,也可以畅所欲言、分享您的想法和见解。 推荐:kwan 的首页,持续学…...
DeepSeek-R1技术全解析:如何以十分之一成本实现OpenAI级性能?
一、现象级爆火背后的技术逻辑 2025年1月20日,中国AI公司深度求索(DeepSeek)发布新一代大模型R1,其性能直接对标OpenAI的o1版本,但训练成本仅为后者的1/20(600万美元 vs. 1.2亿美元)࿰…...
Linux中的cgdb的基本使用
1.cgdb的简介 Linux中的cgdb是一个基于GDB(GNU Debugger)的图形化调试前端,它结合了GDB的命令行界面功能和代码查看窗口,为开发者提供了一个更为直观的调试体验。 cgdb的作用和功能: 直观调试体验:cgdb提供…...
Qt layout
文章目录 Qt layout**关键机制****验证示例****常见误区****最佳实践****总结**关键点总结:示例代码说明:结论: Qt layout 在 Qt 中,当调用 widget->setLayout(layout) 时,layout 的父对象会被自动设置为该 widget…...
解决idea2019创建springboot项目爆红的问题
通过spring Initializr创建springboot项目时,由于idea版本太低,创建完成后需要手动修改pom.xml,对小白不太友好 一个简便的方法,配置好pom.xml文件的各个版本: 在 https://start.aliyun.com/ 上选择好后复制pom.xml代…...
DeepSeek 提示词:基础结构
🧑 博主简介:CSDN博客专家,历代文学网(PC端可以访问:https://literature.sinhy.com/#/?__c1000,移动端可微信小程序搜索“历代文学”)总架构师,15年工作经验,精通Java编…...
自动驾驶两个传感器之间的坐标系转换
有两种方式可以实现两个坐标系的转换。 车身坐标系下一个点p_car,需要转换到相机坐标系下,旋转矩阵R_car2Cam,平移矩阵T_car2Cam。点p_car在相机坐标系下记p_cam. 方法1:先旋转再平移 p_cam T_car2Cam * p_car T_car2Cam 需要注…...
[实现Rpc] 客户端 | Requestor | RpcCaller的设计实现
目录 Requestor类的实现 框架 完善 onResponse处理回复 完整代码 RpcCaller类的实现 1. 同步调用 call 2. 异步调用 call 3. 回调调用 call Requestor类的实现 (1)主要功能: 客户端发送请求的功能,进行请求描述对服务器…...
flutter: table calendar笔记
pub dev:table_calendar 3.2.0 我来详细解释 TableCalendar 是如何根据不同的 CalendarFormat 来显示界面的。主要逻辑在 CalendarCore 中实现。 核心逻辑分为以下几个部分: 页面数量计算 - _getPageCount 方法根据不同格式计算总页数: in…...
smolagents学习笔记系列(五)Tools-in-depth-guide
这篇文章锁定官网教程中的 Tools-in-depth-guide 章节,主要介绍了如何详细构造自己的Tools,在之前的博文 smolagents学习笔记系列(二)Agents - Guided tour 中我初步介绍了下如何将一个函数或一个类声明成 smolagents 的工具&…...
axios几种请求类型的格式
Axios 是一个基于 Promise 的 HTTP 客户端,广泛用于浏览器和 Node.js 中发送 HTTP 请求。它支持多种请求格式,包括 GET、POST、PUT、DELETE 等。也叫RESTful 目录 一、axios几种请求类型的格式 1、get请求 2、post请求 3、put请求 4、delete请求 二…...
