消息展示方法、装置、电子设备及存储介质制造方法及图纸

技术编号:25599252 阅读:13 留言:0更新日期:2020-09-11 23:56
本申请涉及通讯技术领域,公开了一种消息展示方法、装置、电子设备及存储介质,其中,消息展示方法,包括:获取当前会话中待显示的全部聊天消息,确定用于展示聊天消息的可视区域的可视高度;根据所述可视高度及预设展示规则确定展示于所述可视区域的待展示消息;根据所述全部聊天消息及所述待展示消息确定隐藏消息;根据所述隐藏消息的内容及高度确定DOM隐藏节点,利用确定出的DOM隐藏节点表征所述隐藏消息,并通过所述DOM隐藏节点将所述隐藏消息展示于隐藏区;将所述待展示消息渲染后展示于可视区域。本申请提供的方案,避免对隐藏消息的渲染,减少隐藏消息对系统资源的占用,以优化页面展示性能。

【技术实现步骤摘要】
消息展示方法、装置、电子设备及存储介质
本申请涉及通讯
,具体而言,本申请涉及一种消息展示方法、装置、电子设备及存储介质。
技术介绍
即时通信随着节奏加快越来越流行,即时通信可以通过网页端及客户端展示,以网页端为例,对于即时通信的消息可以全量显示,也可以按需显示当前的聊天消息。即时通信中,可能会出现某一时间段接收到大量的聊天消息,该聊天消息的进行全量显示的数据处理量会非常大,当数据量大到一定程度时,消息展示界面就会卡顿,由于网页单线程的特点,全量显示所有聊天消息的做法会造成系统的全面卡顿,包括接收和发送消息都无法进行,页面展示性能差。
技术实现思路
本申请的目的旨在至少能解决上述的技术缺陷之一,特提出以下技术方案:本申请的一个方面,提供了一种消息展示方法,包括:获取当前会话中待显示的全部聊天消息,确定用于展示聊天消息的可视区域的可视高度;根据所述可视高度及预设展示规则确定展示于所述可视区域的待展示消息;根据所述全部聊天消息及所述待展示消息确定隐藏消息;根据所述隐藏消息的内容及高度确定DOM隐藏节点,利用确定出的DOM隐藏节点表征所述隐藏消息,并通过所述DOM隐藏节点将所述隐藏消息展示于隐藏区;将所述待展示消息渲染后展示于可视区域。本申请的另一个方面,提供了一种消息展示装置,该装置包括:获取聊天消息模块,用于获取当前会话中待显示的全部聊天消息,确定用于展示聊天消息的可视区域的可视高度;确定待展示消息模块,用于根据所述可视高度及预设展示规则确定展示于所述可视区域的待展示消息;确定隐藏消息模块,用于根据所述全部聊天消息及所述待展示消息确定隐藏消息;隐藏模块,用于根据所述隐藏消息的内容及高度确定DOM隐藏节点,利用确定出的DOM隐藏节点表征所述隐藏消息,并通过所述DOM隐藏节点将所述隐藏消息展示于隐藏区;展示模块,用于将所述待展示消息渲染后展示于可视区域。本申请的再一个方面,提供了一种电子设备,包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序,处理器执行程序时实现本申请第一方面所示的消息展示方法。本申请的又一个方面,提供了一种计算机可读存储介质,该计算机可读存储介质上存储有计算机程序,该计算机程序被处理器执行时实现本申请第一方面所示的消息展示方法。本申请提供的技术方案带来的有益效果是:本申请提供的消息展示方法,利用DOM隐藏节点表征至少一条隐藏消息,隐藏消息采用DOM隐藏节点替代并置于隐藏区,但隐藏区的隐藏消息未经过渲染,因此,减少对隐藏消息的渲染等处理对系统资源的占用,优化页面展示性能。而且,DOM隐藏节点中包含隐藏消息的内容及高度,能够实现对隐藏消息的重新加载显示。本申请提供的消息展示方法,对聊天消息采用倒序渲染的方式,即首先确定待展示消息中的最后一条消息,再根据每条待展示消息的渲染高度与可视高度确定展示在可视区域的第一条消息,将显示位置处于可视区域顶端的第一条消息至可视区域底端的最后一条消息之间的消息以及该第一条消息、该最后一条消息作为待展示消息。本申请利用滚动轴的位置首先确定可视区域的最后一条消息,结合有可能显示在可视区域的聊天消息的渲染高度倒序确定可视区域的第一条消息,能够准确地确定可视区域中显示的所有待展示消息,进而实现隐藏消息的准确确定。本申请附加的方面和优点将在下面的描述中部分给出,这些将从下面的描述中变得明显,或通过本申请的实践了解到。附图说明本申请上述的和/或附加的方面和优点从下面结合附图对实施例的描述中将变得明显和容易理解,其中:图1为本申请一个实施例提供的消息展示方法的流程图;图2-1为本申请一个实施例提供的当前界面上的聊天窗口为空白时对应的界面展示图;图2-2为本申请一个实施例提供的页面上无滚动轴,将所有聊天消息展示于可视区域的界面展示图;图2-3为本申请一个实施例提供的可视区域出现滚动轴,且滚动轴在可视区域最底端时,聊天消息的界面展示图;图3为本申请一个实施例提供的一条聊天消息包括的节点示意图;图4为本申请一个实施例提供的聊天消息的分布图,该分布图中包括一个隐藏区;图5为本申请一个实施例提供的图4所示方案的实施流程图;图6为本申请另一个实施例提供聊天消息的分布图,该分布图中的隐藏区包括第一消息集所在区域及第二消息集所在区域;图7为本申请另一个实施例提供的图6所示方案的实施流程图;图8为本申请一个实施例提供的利用本申请提供的消息展示方法进行页面优化前后的页面布局对比图;图9为本申请实施例提供的一种消息展示装置的结构示意图;图10为本申请实施例提供的一种电子设备的结构示意图。具体实施方式下面详细描述本申请的实施例,实施例的示例在附图中示出,其中自始至终相同或类似的标号表示相同或类似的元件或具有相同或类似功能的元件。下面通过参考附图描述的实施例是示例性的,仅用于解释本申请,而不能解释为对本申请的限制。本
技术人员可以理解,除非特意声明,这里使用的单数形式“一”、“一个”、“所述”和“该”也可包括复数形式。应该进一步理解的是,本申请的说明书中使用的措辞“包括”是指存在特征、整数、步骤、操作、元件和/或组件,但是并不排除存在或添加一个或多个其他特征、整数、步骤、操作、元件、组件和/或它们的组。应该理解,当我们称元件被“连接”或“耦接”到另一元件时,它可以直接连接或耦接到其他元件,或者也可以存在中间元件。此外,这里使用的“连接”或“耦接”可以包括无线连接或无线耦接。这里使用的措辞“和/或”包括一个或更多个相关联的列出项的全部或任一单元和全部组合。本领域技术人员可以理解,除非另外定义,这里使用的所有术语(包括技术术语和科学术语),具有与本专利技术所属领域中的普通技术人员的一般理解相同的意义。还应该理解的是,诸如通用字典中定义的那些术语,应该被理解为具有与现有技术的上下文中的意义一致的意义,并且除非像这里一样被特定定义,否则不会用理想化或过于正式的含义来解释。DOM:文档对象模型,是浏览器描述网页节点的对象模型,方便开发人员对文档进行面向对象操作。专利技术人在研究过程中发现,由于聊天消息的内容长度不固定,渲染到用户界面上的高度也是不固定的,若每条消息设置固定的渲染高度,会出现内容无法完全展示的情况,因此,无法根据消息的条数简单计算消息在可视区域的渲染高度,也无法准确获知哪些消息能够展示在展示界面上。对于现有技术中所存在的技术问题,本申请提供的消息展示方法、装置、电子设备及存储介质,旨在解决现有技术的如上技术问题中的至少一项,能够减少对隐藏消息的数据处理量,进而提高页面展示性能。下面以具体实施例对本申请的技术方案以及本申请的技术方案如何解决上述技术问题进行详细说明。下面这几个具体的实施例可以相互结合,对于相同或相似的概念或过程可能在某些实施例中不再赘述。下面将结合附图,本文档来自技高网
...

