CN117520691B - 一种条目化数据显示方法、装置、存储介质及电子设备 - Google Patents
一种条目化数据显示方法、装置、存储介质及电子设备 Download PDFInfo
- Publication number
- CN117520691B CN117520691B CN202410025160.5A CN202410025160A CN117520691B CN 117520691 B CN117520691 B CN 117520691B CN 202410025160 A CN202410025160 A CN 202410025160A CN 117520691 B CN117520691 B CN 117520691B
- Authority
- CN
- China
- Prior art keywords
- item data
- data
- rendering
- target
- scrolling
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
- 238000000034 method Methods 0.000 title claims abstract description 69
- 238000003860 storage Methods 0.000 title claims abstract description 17
- 238000009877 rendering Methods 0.000 claims abstract description 96
- 230000004044 response Effects 0.000 claims abstract description 10
- 238000005096 rolling process Methods 0.000 claims description 34
- 230000015654 memory Effects 0.000 claims description 24
- 230000008569 process Effects 0.000 claims description 19
- 238000004590 computer program Methods 0.000 claims description 11
- 230000003068 static effect Effects 0.000 claims description 4
- 230000001960 triggered effect Effects 0.000 abstract description 5
- 238000012545 processing Methods 0.000 description 9
- 238000004891 communication Methods 0.000 description 7
- 238000007726 management method Methods 0.000 description 5
- 238000005516 engineering process Methods 0.000 description 4
- 238000005406 washing Methods 0.000 description 4
- 238000009825 accumulation Methods 0.000 description 3
- 238000011161 development Methods 0.000 description 3
- 238000010586 diagram Methods 0.000 description 3
- 230000006870 function Effects 0.000 description 2
- 230000003287 optical effect Effects 0.000 description 2
- 238000013515 script Methods 0.000 description 2
- 238000004458 analytical method Methods 0.000 description 1
- 230000009286 beneficial effect Effects 0.000 description 1
- 230000005540 biological transmission Effects 0.000 description 1
- 230000000903 blocking effect Effects 0.000 description 1
- 239000000969 carrier Substances 0.000 description 1
- 230000008859 change Effects 0.000 description 1
- 230000001351 cycling effect Effects 0.000 description 1
- 238000013500 data storage Methods 0.000 description 1
- 230000003993 interaction Effects 0.000 description 1
- 230000004807 localization Effects 0.000 description 1
- 238000012423 maintenance Methods 0.000 description 1
- 238000007670 refining Methods 0.000 description 1
- 230000001360 synchronised effect Effects 0.000 description 1
- 230000000007 visual effect Effects 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
- G06F16/9577—Optimising the visualization of content, e.g. distillation of HTML documents
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
- G06F3/0485—Scrolling or panning
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Databases & Information Systems (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Data Mining & Analysis (AREA)
- Human Computer Interaction (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本申请的实施例公开了一种条目化数据显示方法、装置、存储介质及电子设备，涉及数据显示技术领域，通过用户发起的操作来触发虚拟滚动进行数据显示，并实时响应显示指令来获得条目数据的目标滚动方向，随即可确定与目标滚动方向相反的方向上的条目数据将会进入到显示窗口内进行渲染并显示，在其进入显示窗口之前先对其进行预渲染，并且由于预渲染是在显示窗口之外与显示窗口内数据渲染同步进行的，经过预渲染过后的条目数据在进入到显示窗口内进行完全渲染时，所需要消耗的渲染及显示时间就会进一步减少，采用前述方式持续进行，即可实现大量条目化数据的虚拟滚动快速显示，并降低新数据替换时的渲染消耗时间，提升数据显示的质量。
Description
技术领域
本申请涉及数据显示技术领域，具体涉及一种条目化数据显示方法、装置、存储介质及电子设备。
背景技术
越来越多的用户选择使用B/S架构的软件***进行需求信息管理，在管理的过程中对需求信息大批量数据展示处理要求也越来越高，如何使用户能够快速地查看，变成一个亟需解决的问题。使用传统的滚动方式，用户需要等待所有数据加载完毕并渲染，这会消耗大量的时间和内存。而虚拟滚动只渲染视口内的数据，能够大大减少DOM操作，减少渲染时间和内存占用，但是当用户进行滚动时，对进入视口内的新数据进行渲染依然会消耗一定时间，面对较大条目化数据量显示的场景，消耗时间的累积会影响数据显示的质量。
发明内容
本申请的主要目的在于提供一种条目化数据显示方法、装置、存储介质及电子设备，旨在解决现有技术中对大量条目化数据显示的质量偏低的问题。
为实现上述目的，本申请的实施例采用的技术方案如下：
第一方面，本申请实施例提供一种条目化数据显示方法，包括以下步骤：
根据用户发起的虚拟滚动触发操作，生成条目数据显示指令；
响应于条目数据显示指令，获取条目数据的目标滚动方向；
根据条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据；其中，第一条目数据包括在与目标滚动方向相反的方向上，最靠近显示窗口的至少一个条目数据；
将预渲染条目数据按照条目数据的目标滚动方向，滚动至显示窗口内并进行完全渲染，以实现条目化数据的滚动显示。
在第一方面的一种可能实现方式中，根据条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据之前，条目化数据显示方法还包括：
响应于条目数据显示指令，获取条目数据的滚动速度；
根据条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据，包括：
根据条目数据的目标滚动方向以及条目数据的滚动速度，对第一条目数据进行预渲染，获得预渲染条目数据。
在第一方面的一种可能实现方式中，将预渲染条目数据按照条目数据的目标滚动方向，滚动至显示窗口内并进行完全渲染，以实现条目化数据的滚动显示之后，条目化数据显示方法还包括：
将完全渲染后的预渲染条目数据进行缓存，获得缓存条目数据。
在第一方面的一种可能实现方式中，根据条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据之前，条目化数据显示方法还包括：
判断第一条目数据中是否存在缓存条目数据；
在第一条目数据中存在缓存条目数据的情况下，获得未渲染条目数据；
根据条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据，包括：
根据条目数据的目标滚动方向，对未渲染条目数据进行预渲染，获得预渲染条目数据。
在第一方面的一种可能实现方式中，将预渲染条目数据按照条目数据的目标滚动方向，滚动至显示窗口内并进行完全渲染，以实现条目化数据的滚动显示之后，条目化数据显示方法还包括：
识别显示窗口内条目化数据的目标字段；
判断包含目标字段的条目化数据是否为目标数据；
在包含目标字段的条目化数据不为目标数据的情况下，返回将预渲染条目数据按照条目数据的目标滚动方向，滚动至显示窗口内并进行完全渲染，以实现条目化数据的滚动显示的步骤，直至包含目标字段的条目化数据为目标数据，输出目标数据。
在第一方面的一种可能实现方式中，响应于条目数据显示指令，获取条目数据的目标滚动方向之前，条目化数据显示方法还包括：
根据需求信息的类别，建立分类模块信息；
将需求信息录入分类模块信息中，获得条目数据。
在第一方面的一种可能实现方式中，将需求信息录入分类模块信息中，获得条目数据，包括：
将需求信息录入分类模块信息中，获得需求条目；
根据需求条目进行分级，获得条目数据。
第二方面，本申请实施例提供一种条目化数据显示装置，包括：
指令生成模块，指令生成模块用于根据用户发起的虚拟滚动触发操作，生成条目数据显示指令；
获取模块，获取模块用于响应于条目数据显示指令，获取条目数据的目标滚动方向；
预渲染模块，预渲染模块用于根据条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据；其中，第一条目数据包括在与目标滚动方向相反的方向上，最靠近显示窗口的至少一个条目数据；
显示模块，显示模块用于将预渲染条目数据按照条目数据的目标滚动方向，滚动至显示窗口内并进行完全渲染，以实现条目化数据的滚动显示。
第三方面，本申请实施例提供一种计算机可读存储介质，储存有计算机程序，计算机程序被处理器加载执行时，实现如上述第一方面中任一项提供的条目化数据显示方法。
第四方面，本申请实施例提供一种电子设备，包括处理器及存储器，其中，
存储器用于存储计算机程序；
处理器用于加载执行计算机程序，以使电子设备执行如上述第一方面中任一项提供的条目化数据显示方法。
与现有技术相比，本申请的有益效果是：
本申请实施例提出的一种条目化数据显示方法、装置、存储介质及电子设备，该方法包括：根据用户发起的虚拟滚动触发操作，生成条目数据显示指令；响应于条目数据显示指令，获取条目数据的目标滚动方向；根据条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据；其中，第一条目数据包括在与目标滚动方向相反的方向上，最靠近显示窗口的至少一个条目数据；将预渲染条目数据按照条目数据的目标滚动方向，滚动至显示窗口内并进行完全渲染，以实现条目化数据的滚动显示。本申请通过用户发起的操作来触发虚拟滚动进行数据显示，并实时响应显示指令来获得条目数据的目标滚动方向，随即可确定与目标滚动方向相反的方向上的条目数据将会进入到显示窗口内进行渲染并显示，在其进入显示窗口之前先对其进行预渲染，并且由于预渲染是在显示窗口之外与显示窗口内数据渲染同步进行的，经过预渲染过后的条目数据在进入到显示窗口内进行完全渲染时，所需要消耗的渲染及显示时间就会进一步减少，采用前述方式持续进行，即可实现大量条目化数据的虚拟滚动快速显示，并降低新数据替换时的渲染消耗时间，提升数据显示的质量。
附图说明
图1为本申请实施例涉及的硬件运行环境的电子设备结构示意图；
图2为本申请实施例提供的条目化数据显示方法的流程示意图；
图3为本申请实施例提供的条目化数据显示装置的模块示意图；
图中标记：101-处理器，102-通信总线，103-网络接口，104-用户接口，105-存储器。
具体实施方式
应当理解，此处所描述的具体实施例仅仅用以解释本申请，并不用于限定本申请。
本申请实施例的主要解决方案是：根据用户发起的虚拟滚动触发操作，生成条目数据显示指令；响应于条目数据显示指令，获取条目数据的目标滚动方向；根据条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据；其中，第一条目数据包括在与目标滚动方向相反的方向上，最靠近显示窗口的至少一个条目数据；将预渲染条目数据按照条目数据的目标滚动方向，滚动至显示窗口内并进行完全渲染，以实现条目化数据的滚动显示。
随着网络技术的发展，特别随着Web技术的不断成熟，B/S这种软件体系结构出现了。B/S（Browser/Server）架构也被称为浏览器/服务器体系结构，这种体系结构可以理解为是对C/S结构体系的改变和促进，由于网络的快速发展，B/S结构的功能越来越强大，这种结构可以进行信息分布式处理，可以有效降低资源成本，提高设计的***性能。B/S架构有更广的应用范围，在处理模式上大大简化了客户端，用户只需安装浏览器即可，而将应用逻辑集中在服务器和中间件上，可以提高数据处理性能。
越来越多的用户选择使用B/S架构的软件***进行需求信息管理，在管理的过程中对需求信息结构化存储及大批量数据展示处理要求也越来越高，如何使用户能够快速地查看、检索需求信息数据，提高用户工作效率也变成一个亟需解决的问题。
由于B/S架构依赖于客户端浏览器，因此也就存在了大数据量需求信息在展示时的性能问题。如数据量过大浏览器崩溃、加载时间长、界面显示卡顿、数据加载错乱、浏览器兼容等问题，极大的影响***的可用性及相关用户的工作效率。使用传统的滚动方式，用户需要等待所有数据加载完毕并渲染，这会消耗大量的时间和内存。而虚拟滚动只渲染视口内的数据，能够大大减少DOM操作，减少渲染时间和内存占用，但是当用户进行滚动时，对进入视口内的新数据进行渲染依然会消耗一定时间，在面对较大条目化数据量显示的场景下，比如在网络购物平台上展示的商品清单、浏览历史新闻信息等场景，涉及的数据条目高达数十万，看似极小的时间消耗在巨大数量的累积下可能就会产生数据卡滞、显示卡顿等影响数据显示质量的问题。
为此，本申请提供一种解决方案，通过用户发起的操作来触发虚拟滚动进行数据显示，并实时响应显示指令来获得条目数据的目标滚动方向，随即可确定与目标滚动方向相反的方向上的条目数据将会进入到显示窗口内进行渲染并显示，在其进入显示窗口之前先对其进行预渲染，并且由于预渲染是在显示窗口之外与显示窗口内数据渲染同步进行的，经过预渲染过后的条目数据在进入到显示窗口内进行完全渲染时，所需要消耗的渲染及显示时间就会进一步减少，采用前述方式持续进行，即可实现大量条目化数据的虚拟滚动快速显示，并降低新数据替换时的渲染消耗时间，提升数据显示的质量。
参照附图1，附图1为本申请实施例方案涉及的硬件运行环境的电子设备结构示意图，该电子设备可以包括：处理器101，例如中央处理器（Central Processing Unit，CPU），通信总线102、用户接口104，网络接口103，存储器105。其中，通信总线102用于实现这些组件之间的连接通信。用户接口104可以包括显示屏（Display）、输入单元比如键盘（Keyboard），可选用户接口104还可以包括标准的有线接口、无线接口。网络接口103可选的可以包括标准的有线接口、无线接口（如无线保真（WIreless-FIdelity，WI-FI）接口）。存储器105可选的可以是独立于前述处理器101的存储装置，存储器105可能是高速的随机存取存储器（Random Access Memory，RAM）存储器，也可能是稳定的非易失性存储器（Non-Volatile Memory，NVM），例如至少一个磁盘存储器；处理器101可以是通用处理器，包括中央处理器、网络处理器等，还可以是数字信号处理器、专用集成电路、现场可编程门阵列或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件。
本领域技术人员可以理解，附图1中示出的结构并不构成对电子设备的限定，可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件布置。
如附图1所示，作为一种存储介质的存储器105中可以包括操作***、网络通信模块、用户接口模块以及条目化数据显示装置。
在附图1所示的电子设备中，网络接口103主要用于与网络服务器进行数据通信；用户接口104主要用于与用户进行数据交互；本申请中的处理器101、存储器105可以设置在电子设备中，电子设备通过处理器101调用存储器105中存储的条目化数据显示装置，并执行本申请实施例提供的条目化数据显示方法。
参照附图2，基于前述实施例的硬件设备，本申请的实施例提供一种条目化数据显示方法，包括以下步骤：
S10：根据用户发起的虚拟滚动触发操作，生成条目数据显示指令。
在具体实施过程中，虚拟滚动，也即综合数据分页和无限滚动的方法，在有限的视口内只渲染可被观看的数据，超出视口之外的数据不进行渲染，可以通过计算可视范围内的单元格，保证每一次滚动渲染的DOM元素都是可控的，不会担心像数据分页一样一次渲染过多，也不会存在像无限滚动方案那样的数据堆积。
用户发起虚拟滚动触发操作，可以看作是将要把数据链运作起来的操作，比如在有操作硬件支持下，触发操作可以是鼠标滚轮的滑动操作，也可以是键盘上、下按键的敲击操作，在如触摸屏的操作环境下，触发操作可以是用户利用手指进行的点击操作或者在触摸屏上的滑动操作。当然，虚拟滚动也可以是自动进行的，而此时用户的触发操作也就只需要触发自动虚拟滚动开始即可，确保数据显示与触发操作的同步，以用户的触发操作作为信号，同步生成条目数据显示指令。
S20：响应于条目数据显示指令，获取条目数据的目标滚动方向。
在具体实施过程中，本申请实施例采用的是虚拟滚动的方式显示数据，在数据滚动下不断更换视口内的数据进行渲染和显示即可实现，收到的条目数据显示指令，也就是将要进行条目化数据的滚动显示指令。响应于该指令，先获取条目数据将要滚动的方向，也即目标滚动方向，如利用鼠标进行操作时，鼠标滚轮的转动与数据滚动同步，滚轮滚动的方向即可看做条目数据的目标滚动方向；又如采用触摸屏操作时，用户用手指点击屏幕后沿着排列的条目数据的某一方向进行滑动，该滑动的方向即可认为是条目数据的目标滚动方向。
S30：根据条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据；其中，第一条目数据包括在与目标滚动方向相反的方向上，最靠近显示窗口的至少一个条目数据。
在具体实施过程中，显示窗口也即视口，传统的虚拟滚动技术中，在显示窗口内的数据进行渲染并显示，显示窗口以外的数据不进行渲染。以显示窗口作为滚动方向的分界，条目数据向目标滚动方向滚动，也就是从显示窗口开始向目标滚动方向的反方向上的条目数据会逐条进入显示窗口内被渲染，并且越靠近显示窗口的条目数据会越先进入。在其将要进入之前，通过对滚动方向的提前获取，对将要进入显示窗口的条目数据进行预渲染，这些条目数据记为第一条目数据，预渲染之后即为预渲染条目数据。
预渲染，也即提前生成并缓存页面的静态HTML内容，当用户首次访问时，不需要进行实时的服务器渲染或客户端渲染，而是直接返回预渲染的静态HTML，从而提升加载速度。从时序上简单来说，就是把完整的渲染过程由时序进行分割，将一些处于最终渲染成型之外的工作提前做好以节约最终渲染的时间。
以第一条目数据包括一个最靠近显示窗口的条目数据为例，由显示窗口开始向目标滚动方向的反方向查询，第一个条目数据记为一号数据，第二个记为二号数据，以此类推，一号数据进行预渲染，在一号数据进行了预渲染并进入显示窗口后，二号数据则作为最靠近显示窗口的条目数据，则对二号数据进行预渲染，如此循环即实现了条目数据的滚动显示。
在一种实施例中，根据条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据之前，条目化数据显示方法还包括：
响应于条目数据显示指令，获取条目数据的滚动速度。
在具体实施过程中，在相对自由的操作环境下，虚拟滚动中条目数据的滚动速度可以由用户来决定，比如用户滑动鼠标滚轮的速度，或者用户在触摸屏上滑动的速度。而自动进行的虚拟滚动中条目数据的滚动速度相对固定，通过预置参数或者用户自行设定参数控制滚动速度即可。综合考虑多种情况，滚动速度各不相同，为了使预渲染的进度能够匹配滚动进度，获得滚动速度来指导第一条目数据的获得，滚动速度越快，那么第一条目数据中所包括的最靠近显示窗口的条目数据就越多，也即，根据条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据，包括：
根据条目数据的目标滚动方向以及条目数据的滚动速度，对第一条目数据进行预渲染，获得预渲染条目数据。
S40：将预渲染条目数据按照条目数据的目标滚动方向，滚动至显示窗口内并进行完全渲染，以实现条目化数据的滚动显示。
在具体实施过程中，在将第一条目数据进行预渲染之后，即可按照目标滚动方向将条目数据动起来以在显示窗口上进行数据的滚动显示，预渲染条目数据滚动至显示窗口内后即进行完全渲染，也即对数据的所有元素在页面进行可视化，通过代码将数据动态地***到HTML页面中，以此实现页面内容的更新和显示，在条目数据不断滚动下，前述方法不断循环进行，在显示窗口内的可视化数据即可由滚动显示呈现。
本实施例中，通过用户发起的操作来触发虚拟滚动进行数据显示，并实时响应显示指令来获得条目数据的目标滚动方向，随即可确定与目标滚动方向相反的方向上的条目数据将会进入到显示窗口内进行渲染并显示，在其进入显示窗口之前先对其进行预渲染，并且由于预渲染是在显示窗口之外与显示窗口内数据渲染同步进行的，经过预渲染过后的条目数据在进入到显示窗口内进行完全渲染时，所需要消耗的渲染及显示时间就会进一步减少，采用前述方式持续进行，即可实现大量条目化数据的虚拟滚动快速显示，并降低新数据替换时的渲染消耗时间，提升数据显示的质量。
在一种实施例中，将预渲染条目数据按照条目数据的目标滚动方向，滚动至显示窗口内并进行完全渲染，以实现条目化数据的滚动显示之后，条目化数据显示方法还包括：
将完全渲染后的预渲染条目数据进行缓存，获得缓存条目数据。
在具体实施过程中，虚拟滚动的方向可以根据条目数据的排列方向改变，也即刚刚滚动进入显示窗口内的条目数据可能在下一刻就又反向滚动退出了显示窗口，若是下一时刻的滚动方向又再次改变，这个条目数据就可能再次经历预渲染、完全渲染的步骤，通过将已显示的条目数据，也即完全渲染后的预渲染条目数据进行缓存，在显示位置又到达该条目时，直接调取缓存数据即可快速显示。也即根据条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据之前，条目化数据显示方法还包括：
判断第一条目数据中是否存在缓存条目数据；
在第一条目数据中存在缓存条目数据的情况下，获得未渲染条目数据。
在具体实施过程中，由于在方向有变化时，第一条目数据中的条目数据数量并不一致，这就导致其中可能包含了已经缓存的和未缓存的数据，因此在进行预渲染之前，可以对第一条目数据进行校验，校验之后只需要将其中未渲染过的条目数据单独提取出来进行预渲染即可，进一步提升数据显示质量。
基于前述步骤，根据条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据，包括：
根据条目数据的目标滚动方向，对未渲染条目数据进行预渲染，获得预渲染条目数据。
在一种实施例中，将预渲染条目数据按照条目数据的目标滚动方向，滚动至显示窗口内并进行完全渲染，以实现条目化数据的滚动显示之后，条目化数据显示方法还包括：
识别显示窗口内条目化数据的目标字段；
判断包含目标字段的条目化数据是否为目标数据；
在包含目标字段的条目化数据不为目标数据的情况下，返回将预渲染条目数据按照条目数据的目标滚动方向，滚动至显示窗口内并进行完全渲染，以实现条目化数据的滚动显示的步骤，直至包含目标字段的条目化数据为目标数据，输出目标数据。
在具体实施过程中，大量条目数据的滚动显示通常伴随着在其中寻找目标数据，通过提前设立目标字段，也即要查找的条目数据的全称，或者其中的关键词，比如以网购平台的商品清单的条目数据为例，目标字段设置为XX洗衣机，那么直接显示窗口内的条目化数据中进行XX洗衣机的匹配即可。如果用户仅仅知道需要查找的商品为洗衣机，在未显示到条目数据的情况下无法得知具体是哪一条数据对应的商品时，那么目标字段设置洗衣机即可，匹配到目标字段后用户根据可视化的条目数据判断该条数据是否是其需要查询的目标数据即可。如若不是，则随着条目数据的滚动显示继续查找目标数据，如果是，则将目标数据输出给用户即可。
在一种实施例中，响应于条目数据显示指令，获取条目数据的目标滚动方向之前，条目化数据显示方法还包括：
根据需求信息的类别，建立分类模块信息；
将需求信息录入分类模块信息中，获得条目数据。
在具体实施过程中，精细化条目化的结构需求信息数据存储，通过对需求信息进行规范标准、分级、分类；有效固化需求细化、分配、验证与确认过程信息；能够保障“需求”在各组织间、各研制阶段、***全生命周期中，规范、准确、完整的传递。首先对需求信息进行分类处理，让数据中一个类别信息成为一个对应的目录或模块，在目录中可创建多个分类模块信息，然后在模块信息中进行需求信息逐条录入，支持文本、富文本对象、word、Excel等格式数据，并支持用户对条目不同需求属性数据的维护存储，最大程度地兼顾本土化需求解析、存储、管理操作习惯，更大程度的提升需求管理工作效率。
在一种实施例中，将需求信息录入分类模块信息中，获得条目数据，包括：
将需求信息录入分类模块信息中，获得需求条目；
根据需求条目进行分级，获得条目数据。
在具体实施过程中，在将需求信息录入分类模块信息的过程中，将需求条目分级，比如分为标题、正文两大级别，标题与标题之间存在父子关系，在条目化的同时最大保留用户的word编辑习惯。并且对用户编辑条目化需求时的改动进行详细记录，以保证需求条目信息的可追溯性。
参照附图3，基于与前述实施例中同样的发明构思，本申请实施例还提供一种条目化数据显示装置，包括：
指令生成模块，指令生成模块用于根据用户发起的虚拟滚动触发操作，生成条目数据显示指令；
获取模块，获取模块用于响应于条目数据显示指令，获取条目数据的目标滚动方向；
预渲染模块，预渲染模块用于根据条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据；其中，第一条目数据包括在与目标滚动方向相反的方向上，最靠近显示窗口的至少一个条目数据；
显示模块，显示模块用于将预渲染条目数据按照条目数据的目标滚动方向，滚动至显示窗口内并进行完全渲染，以实现条目化数据的滚动显示。
本领域技术人员应当理解，实施例中的各个模块的划分仅仅是一种逻辑功能的划分，实际应用时可以全部或部分集成到一个或多个实际载体上，且这些模块可以全部以软件通过处理单元调用的形式实现，也可以全部以硬件的形式实现，或是以软件、硬件结合的形式实现，需要说明的是，本实施例中条目化数据显示装置中各模块是与前述实施例中的条目化数据显示方法中的各步骤一一对应，因此，本实施例的具体实施方式可参照前述条目化数据显示方法的实施方式，这里不再赘述。
基于与前述实施例中同样的发明构思，本申请的实施例还提供一种计算机可读存储介质，储存有计算机程序，计算机程序被处理器加载执行时，实现如本申请实施例提供的条目化数据显示方法。
基于与前述实施例中同样的发明构思，本申请的实施例还提供一种电子设备，包括处理器及存储器，其中，
存储器用于存储计算机程序；
处理器用于加载执行计算机程序，以使电子设备执行如本申请实施例提供的条目化数据显示方法。
在一些实施例中，计算机可读存储介质可以是FRAM、ROM、PROM、EPROM、EEPROM、闪存、磁表面存储器、光盘、或CD-ROM等存储器；也可以是包括上述存储器之一或任意组合的各种设备。计算机可以是包括智能终端和服务器在内的各种计算设备。
在一些实施例中，可执行指令可以采用程序、软件、软件模块、脚本或代码的形式，按任意形式的编程语言（包括编译或解释语言，或者声明性或过程性语言）来编写，并且其可按任意形式部署，包括被部署为独立的程序或者被部署为模块、组件、子例程或者适合在计算环境中使用的其它单元。
作为示例，可执行指令可以但不一定对应于文件***中的文件，可以可被存储在保存其它程序或数据的文件的一部分，例如，存储在超文本标记语言（HTML，Hyper TextMarkup Language）文档中的一个或多个脚本中，存储在专用于所讨论的程序的单个文件中，或者，存储在多个协同文件（例如，存储一个或多个模块、子程序或代码部分的文件）中。
作为示例，可执行指令可被部署为在一个计算设备上执行，或者在位于一个地点的多个计算设备上执行，又或者，在分布在多个地点且通过通信网络互连的多个计算设备上执行。
需要说明的是，在本文中，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者***不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者***所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括该要素的过程、方法、物品或者***中还存在另外的相同要素。
上述本申请实施例序号仅仅为了描述，不代表实施例的优劣。
通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件，但很多情况下前者是更佳的实施方式。基于这样的理解，本申请的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质（如只读存储器/随机存取存储器、磁碟、光盘）中，包括若干指令用以使得一台多媒体终端设备(可以是手机，计算机，电视接收机，或者网络设备等)执行本申请各个实施例所述的方法。
综上，本申请提供的一种条目化数据显示方法、装置、存储介质及电子设备，该方法包括：根据用户发起的虚拟滚动触发操作，生成条目数据显示指令；响应于条目数据显示指令，获取条目数据的目标滚动方向；根据条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据；其中，第一条目数据包括在与目标滚动方向相反的方向上，最靠近显示窗口的至少一个条目数据；将预渲染条目数据按照条目数据的目标滚动方向，滚动至显示窗口内并进行完全渲染，以实现条目化数据的滚动显示。本申请通过用户发起的操作来触发虚拟滚动进行数据显示，并实时响应显示指令来获得条目数据的目标滚动方向，随即可确定与目标滚动方向相反的方向上的条目数据将会进入到显示窗口内进行渲染并显示，在其进入显示窗口之前先对其进行预渲染，并且由于预渲染是在显示窗口之外与显示窗口内数据渲染同步进行的，经过预渲染过后的条目数据在进入到显示窗口内进行完全渲染时，所需要消耗的渲染及显示时间就会进一步减少，采用前述方式持续进行，即可实现大量条目化数据的虚拟滚动快速显示，并降低新数据替换时的渲染消耗时间，提升数据显示的质量。
以上所述仅为本申请的较佳实施例，并不用以限制本申请，凡在本申请的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本申请的保护范围之内。
Claims (8)
1.一种条目化数据显示方法，其特征在于，包括以下步骤：
根据用户发起的虚拟滚动触发操作，生成条目数据显示指令；
响应于所述条目数据显示指令，获取条目数据的目标滚动方向；
根据所述条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据；其中，所述第一条目数据包括在与所述目标滚动方向相反的方向上，最靠近显示窗口的至少一个所述条目数据；
将所述预渲染条目数据按照所述条目数据的目标滚动方向，滚动至所述显示窗口内并进行完全渲染，以实现条目化数据的滚动显示；其中，所述预渲染和所述完全渲染根据对渲染过程在不同时序分割获得，所述预渲染为提前生成并缓存页面的静态HTML内容，所述完全渲染为通过代码将数据动态地***到HTML页面中；
所述将所述预渲染条目数据按照所述条目数据的目标滚动方向，滚动至所述显示窗口内并进行完全渲染，以实现条目化数据的滚动显示之后，所述条目化数据显示方法还包括：
将完全渲染后的所述预渲染条目数据进行缓存，获得缓存条目数据；
所述根据所述条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据之前，所述条目化数据显示方法还包括：
判断所述第一条目数据中是否存在所述缓存条目数据；
在所述第一条目数据中存在所述缓存条目数据的情况下，获得未渲染条目数据；
所述根据所述条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据，包括：
根据所述条目数据的目标滚动方向，对所述未渲染条目数据进行预渲染，获得预渲染条目数据。
2.根据权利要求1所述的条目化数据显示方法，其特征在于，所述根据所述条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据之前，所述条目化数据显示方法还包括：
响应于所述条目数据显示指令，获取所述条目数据的滚动速度；
所述根据所述条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据，包括：
根据所述条目数据的目标滚动方向以及所述条目数据的滚动速度，对第一条目数据进行预渲染，获得预渲染条目数据。
3.根据权利要求1所述的条目化数据显示方法，其特征在于，所述将所述预渲染条目数据按照所述条目数据的目标滚动方向，滚动至所述显示窗口内并进行完全渲染，以实现条目化数据的滚动显示之后，所述条目化数据显示方法还包括：
识别所述显示窗口内所述条目化数据的目标字段；
判断包含所述目标字段的所述条目化数据是否为目标数据；
在包含所述目标字段的所述条目化数据不为所述目标数据的情况下，返回所述将所述预渲染条目数据按照所述条目数据的目标滚动方向，滚动至所述显示窗口内并进行完全渲染，以实现条目化数据的滚动显示的步骤，直至包含所述目标字段的所述条目化数据为所述目标数据，输出所述目标数据。
4.根据权利要求1所述的条目化数据显示方法，其特征在于，所述响应于所述条目数据显示指令，获取条目数据的目标滚动方向之前，所述条目化数据显示方法还包括：
根据需求信息的类别，建立分类模块信息；
将所述需求信息录入所述分类模块信息中，获得所述条目数据。
5.根据权利要求4所述的条目化数据显示方法，其特征在于，所述将所述需求信息录入所述分类模块信息中，获得所述条目数据，包括：
将所述需求信息录入所述分类模块信息中，获得需求条目；
根据所述需求条目进行分级，获得所述条目数据。
6.一种条目化数据显示装置，其特征在于，包括：
指令生成模块，所述指令生成模块用于根据用户发起的虚拟滚动触发操作，生成条目数据显示指令；
获取模块，所述获取模块用于响应于所述条目数据显示指令，获取条目数据的目标滚动方向；
预渲染模块，所述预渲染模块用于根据所述条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据；其中，所述第一条目数据包括在与所述目标滚动方向相反的方向上，最靠近显示窗口的至少一个所述条目数据；
显示模块，所述显示模块用于将所述预渲染条目数据按照所述条目数据的目标滚动方向，滚动至所述显示窗口内并进行完全渲染，以实现条目化数据的滚动显示；其中，所述预渲染和所述完全渲染根据对渲染过程在不同时序分割获得，所述预渲染为提前生成并缓存页面的静态HTML内容，所述完全渲染为通过代码将数据动态地***到HTML页面中；
所述将所述预渲染条目数据按照所述条目数据的目标滚动方向，滚动至所述显示窗口内并进行完全渲染，以实现条目化数据的滚动显示之后，还包括：
将完全渲染后的所述预渲染条目数据进行缓存，获得缓存条目数据；
所述根据所述条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据之前，还包括：
判断所述第一条目数据中是否存在所述缓存条目数据；
在所述第一条目数据中存在所述缓存条目数据的情况下，获得未渲染条目数据；
所述根据所述条目数据的目标滚动方向，对第一条目数据进行预渲染，获得预渲染条目数据，包括：
根据所述条目数据的目标滚动方向，对所述未渲染条目数据进行预渲染，获得预渲染条目数据。
7.一种计算机可读存储介质，储存有计算机程序，其特征在于，所述计算机程序被处理器加载执行时，实现如权利要求1-5中任一项所述的条目化数据显示方法。
8.一种电子设备，其特征在于，包括处理器及存储器，其中，
所述存储器用于存储计算机程序；
所述处理器用于加载执行所述计算机程序，以使所述电子设备执行如权利要求1-5中任一项所述的条目化数据显示方法。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202410025160.5A CN117520691B (zh) | 2024-01-08 | 2024-01-08 | 一种条目化数据显示方法、装置、存储介质及电子设备 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202410025160.5A CN117520691B (zh) | 2024-01-08 | 2024-01-08 | 一种条目化数据显示方法、装置、存储介质及电子设备 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN117520691A CN117520691A (zh) | 2024-02-06 |
| CN117520691B true CN117520691B (zh) | 2024-04-02 |
Family
ID=89763089
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202410025160.5A Active CN117520691B (zh) | 2024-01-08 | 2024-01-08 | 一种条目化数据显示方法、装置、存储介质及电子设备 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN117520691B (zh) |
Citations (12)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN110704574A (zh) * | 2019-09-03 | 2020-01-17 | 福建省农村信用社联合社 | 一种银行业务需求资产管理的方法以及*** |
| CN110851058A (zh) * | 2019-11-11 | 2020-02-28 | 支付宝(杭州)信息技术有限公司 | 一种页面虚拟滚动方法、装置及设备 |
| CN112115388A (zh) * | 2020-09-09 | 2020-12-22 | 深圳市欢太科技有限公司 | 网页的显示方法、移动终端及计算机可读存储介质 |
| CN113392353A (zh) * | 2021-06-18 | 2021-09-14 | 网易（杭州）网络有限公司 | 网站页面的加载方法、装置、电子设备及存储介质 |
| CN113467871A (zh) * | 2021-06-28 | 2021-10-01 | 康键信息技术（深圳）有限公司 | H5页面展示方法、装置、设备及存储介质 |
| CN114065080A (zh) * | 2021-11-26 | 2022-02-18 | 腾讯科技（深圳）有限公司 | 页面渲染方法、装置、设备及计算机可读存储介质 |
| CN114510190A (zh) * | 2022-04-18 | 2022-05-17 | 苏州万店掌网络科技有限公司 | 一种前端页面渲染方法、装置、设备及存储介质 |
| CN114691926A (zh) * | 2022-03-16 | 2022-07-01 | 联想(北京)有限公司 | 一种信息显示方法及电子设备 |
| CN116578795A (zh) * | 2023-04-14 | 2023-08-11 | 网易（杭州）网络有限公司 | 网页页面的生成方法及装置、存储介质、电子设备 |
| CN116595281A (zh) * | 2023-05-17 | 2023-08-15 | 北京度商软件技术有限公司 | 一种页面渲染方法、装置、设备以及存储介质 |
| CN116821533A (zh) * | 2023-06-15 | 2023-09-29 | 腾讯音乐娱乐科技（深圳）有限公司 | 页面渲染方法、计算机设备和计算机可读存储介质 |
| CN117111799A (zh) * | 2022-05-17 | 2023-11-24 | 北京京东振世信息技术有限公司 | 数据展示方法及装置、存储介质及电子设备 |
Family Cites Families (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20140082468A1 (en) * | 2012-09-14 | 2014-03-20 | Adrian Alexander May | Browser for rating pages with respect to search goals |
| US11483415B2 (en) * | 2014-07-16 | 2022-10-25 | Tensera Networks Ltd. | Background pre-rendering of user applications |
| US9852759B2 (en) * | 2014-10-25 | 2017-12-26 | Yieldmo, Inc. | Methods for serving interactive content to a user |
| US11809811B2 (en) * | 2014-10-25 | 2023-11-07 | Yieldmo, Inc. | Methods for serving interactive content to a user |
| US20180032491A1 (en) * | 2016-07-26 | 2018-02-01 | Google Inc. | Web page display systems and methods |
| WO2022040283A1 (en) * | 2020-08-18 | 2022-02-24 | Plaid Inc. | System and method for managing user interaction flows within third party applications |
-
2024
- 2024-01-08 CN CN202410025160.5A patent/CN117520691B/zh active Active
Patent Citations (12)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN110704574A (zh) * | 2019-09-03 | 2020-01-17 | 福建省农村信用社联合社 | 一种银行业务需求资产管理的方法以及*** |
| CN110851058A (zh) * | 2019-11-11 | 2020-02-28 | 支付宝(杭州)信息技术有限公司 | 一种页面虚拟滚动方法、装置及设备 |
| CN112115388A (zh) * | 2020-09-09 | 2020-12-22 | 深圳市欢太科技有限公司 | 网页的显示方法、移动终端及计算机可读存储介质 |
| CN113392353A (zh) * | 2021-06-18 | 2021-09-14 | 网易（杭州）网络有限公司 | 网站页面的加载方法、装置、电子设备及存储介质 |
| CN113467871A (zh) * | 2021-06-28 | 2021-10-01 | 康键信息技术（深圳）有限公司 | H5页面展示方法、装置、设备及存储介质 |
| CN114065080A (zh) * | 2021-11-26 | 2022-02-18 | 腾讯科技（深圳）有限公司 | 页面渲染方法、装置、设备及计算机可读存储介质 |
| CN114691926A (zh) * | 2022-03-16 | 2022-07-01 | 联想(北京)有限公司 | 一种信息显示方法及电子设备 |
| CN114510190A (zh) * | 2022-04-18 | 2022-05-17 | 苏州万店掌网络科技有限公司 | 一种前端页面渲染方法、装置、设备及存储介质 |
| CN117111799A (zh) * | 2022-05-17 | 2023-11-24 | 北京京东振世信息技术有限公司 | 数据展示方法及装置、存储介质及电子设备 |
| CN116578795A (zh) * | 2023-04-14 | 2023-08-11 | 网易（杭州）网络有限公司 | 网页页面的生成方法及装置、存储介质、电子设备 |
| CN116595281A (zh) * | 2023-05-17 | 2023-08-15 | 北京度商软件技术有限公司 | 一种页面渲染方法、装置、设备以及存储介质 |
| CN116821533A (zh) * | 2023-06-15 | 2023-09-29 | 腾讯音乐娱乐科技（深圳）有限公司 | 页面渲染方法、计算机设备和计算机可读存储介质 |
Non-Patent Citations (3)
| Title |
|---|
| Differentiable signed distance function rendering;Delio Vicini 等;《ACM Transactions on Graphics》;20220722;1-8 * |
| 云平台下Web前端的若干优化技术的研究与实现;潘文文;《信息科技》;20200715;1-83 * |
| 基于RTT的三维模型标签实时显示技术;田壮 等;《 现代电子技术》;20151015;55-58 * |
Also Published As
| Publication number | Publication date |
|---|---|
| CN117520691A (zh) | 2024-02-06 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US10318095B2 (en) | Reader mode presentation of web content | |
| US9773069B2 (en) | Pre-fetching of network page content in a browser application | |
| CN108804707B (zh) | 一种页面处理方法、装置以及相关设备 | |
| CN110209966B (zh) | 一种网页刷新方法、网页***及电子设备 | |
| CN108717437B (zh) | 搜索结果展示方法、装置及存储介质 | |
| CN108595697B (zh) | 网页集成方法、装置及*** | |
| CN108717435A (zh) | 网页加载方法、信息处理方法、计算机设备及存储介质 | |
| CN105243058A (zh) | 一种网页内容翻译方法及电子设备 | |
| CN112631591B (zh) | 表元素联动方法、装置、设备与计算机可读存储介质 | |
| US12020071B2 (en) | Resource pre-fetch using age threshold | |
| CN106874326A (zh) | 一种条目列表获取请求处理方法及装置 | |
| CN113392358A (zh) | 静态资源的预加载方法及装置 | |
| CN111898050B (zh) | 一种自动加载下一篇新闻的方法及*** | |
| CN107391534B (zh) | 页面显示、页面文件返回方法及装置、计算机存储介质 | |
| CN108319474B (zh) | 一种页面信息生成方法、装置和设备 | |
| CN111813468A (zh) | 屏蔽网页操作的方法、装置及电子设备 | |
| CN110968314A (zh) | 一种页面生成方法及装置 | |
| CN108664191B (zh) | ***访问方法及装置 | |
| CN114329281A (zh) | 渲染服务器、网页渲染方法及装置 | |
| CN117520691B (zh) | 一种条目化数据显示方法、装置、存储介质及电子设备 | |
| CN108268298B (zh) | 桌面图标的生成方法、装置、存储介质及电子设备 | |
| CN113805997B (zh) | 信息显示方法、装置、电子设备和存储介质 | |
| CN114817803A (zh) | 一种页面跳转方法、装置和电子设备 | |
| CN114528510A (zh) | 网页数据处理的方法、装置、电子设备及介质 | |
| CN114186148A (zh) | 页面加载方法、装置、电子设备及存储介质 |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |