文件加载方法及装置与流程

本发明涉及文件加载领域，尤其涉及一种文件加载方法及装置。

背景技术：

1、在现有的网络应用和移动应用中，文件加载是影响用户体验的一个重要因素。尤其在文件资源较多的页面中，全部文件同时加载会导致页面加载时间过长，消耗大量流量，增加服务器负担，影响用户体验。现有技术中，通常采取逐步加载文件的方法，但仍然存在以下问题：第一，没有根据用户视图范围动态加载，导致大量不可见文件的加载浪费资源；第二，用户在滚动页面时，文件加载的延迟会影响使用体验；第三，对于已经不可见的文件，没有有效的加载中断机制，继续加载导致系统开销增加。

2、中国发明专利cn 112364279 b公开了一种图片加载方法、装置，包括：获取目标页面元素；获取目标页面元素的运动状态；如果目标页面元素的运动状态为滚动状态，则获取目标页面元素所承载的待加载图片，并将待加载图片加入至待加载队列，其中，待加载队列用于根据目标页面元素的运动状态变化对待加载图片进行监控，并在目标页面元素的运动状态变为非滚动状态时将待加载图片添加至加载队列进行下载。由此，可以根据图片的滚动状态来选择是否加载，如果处于滚动状态，则不直接下载，而是将其添加至待下载队列。但此方案在添加待加载图片至待下载队列后，由于系统资源消耗加剧，从而导致加载速度降低。

3、而目前并没有一种能够解决上述技术问题的技术方案，并没有一种文件加载方法及装置。

技术实现思路

1、本发明提供了一种文件加载方法及装置，能够通过在交互指令为预览可视区域的上区域文件的情况下，增加上缓冲区域的区域大小，并减少下缓冲区域的区域大小；在交互指令为预览可视区域的下区域文件的情况下，增加下缓冲区域的区域大小，并减少上缓冲区域的区域大小，从而使用户浏览方向上的文件得到更多的加载，不仅降低了系统资源的消耗，还使得滑动预览过程中文件的加载更为顺畅。

2、第一方面，本发明提供了一种文件加载方法，包括：

3、接收用户的预览指令，所述预览指令用于指示对目标文档中的文件进行预览；

4、响应于所述预览指令，在预览界面中利用虚拟列表显示可视区域内的所有文件，所述虚拟列表包括上缓冲区域、所述可视区域以及下缓冲区域，所述文件包括图片、视频、音频中的至少一种；

5、接收用户的交互指令，所述交互指令用于指示预览所述可视区域的上区域文件或下区域文件，所述交互指令是用户控制鼠标滑轮滚动或点击控件上下按键后生成的；

6、响应于所述交互指令，在所述交互指令为预览所述可视区域的上区域文件的情况下，增加上缓冲区域的区域大小，并减少下缓冲区域的区域大小；在所述交互指令为预览所述可视区域的下区域文件的情况下，增加下缓冲区域的区域大小，并减少上缓冲区域的区域大小。

7、根据本发明提供的文件加载方法，所述交互指令包括连续执行的第一指令以及第二指令；

8、在响应于所述交互指令之前，所述方法还包括：

9、确定在所述第一指令执行的情况下，所述可视区域中任一监测点的第一标定位置，确定在所述第二指令执行的情况下，所述监测点的第二标定位置；

10、根据所述第一标定位置以及所述第二标定位置确定距离差值；

11、根据所述第一指令的执行时刻与所述第二指令的执行时刻确定时间差值；

12、根据所述距离差值以及所述时间差值确定文件的滑动速度。

13、根据本发明提供的文件加载方法，在所述文件的滑动速度大于或等于预设速度的情况下，在响应于所述交互指令之后，所述方法还包括：

14、在所述交互指令为预览所述可视区域的上区域文件的情况下，调整上缓冲区域的区域大小至最大，删除所述下缓冲区域；在所述交互指令为预览所述可视区域的下区域文件的情况下，调整下缓冲区域的区域大小至最大，删除所述上缓冲区域。

15、根据本发明提供的文件加载方法，在所述文件的滑动速度小于预设速度的情况下，所述增加上缓冲区域的区域大小，并减少下缓冲区域的区域大小，包括：

16、

17、其中，为增加后上缓冲区域的区域大小，为增加前上缓冲区域的区域大小，为第一预设系数，为减少后下缓冲区域的区域大小，为减少前下缓冲区域的区域大小，为第二预设系数，为文件的滑动速度。

18、根据本发明提供的文件加载方法，在所述文件的滑动速度小于预设速度的情况下，所述增加下缓冲区域的区域大小，并减少上缓冲区域的区域大小，包括：

19、

20、其中，为减少后上缓冲区域的区域大小，为减少前上缓冲区域的区域大小，为第三预设系数，为增加后下缓冲区域的区域大小，为增加前下缓冲区域的区域大小，为第四预设系数，为文件的滑动速度。

21、根据本发明提供的文件加载方法，所述目标文档中包括所有初始图片，在接收用户的预览指令之后，且响应于所述预览指令之前，所述方法还包括：

22、利用预设图片处理库对所述目标文档中的所有初始图片进行压缩、格式转换，得到所有处理后图片；

23、对于每一处理后图片，确定图片尺寸大于预设尺寸的处理后图片为待裁剪图片，对所述待裁剪图片进行裁剪，得到所有裁剪后图片；

24、确定所有裁剪后图片以及所有未被裁剪处理的处理后图片为所述目标文档中的文件。

25、根据本发明提供的文件加载方法，所述在预览界面中利用虚拟列表显示可视区域内的所有文件，包括：

26、根据可视区域大小以及每一文件的目标视图尺寸，确定可视区域内的所有文件内容；

27、在预览界面中利用虚拟列表显示所述所有文件；

28、所述目标视图尺寸是根据用户显示需求，对预设视图尺寸进行调整后确定的。

29、根据本发明提供的文件加载方法，在响应于所述交互指令之后，所述方法还包括：

30、在所述文件进入至所述可视区域后，延迟预设时长后，加载所述文件；

31、所述预设时长为40ms～60ms。

32、根据本发明提供的文件加载方法，在加载所述文件之前，所述方法还包括：

33、创建abortcontroller实例，在发起fetch请求时，将 abortcontroller的signal属性作为signal选项传递给fetch请求，以建立信号链，在任一文件进入至所述可视区域后尚未加载，且已滑出所述可视区域的情况下，调用abortcontroller的abort()，以中止所述文件的加载。

34、第二方面，提供了一种文件加载装置，包括：

35、第一接收单元，所述第一接收单元用于接收用户的预览指令，所述预览指令用于指示对目标文档中的文件进行预览；

36、第一响应单元，所述第一响应单元用于响应于所述预览指令，在预览界面中利用虚拟列表显示可视区域内的所有文件，所述虚拟列表包括上缓冲区域、所述可视区域以及下缓冲区域，所述文件包括图片、视频、音频中的至少一种；

37、第二接收单元，所述第二接收单元用于接收用户的交互指令，所述交互指令用于指示预览所述可视区域的上区域文件或下区域文件，所述交互指令是用户控制鼠标滑轮滚动或点击控件上下按键后生成的；

38、第二响应单元，所述第二响应单元用于响应于所述交互指令，在所述交互指令为预览所述可视区域的上区域文件的情况下，增加上缓冲区域的区域大小，并减少下缓冲区域的区域大小；在所述交互指令为预览所述可视区域的下区域文件的情况下，增加下缓冲区域的区域大小，并减少上缓冲区域的区域大小。

39、本发明在预览界面中利用虚拟列表显示可视区域内的所有文件，虚拟列表包括上缓冲区域、可视区域以及下缓冲区域，在控制鼠标滑轮滚动或点击控件上下按键，以预览所述可视区域的上区域文件或下区域文件的情况下，在交互指令为预览所述可视区域的上区域文件的情况下，增加上缓冲区域的区域大小，并减少下缓冲区域的区域大小；在交互指令为预览可视区域的下区域文件的情况下，增加下缓冲区域的区域大小，并减少上缓冲区域的区域大小。本发明只展示用户当前视图中的文件，并且可以根据滑动方向动态调整上下缓冲区进行提前加载，进一步优化文件快速展示，进一步释放空间提高速度，而滑动方向上的文件就会得到更多的资源，加载的更快，从而降低带宽消耗和服务器压力；

40、本发明还根据文件滑动速度调整缓冲区域大小，动态调整缓冲区域大小以适应文件加载需求，提高文件加载效率，通过对图片预处理和裁剪，优化图片加载速度和展示效果，减少网络负担和提高用户体验；在文件进入可视区域后延迟一定时长后加载文件，避免一次性加载所有文件，以确保文件在确实需要被加载的情况下再加载，进一步优化资源使用。

技术特征：

1.一种文件加载方法，其特征在于，包括：

2.根据权利要求1所述的文件加载方法，其特征在于，所述交互指令包括连续执行的第一指令以及第二指令；

3.根据权利要求2所述的文件加载方法，其特征在于，在所述文件的滑动速度大于或等于预设速度的情况下，在响应于所述交互指令之后，所述方法还包括：

4.根据权利要求2所述的文件加载方法，其特征在于，在所述文件的滑动速度小于预设速度的情况下，所述增加上缓冲区域的区域大小，并减少下缓冲区域的区域大小，包括：

5.根据权利要求2所述的文件加载方法，其特征在于，在所述文件的滑动速度小于预设速度的情况下，所述增加下缓冲区域的区域大小，并减少上缓冲区域的区域大小，包括：

6.根据权利要求1所述的文件加载方法，其特征在于，所述目标文档中包括所有初始图片，在接收用户的预览指令之后，且响应于所述预览指令之前，所述方法还包括：

7.根据权利要求1所述的文件加载方法，其特征在于，所述在预览界面中利用虚拟列表显示可视区域内的所有文件，包括：

8.根据权利要求1所述的文件加载方法，其特征在于，在响应于所述交互指令之后，所述方法还包括：

9.根据权利要求8所述的文件加载方法，其特征在于，在加载所述文件之前，所述方法还包括：

10.一种文件加载装置，其特征在于，包括：

技术总结
本发明提供了一种文件加载方法及装置，涉及文件加载领域，该方法包括：接收用户的预览指令，预览指令用于指示对目标文档中的文件进行预览；在预览界面中利用虚拟列表显示可视区域内的所有文件；接收用户的交互指令，交互指令用于指示预览可视区域的上区域文件或下区域文件；在交互指令为预览可视区域的上区域文件的情况下，增加上缓冲区域的区域大小，并减少下缓冲区域的区域大小；在交互指令为预览可视区域的下区域文件的情况下，增加下缓冲区域的区域大小，并减少上缓冲区域的区域大小。本发明可以根据滑动方向动态调整上下缓冲区进行提前加载，释放空间提高速度，而滑动方向上的文件就会得到更多的资源，从而降低带宽消耗和服务器压力。

技术研发人员：杨泽霖,王勇,沈静,夏彬,曾智,王珈
受保护的技术使用者：武汉锂钠氪锶科技有限公司
技术研发日：
技术公布日：2024/9/23