V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
woxinyongheng
V2EX  ›  程序员

前端怎么处理后端没分类的数据

  •  
  •   woxinyongheng · 2023-08-08 15:58:15 +08:00 · 1441 次点击
    这是一个创建于 473 天前的主题,其中的信息可能已经有所发展或是发生改变。

    调用了一个第三方接口得到比赛数据,只能传入参数 begindex endindex,如果传入 0,9 意味着获取前十条数据

    现在我想添加一个筛选功能,筛选比赛类别,应该怎么处理数据呢?

    想到的方法是一次性多拿几条数据,在前端进行分类。

    但是如果一次性从第三方接口获取的数据太多,前端就会明显的加载缓慢。

    有木有优雅一点的方法?

    12 条回复    2023-08-09 11:20:33 +08:00
    hundredFlowers
        1
    hundredFlowers  
       2023-08-08 16:46:59 +08:00
    感觉还是要封装吧,你的筛选功能做一个组件,根据数据中的属性做好筛选条件
    sgiyy
        2
    sgiyy  
       2023-08-08 17:43:50 +08:00
    1. 考虑首次加载,可以只请求和展示前 20 条;
    2. 然后延迟加载 0-1000 索引的数据,就在这里面进行前端筛选(比赛的时效性还是挺重要的,所以可以考虑最多只查最近一周内的所有数据,最大值 1000 可以自己定,然后筛选时间为一周内的)
    USDT
        3
    USDT  
       2023-08-08 18:45:33 +08:00
    😂我感觉最优雅的做法应该是自己写一个很简单的后端,缓存住那边服务器的数据,然后对自己的前端暴露分页接口的时候添加上筛选功能😂😂😂
    USDT
        4
    USDT  
       2023-08-08 18:48:28 +08:00
    @USDT 换句话来说,如果数据量不大的话,纯前端做法可以是自己建立一个 In-memory (甚至定期存进 local storage )的缓存,然后每次查询就从自己这个缓存里面查

    然后就是缓存的更新机制,其实和“很简单的后端“的更新机制是一样的,比方说轮询(或者什么其他高端的方式
    Nich0la5
        5
    Nich0la5  
       2023-08-08 19:10:40 +08:00
    前端加载慢是取数慢还是渲染慢,既然是第三方接口,建议还是自己做一个后端 实现分页功能,前端不应该做过多的数据处理
    Track13
        6
    Track13  
       2023-08-08 19:44:12 +08:00 via Android
    优雅不了,翻页筛完就多一条数据(甚至翻了几页一条都没有加,怎么优雅)
    wpblank
        7
    wpblank  
       2023-08-08 19:48:07 +08:00
    写个后端实时把数据读到自己数据库呗,前端查询也不用多次调用三方接口了。
    woxinyongheng
        8
    woxinyongheng  
    OP
       2023-08-08 20:16:59 +08:00
    @sgiyy 感谢!
    woxinyongheng
        9
    woxinyongheng  
    OP
       2023-08-08 20:19:41 +08:00
    @USDT 对的,但是不太会后端和数据库操作(懒狗)
    woxinyongheng
        10
    woxinyongheng  
    OP
       2023-08-08 20:21:50 +08:00
    @sgiyy 有考虑过!但是缓存的数据什么时候更新呢?比如一把游戏可能十分钟二十分钟后就会新增一把,要为了这一把重新加载 1000 条吗?或者说对比一下数据强行 push 。。。
    justdolove
        11
    justdolove  
       2023-08-09 08:48:07 +08:00
    @Nich0la5 我们公司的 app 无后端,所有逻辑和数据处理全部在前端完成,接口只做一件事,就是把前端处理完的数据写进数据库。
    sgiyy
        12
    sgiyy  
       2023-08-09 11:20:33 +08:00
    @woxinyongheng #10 设置一个合理的间隔,请求这个时间段内大概的数据量的长度*2 (比如 5 分钟轮询一次,期间大概产生 100 条数据,那就请求 200 条数据),然后插入本地缓存的数据里,重复的要覆盖,本地就维护 1000 条数据左右。

    你这个仅前端优化的话,就做不到完美。最完美的可能就是其他人说的,你自己维护一套数据库和后端,把他们的数据都存起来,然后想怎么做都行。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2250 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 01:40 · PVG 09:40 · LAX 17:40 · JFK 20:40
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.