呈现信息的方法、装置及信息系统制造方法及图纸

本申请公开了一种呈现信息的方法、装置及信息系统，方法包括：判断预设的用于预存待呈现信息的呈现队列中信息数量是否小于第一预设数量，如果所述信息数量小于所述第一预设数量，向服务器请求第二预设数量的信息，将所述服务器返回的信息添加到所述呈现队列中，其中所述第二预设数量大于所述第一预设数量；当监测到可视窗口的滚动条向下滚动到滚动条上端与所述可视窗口底部的距离小于预设距离，则从所述呈现队列中取出所述第一预设数量的信息渲染并加载到所述可视窗口。本本申请的技术方案能缩短前端客户端渲染加载信息的延迟，减少用户操作时的卡顿现象。

Method, device and information system for presenting information

The invention discloses a method, device and presenting information information system. The method comprises the following steps: judging the default to be stored for presenting information show the number of queue information is smaller than the first preset number, if the information quantity is smaller than the first preset number to the server request second preset number information, add the server returns the information to the present cohort, wherein the second preset number is greater than the first preset number; when monitoring the scroll bar to scroll down to the window at the top of the scroll bar and the visual window at the bottom of the distance is less than a preset distance from the queue out of the show the first preset number of rendering information and loaded into the visual window. The technical scheme for this delay can shorten the front-end client rendering load information, reduce the user operation Caton phenomenon.

【技术实现步骤摘要】

本公开总体涉及网络
，具体页言，涉及一种呈现信息的方法、装置及信息系统。
技术介绍
客户端可采用瀑布流式的方式呈现图片或者例如信息，所谓瀑布流式的呈现方式就是随着页面的向下滚动，图片或者信息会自动不断的加载呈现出来。采用瀑布流式的方式呈现图片或者信息，一般需要在获取信息后进过渲染和加载才能最终将图片或信息呈现在页面上。每个商品的商品图片宽度相同高度不一，商品评论信息的长度也各不相同，所以每个呈现出来的商品单元高度不同，显示在页面上的时候就要计算占位。越到后面显示占位计算所需花的时间也会越长，所以渲染和加载所带来的延迟比较大，以至于服务器端请求的延迟加上前端客户端渲染加载的延迟会在页面的显示过程中造成明显的卡顿，用户体验很不好。相关技术可通过优化前端客户端渲染加载过程中图片占位的计算过程来试图缩短延迟，但是效果不明显。因此，需要一种新的呈现信息的方法及装置。在所述
技术介绍
部分公开的上述信息仅用于加强对本公开的背景的理解，因此它可以包括不构成对本领域普通技术人员已知的现有技术的信息。
技术实现思路
本公开提供一种呈现信息的方法及装置，能够缩短前端客户端渲染加载信息的延迟，减少用户操作时的卡顿现象。本公开的其他特性和优点将通过下面的详细描述变得显然，或部分地通过本公开的实践而习得。根据本公开的一方面，本专利技术实施例提供了一种呈现信息的方法，包括：判断预设的用于预存待呈现信息的呈现队列中信息数量是否小于第一预设数量，如果所述信息数量小于所述第一预设数量，向服务器请求第二预设数量的信息，将所述服务器返回的信息添加到所述呈现队列中，其中所述第二预设数量大于所述第一预设数量；当监测到可视窗口的滚动条向下滚动到滚动条上端与所述可视窗口底部的距离小于预设距离，则从所述呈现队列中取出所述第一预设数量的信息渲染并加载到所述可视窗口。根据本公开的一实施方式，所述第二预设数量为所述第一预设数量的N倍，其中N为大于2的整数。根据本公开的一实施方式，所述第一预设数量信息的呈现高度大于所述客户端的可视窗口的高度的1.5-2倍。根据本公开的一实施方式，所述预设距离大于所述信息的最小高度的2-3倍。根据本公开的一实施方式，所述向服务器请求第二预设数量的信息的操作包括：采用Ajax方式向服务器端请求所述第二预设数量的信息。根据本公开的一实施方式，在向服务器请求第二预设数量的信息的操作之前还包括，所述服务器采用Redis存储商品的排序信息，其中存储在所述Redis里的键值对中“键”是商品列表的种类信息，“值”是各商品列表的种类对应的商品排序信息。根据本公开的另一方面，本专利技术实施例提供了呈现信息的系统，包括：呈现队列预添加单元，用于判断预设的用于预存待呈现信息的呈现队列中信息数量是否小于第一预设数量，如果所述信息数量小于所述第一预设数量，向服务器请求第二预设数量的信息，将所述服务器返回的信息添加到所述呈现队列中，其中所述第二预设数量大于所述第一预设数量；预渲染与加载单元，用于当监测到可视窗口的滚动条向下滚动到滚动条上端与所述可视窗口底部的距离小于预设距离，则从所述呈现队列中取出所述第一预设数量的信息渲染并加载到所述可视窗口。根据本公开的一实施方式，所述第二预设数量为所述第一预设数量的N倍，其中N为大于2的整数。根据本公开的一实施方式，所述第一预设数量信息的呈现高度大于所述客户端的可视窗口的高度的1.5-2倍。根据本公开的一实施方式，所述预设距离大于所述信息的最小高度的2-3倍。根据本公开的一实施方式，所述呈现队列预添加单元用于，采用Ajax方式向服务器端请求所述第二预设数量的信息。根据本公开的另一方面，本专利技术实施例还提供了呈现信息的系统，包括配置于客户端的如上所述的呈现信息的系统，以及配置于服务器端的预排序单元，所述预排序单元用于采用Redis存储商品的排序信息，其中存储在所述Redis里的键值对中“键”是商品列表的种类信息，“值”是各商品列表的种类对应的商品排序信息。根据本公开的技术方案能够缩短客户端渲染加载信息的延迟，减少用户操作时的卡顿现象。应当理解的是，以上的一般描述和后文的细节描述仅是示例性的，并不能限制本公开。附图说明为了更清楚地说明本专利技术实施例中的技术方案，下面将对本专利技术实施例描述中所需要使用的附图作简单的介绍，显而易见地，下面描述中的附图仅仅是本专利技术的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据本专利技术实施例的内容和这些附图获得其他的附图。图1示意性示出根据本公开示例性实施例一的呈现信息的方法流程图；图2示意性示出根据本公开示例性实施例二的呈现信息的方法流程图；图3示意性示出根据本公开示例性实施例二的客户端和服务器端交互时序图；图4示意性示出根据本公开示例性实施例三的呈现信息的系统结构框图；图5示意性示出根据本公开示例性实施例四的信息系统结构框图。具体实施方式现在将参考附图更全面地描述示例实施方式。然而，示例实施方式能够以多种形式实施，且不应被理解为限于在此阐述的范例；相反，提供这些实施方式使得本公开将更加全面和完整，并将示例实施方式的构思全面地传达给本领域的技术人员。附图仅为本公开的示意性图解，并非一定是按比例绘制。图中相同的附图标记表示相同或类似的部分，因而将省略对它们的重复描述。此外，所描述的特征、结构或特性可以以任何合适的方式结合在一个或更多实施方式中。在下面的描述中，提供许多具体细节从而给出对本公开的实施方式的充分理解。然而，本领域技术人员将意识到，可以实践本公开的技术方案而省略所述特定细节中的一个或更多，或者可以采用其它的方法、组元、装置、步骤等。在其它情况下，不详细示出或描述公知结构、方法、装置、实现、材料或者操作以避免喧宾夺主而使得本公开的各方面变得模糊。附图中所示的一些方框图是功能实体，不一定必须与物理或逻辑上独立的实体相对应。可以采用软件形式来实现这些功能实体，或在一个或多个硬件模块或集成电路中实现这些功能实体，或在不同网络和/或处理器装置和/或微控制器装置中实现这些功能实体。为使本专利技术解决的技术问题、采用的技术方案和达到的技术效果更加清楚，下面将结合附图对本专利技术实施例的技术方案作进一步的详细描述，显然，所描述的实施例仅仅是本专利技术一部分实施例，而不是全部的实施例。本文档来自技高网...

