【记录】有关接口响应很快,但是在页面渲染的时候发现很慢的问题

简介: 【记录】有关接口响应很快,但是在页面渲染的时候发现很慢的问题
请求数据返回的时候,接口响应的速度是很快的,但是数据量很大,导致返回的报文体很多兆,如果服务器的带宽不够大的话,会有些慢,我这边的例子是3m的数据平均需要大概5~10秒的时间。
思路:开启压缩配置
代码
server:
  port: 8080
  #开启响应数据压缩
  compression:
    enabled: true
    mime-types: text/html,text/plain,text/css,application/json
    #配置最小响应报文1024KB 超过该值响应报文会进行压缩
    min-response-size: 1024
如何判断是否开启了压缩 浏览器打开控制台,查看请求头

存在gzip就表示成功开启了

优化后的效果是:大概100~300毫秒
相关文章
|
7月前
|
前端开发 开发工具 git
Git报错处理:解决git commit时的lint-staged错误提示。
极好的,你对Git的lint-staged出了一个令人头疼的问题。让我们一起钻研一下,找到一种方法来解决一切。 首先,我们要确定你是在做什么操作时候遇到了问题。lint-staged通常在我们运行 git commit 时启动,它做的工作是在你提交之前运行一些指定的命令检查你的代码。当lint-staged报错,多半是因为检查未通过,或者它试图运行的命令存在问题。 让我们以一种图解的方式来描绘一下这个过程,就像canvas上的画面那样。git正在温柔的将你的修改捆绑起来,准备提交。突然,lint-staged走了出来,并开始盘问着Git,寻找可能的错误。如果lint-staged找到了什么
849 24
|
数据格式
使用小技巧实现el-table组件的合并行功能,ElementUI和ElementPlus都适用
本文介绍了在ElementUI和ElementPlus中使用`el-table`组件实现合并行功能的技巧,包括多列合并和单列合并的方法,并提供了相应的示例代码和运行效果。
9915 1
使用小技巧实现el-table组件的合并行功能,ElementUI和ElementPlus都适用
|
移动开发 JavaScript 前端开发
UniApp H5 跨域代理配置并使用(配置manifest.json、vue.config.js)
这篇文章介绍了在UniApp H5项目中处理跨域问题的两种方法:通过修改manifest.json文件配置h5设置,或在项目根目录创建vue.config.js文件进行代理配置,并提供了具体的配置代码示例。
UniApp H5 跨域代理配置并使用(配置manifest.json、vue.config.js)
element el-table 设置fixed导致行错乱问题
文章讨论了在使用Element UI的`el-table`组件时,设置固定列(`fixed`)导致行错乱的问题,并提供了解决方案。问题产生的原因是当表格底部有滚动条而固定列底部没有滚动条时,行无法对齐。解决办法是在表格中设置`padding-bottom`的内边距与滚动条高度相等,确保固定列和非固定列的行能够对齐。
3555 0
|
JSON 前端开发 JavaScript
不会webpack的前端可能是捡来的,万字总结webpack的超入门核心知识
该文章提供了Webpack的基础入门指南,涵盖安装配置、基本使用、加载器(Loaders)、插件(Plugins)的应用,以及如何通过Webpack优化前端项目的打包构建流程。
不会webpack的前端可能是捡来的,万字总结webpack的超入门核心知识
|
算法 JavaScript UED
Diff 算法的实现原理
【10月更文挑战第18天】Diff 算法是 Vue.js 中实现高效 DOM 更新的核心机制,通过合理的比较和优化策略,能够在保证界面正确性的同时,最大程度地减少 DOM 操作,提高应用的性能和用户体验。
417 2
|
JavaScript 前端开发 Java
解决跨域问题大集合:vue-cli项目 和 java/springboot(6种方式) 两端解决(完美解决)
这篇文章详细介绍了如何在前端Vue项目和后端Spring Boot项目中通过多种方式解决跨域问题。
918 1
解决跨域问题大集合:vue-cli项目 和 java/springboot(6种方式) 两端解决(完美解决)
浅谈 Vue3 的模块拆分与 API 重写
浅谈 Vue3 的模块拆分与 API 重写
|
监控 安全 数据管理
不得不说,这几款公司电脑监控软件太实用了
探索企业电脑监控神器:WorkWin、ActivTrak和InterGuard。这些工具提供USB管理、带宽控制,确保网络稳定;权限分配增强安全;远程管理提升效率;移动部署适应灵活工作;实时监控保证合规;时间统计优化资源分配。ActivTrak分析工作模式,InterGuard则通过屏幕截图和应用监控助力管理者了解员工行为。三者合力,打造高效安全的工作环境。
736 1
报错:cannot read properties of undefined(reading ‘forEach‘)
报错:cannot read properties of undefined(reading ‘forEach‘)
1230 1
报错:cannot read properties of undefined(reading ‘forEach‘)