异步显示flatpickr中的占用情况,而不会使服务器被请求淹没

我正试图通过 flatpickr 在月视图中显示占用情况。此日期选择器中的小点:

FlatPicker的文档说明了一种与日单元格交互的非常简单的方法,并在创建日单元格时添加一些元素或操纵单元格:

...
onDayCreate: function(dObj, dStr, fp, dayElem){
    // Utilize dayElem.dateObj, which is the corresponding Date

    // dummy logic
    if (Math.random() < 0.15)
        dayElem.innerHTML += "<span class='event'></span>";

    else if (Math.random() > 0.85)
        dayElem.innerHTML += "<span class='event busy'></span>";
}
...

很酷:这个回调叫做 每一个 创建单元格的时间,每个视图30 | 31次。

占用率通过一个API公开,该API获取一个或一个日期数组,并返回一个包含占用率信息的数组:

{
  '2018-04-19': 60,
  '2018-04-30': 21,
  ....
}

在 onDayCreate -事件,我可以调用API并根据返回的结果进行操作。虽然这会产生30/31个请求,但这是可行的,但效率不高。

迄今为止一切顺利;但问题在于,如果滚动查看月份,每个月都会生成30/31个对API的请求。即使这个月只显示了几分之一秒。本质上,我是在对自己的服务器进行DDoS攻击。

我的下一个方法是预加载1个请求中的“第一个”月,并使用 onDayCreate公司 -事件从预加载的数组中选择cherrypick。

接下来几个月的占用率将异步加载到 onMonthChange -事件。但是,FlatPicker似乎点燃了 onMonthChange公司 -事件并继续创建日期:

红线以上:首月;下面是我下个月点击的。

所以我不能在onMonthChange中使用新加载的数据。。。

关于如何在不使用(不必要的)请求重载API的情况下将占用信息动态加载到FlatPicker中的任何帮助