【技术保护点】
1.一种消息展示方法,其特征在于,包括:/n获取当前会话中待显示的全部聊天消息,确定用于展示聊天消息的可视区域的可视高度;/n根据所述可视高度及预设展示规则确定展示于所述可视区域的待展示消息;/n根据所述全部聊天消息及所述待展示消息确定隐藏消息;/n根据所述隐藏消息的内容及高度确定DOM隐藏节点,利用确定出的DOM隐藏节点表征所述隐藏消息,并通过所述DOM隐藏节点将所述隐藏消息展示于隐藏区;/n将所述待展示消息渲染后展示于可视区域。/n

【技术特征摘要】
1.一种消息展示方法,其特征在于,包括:
获取当前会话中待显示的全部聊天消息,确定用于展示聊天消息的可视区域的可视高度;
根据所述可视高度及预设展示规则确定展示于所述可视区域的待展示消息;
根据所述全部聊天消息及所述待展示消息确定隐藏消息;
根据所述隐藏消息的内容及高度确定DOM隐藏节点,利用确定出的DOM隐藏节点表征所述隐藏消息,并通过所述DOM隐藏节点将所述隐藏消息展示于隐藏区;
将所述待展示消息渲染后展示于可视区域。


2.根据权利要求1所述的方法,其特征在于,当可视区域中存在滚动轴时,所述根据所述可视高度及预设展示规则确定展示于所述可视区域的待展示消息,包括:
获取当前滚动轴的位置,根据滚动轴的位置确定展示在所述可视区域底端的最后一条消息;
获取所述最后一条消息及接收时间在所述最后一条消息之前的若干条消息中每条消息的渲染高度;
根据每条消息的渲染高度及可视高度确定展示于可视区域顶端的第一条消息;
将所述第一条消息、所述最后一条消息及两者之间的消息确定为待展示消息。


3.根据权利要求2所述的方法,其特征在于,根据所述全部聊天消息及所述待展示消息确定隐藏消息,包括:
对所有聊天消息按照接收时间的先后顺序进行编号,获得所述最后一条消息的编号及所述第一条消息的编号;
若所述最后一条消息为当前接收到的最新消息,确定编号小于所述第一条消息的编号对应的消息为隐藏消息;
若所述最后一条消息并非当前接收到的最新消息,确定编号小于所述第一条消息的编号对应的第一消息集,以及,编号大于所述最后一条消息的编号对应的第二消息集,确定所述第一消息集与第二消息集为隐藏消息。


4.根据权利要求2所述的方法,其特征在于,所述将所述第一条消息、所述最后一条消息及两者之间的消息确定为待展示消息之后,还包括:
检测到滚动轴发生位置移动,根据滚动轴的移动方向及移动距离确定待加载消息;
加载相应DOM隐藏节点中所述待加载消息的内容,并渲染显示该待加载消息。


5.根据权利要求4所述的方法,其特征在于,所述加载相应DOM隐藏节点中所述待加载消息的内容,包括:
根据滚动轴移动后的位置确定待展示在所述可视区域底端的最后一条待加载消息的编号及第一条待加载消息的编号;
...

【专利技术属性】
技术研发人员:邝其毅
申请(专利权)人:腾讯科技深圳有限公司
类型:发明
国别省市:广东;44

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1