后端一次性返回几百万条数据怎样处理

于 2023-07-13 21:02:30 发布
阅读量261 收藏
点赞数
文章标签： 前端 javascript 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Clover_zlx/article/details/131711580
版权

义务场景：地图等

处理方式：

数据分段加载，每次渲染10条，在渲染10条之前，把前10条清空掉，再渲染需要的这10条数据
根据地图缩放比例，视野范围可与获取到阀值【获取的时可是区域内的坐标点】
地图放大后，采用数据聚会的方式进行优化
使用地图瓦片，将数据按照瓦片的方式进行加载【只加载档期那是也范围内的瓦片数据】
总体来说就是渲染数据减少，不会一次性将数据全部渲染

Clover‘s Blog
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
如果后端API一次返回10万条数据，前端应该如何处理？
web前端开发
06-14 3556
英文 | https://medium.com/frontend-canteen/if-the-backend-api-returns-100-000-records-at-one-time-how-should-we-handle-it-in-the-frontend-fab21218fe2最近，我的一位朋友在面试时被问到这个问题。这个问题其实是考察面试者对性能优化的理...
请求数据，后台返回上千条上万条数据，怎么办
weixin_67490903的博客
08-23 3765
虽然后端一次返回这么多数据，但用户的屏幕只能同时显示有限的数据。所以我们可以采用延迟加载的策略，根据用户的滚动位置动态渲染数据。实际上，我们可以先创建一个文档片段，在创建了 div 元素之后，再将元素插入到文档片段中。4.计算可视区域内数据的起始索引，也就是区域内的第一条数据，用卷起的高度除以单条数据的高度。通过起始索引加上刚刚计算出来的可以显示的数据的条数。2.直接渲染，卡死用户。7.计算起始索引对应的数据在列表中的偏移位置，并设置到列表上。3.监听滚动，当滚动条滚动的时候，计算出被卷起的数据的高度。
后端一次返回过多数据，前端应该如何优化处理？
qq_36702286的博客
09-08 526
数据多、性能优化
后台返回大量数据（百万级）页面接收问题
baidu_16250655的博客
03-20 1万+
现在一般都是返回json格式的数据，当后台返回数据量过大，json数据就达到100m以上，这样页面接收很容易就崩溃了，这个情况下可以使用tomcat的压缩机制，如下 在tomcat的server.xml中的Connector节点中添加属性如下： <Connector connectionTimeout="20000" port="8080" protocol="HTTP/1.1...
后端API一次返回10万条数据，前端如何处理
最新发布
Andrew_Chenwq的博客
05-21 691
每个页面有条数limit限制，数据可以分成个页面，使用 setTimeout 顺序渲染页面，一次只渲染一个页面。
JavaScript如何一次性展示几万条数据
11-28
有一位同事跟大家说他在网上看到一道面试题：“如果后台传给前端几万条数据，前端怎么渲染到页面上？”，如何回答？ 于是办公室沸腾了， 同事们讨论开了， 你一言我一语说出自己的方案。 有的说直接循环遍历生成html...
vue中后端做Excel导出功能返回数据流前端的处理操作
10-14
在Vue项目中，当后端实现Excel导出功能并返回数据流时，前端需要进行相应的处理以将数据转化为可下载的Excel文件。本篇将详细解释这个过程。 首先，后端通常会通过HTTP响应返回一个Blob对象，Blob是Binary Large ...
vue前端模拟字典处理后端返回数据
04-18
有时候后端返回的数据字段可能是只有1或者2，这种code，没有返回对应的中文，但是前端又要显示中文，于是我就写了一个demo 可进行参考，只是主要处理就是用了js的一些语法，逻辑基本都是一样的，可以参考我这个demo...
SpringMVC后端返回数据到前端代码示例
08-19
主要介绍了SpringMVC后端返回数据到前端代码示例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
MySQL 读取百万数据进行处理，该怎么做？前后端交互百万数据需要考虑什么问题?
zhonghuaidong的博客
03-04 323
Mysql 百万数据查询优化
后端接口返回近万条数据，前端渲染缓慢，content Download 时间长的优化方案
二三的博客
03-23 8945
按照上面的方法，页面初始化的时候确实比之前快了很多，大概有一倍左右。不过直接跳转到最后一页，接口还是会有些缓慢。不过，对于上万条数据，也很少有人会直接跳转到最后一页进行搜索，毕竟上面也是有筛选条件可以进行筛选的。总而言之，也算是完成了性能优化。前端性能方案有很多种，比如 SSR，只是目前暂时还未了解，以后慢慢掌握。本篇文章介绍的方法只是其中比较特殊的一种，正常来说，我内心还是比较偏向于 gzip 压缩处理的。
如何让前端拥有后端的计算能力？一文彻底了解Web Worker，百万条数据计算都是弟弟...
weixin_46837985的博客
10-12 279
作者：海阔_天空https://juejin.cn/post/7137728629986820126页面中有十万条数据，对其进行复杂运算，需要多久呢？表格4000行，25列，总十万条数据运算包括：总和、算术平均、加权平均、最大、最小、计数、样本标准差、样本方差、中位数、总体标准差、总体方差答案是:35s 左右注：具体时间根据电脑配置会有所不同并且这个时间段内，页面一直处于假死状态，对页面做任何...
架构必知：后端服务实战之性能优化
08-09 841
本文简单介绍下后端服务开发中常用的一些性能优化策略。1、代码优化代码实现是第一位的，特别是一些不合理的复杂实现。如果结合需求能从代码实现的角度，使用更高效的算法或方案实现，进而解决问题，那...
后端返回一万条数据给前端，如何进行处理。
weixin_63929524的博客
05-01 2998
本篇技术博客主要介绍如何处理后端返回大量数据给前端的问题。在这种情况下，前端需要考虑付出多少的时间和精力来从原始数据中提取、处理和展示信息，以便更好地实现用户需求。本文主要考虑了三个方面：1） 数据获取方式；2） 数据处理方式；3） 数据展示方式。本文提供了两种处理方案，分别为分页展示和分批展示。分页展示主要是解决数据内存占用问题，分批展示则利用一个数据缓存池以滚动加载的方式创建数据展示。这两种方案不仅能够更好地利用浏览器能力，而且也有助于加速前端程序性能。
如何巧妙处理后端一次性返回10万条数据
qq_44586361的博客
03-27 3019
举例原来的数据是：[1,2,3,4,5,6,7,8],对该数据进行分堆（一堆3个），分堆之后是一个二维数组，[ [1,2,3], [4,5,6], [7,8]]如果前端直接把这10万条数据渲染到页面上，毫无疑问，我们的页面肯定会卡死，所以这种方案肯定是不可取的，那么我们该如何解决呢？除了以上方案之外，还可以使用滚动加载数据（滚动底部，加载一堆），以及虚拟列表处理等方式。2.比如一次截取10条数据，头一次截取0-9，第二次截取10~19等固定长度的截取。2.假设一堆存放10条数据，那么十万条数据就有一万堆。
处理百万级以上的数据提高查询速度的方法
热门推荐
netwinds的博客
03-25 1万+
处理百万级以上的数据提高查询速度的方法：  1.应尽量避免在 where 子句中使用!=或  2.对查询进行优化，应尽量避免全表扫描，首先应考虑在 where 及 order by 涉及的列上建立索引。  3.应尽量避免在 where 子句中对字段进行 null 值判断，否则将导致引擎放弃使用索引而进行全表扫描，如：      select id from t wh
怎样同时获取10000+接口的返回值：Promise.all高并发限制解决方案
技术圈
05-14 958
Promise.all高并发限制解决方案 怎样同时获取10000+接口的返回值？？ 有这样一种常见场景，我们希望同时请求N个接口，拿到所有的返回值做处理，这种情况下一般使用Promise.all实现。 let urls = [ 'https://.../url1', …… 'https://.../url100' ]; function loadData(url) { return new Promise((resolve, reject) => { axios.get(
接口返回的数据量太大很耗非带宽
ancaofumuhu9385的博客
08-26 8423
最近线上项目暴露出很多问题，其中有一个问题，就是带宽不够用的问题，从一开始的30M 加至 60M 到后来的 200M 可是我们的日活总共还不到10000啊，这个问题，我决定好好查查原因 占用带宽无非就是接口返回的数据量过大导致，所以我就排查了下项目中返回数据量较大的几个接口，当中的一个也是访问很频繁的接口 获取即时列表接口最大返回数据量有时会超过2M！！！ 我靠，更可怕的是这个接口还是...
后端一次性返回10万条数据，前端怎么处理
03-22
对于这个问题，可以采用分页的方式，将数据分成多个页面进行展示，每次只加载一页数据，这样可以减轻前端的压力，提高页面的加载速度。另外，可以采用懒加载的方式，当用户滚动到页面底部时再加载下一页数据，这样可以进一步提高页面的性能。同时，还可以对数据进行缓存，减少重复请求，提高数据的访问速度。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Clover‘s Blog

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值