关于接口时间加载过长，数据单独后台预加载

最新推荐文章于 2023-12-11 17:40:13 发布

我是胡帅

最新推荐文章于 2023-12-11 17:40:13 发布

阅读量115

点赞数

文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/m0_55921724/article/details/131111839

版权

为解决接口加载时间过长问题，本文提出一种预加载策略。页面加载时获取24小时内的数据，并在后台提前加载最近3天的全部数据。当用户查看前一天数据时，从缓存中获取并同时更新前一天的前一天数据，保持缓存内始终有3天完整数据。由于数据时间不精确，参数处理时进行了几分钟的修正。

摘要由CSDN通过智能技术生成

思路：
当前页面加载24小时数据，加载的时调用方法加载连续3天的数据，查看前一天的数据时，先去缓存中取数据，触发加载前一天的上一天的数据，同时把缓存中的昨天的数据清理掉，始终保持缓存中有3天的数据。由于我的数据时间比一定正好所以，参数时间两头减了几分钟。
创建js文件：

import {
  getDataByTime
} from '@/api/api'
import { getDateStr } from '@/utils/util'

var ChcheData = []
var m_jh = ''
export async function getChcheData(jh, starTime, endTime, selectedConfigureKey) {
  if (getPlusMinutesData(starTime, 1000 * 60 * 5) > new Date()) {
    return null
  }
  console.log('准备进缓存取数据')
  console.log( starTime, endTime,selectedConfigureKey)
  if (m_jh != '' && m_jh == jh) {
    let returnData=[]
    if(ChcheData.length>0){
      returnData= ChcheData.filter(result => new Date(result.time) >= new Date(starTime) && new Date(result.time) <= new Date(endTime))
    }
    if (returnData.length > 0) {
      if (new Date(ChcheDa