【技术保护点】
一种呈现信息的方法，其特征在于，包括：判断预设的用于预存待呈现信息的呈现队列中信息数量是否小于第一预设数量，如果所述信息数量小于所述第一预设数量，向服务器请求第二预设数量的信息，将所述服务器返回的信息添加到所述呈现队列中，其中所述第二预设数量大于所述第一预设数量；当监测到可视窗口的滚动条向下滚动到滚动条上端与所述可视窗口底部的距离小于预设距离，则从所述呈现队列中取出所述第一预设数量的信息渲染并加载到所述可视窗口。

【技术特征摘要】
1.一种呈现信息的方法，其特征在于，包括：
判断预设的用于预存待呈现信息的呈现队列中信息数量是否小于第一预
设数量，如果所述信息数量小于所述第一预设数量，向服务器请求第二预设
数量的信息，将所述服务器返回的信息添加到所述呈现队列中，其中所述第
二预设数量大于所述第一预设数量；
当监测到可视窗口的滚动条向下滚动到滚动条上端与所述可视窗口底部
的距离小于预设距离，则从所述呈现队列中取出所述第一预设数量的信息渲
染并加载到所述可视窗口。
2.根据权利要求1所述的方法，其特征在于，所述第二预设数量为所述
第一预设数量的N倍，其中N为大于2的整数。
3.根据权利要求1或2所述的方法，其特征在于，所述第一预设数量信
息的呈现高度大于所述客户端的可视窗口的高度的1.5-2倍。
4.根据权利要求1或2所述的方法，其特征在于，所述预设距离大于所
述信息的最小高度的2-3倍。
5.根据权利要求1或2所述的方法，其特征在于，所述向服务器请求第
二预设数量的信息的操作包括：采用Ajax方式向服务器端请求所述第二预设
数量的信息。
6.根据权利要求1所述的方法，其特征在于，在向服务器请求第二预设
数量的信息的操作之前还包括，所述服务器采用Redis存储商品的排序信息，
其中存储在所述Redis里的键值对中“键”是商品列表的种类信息，“值”是各
商品列表的种类对应的商品排序信息。

【专利技术属性】
技术研发人员：余倩，
申请(专利权)人：网易杭州网络有限公司，
类型：发明
国别省市：浙江;33