一种页面渲染方法、装置、设备及可读存储介质制造方法及图纸

本申请实施例提供了一种页面渲染方法、页面渲染装置、设备及可读存储介质，该方法包括：获取浏览器页面上的画布页元素；在内屏画布上渲染画布页元素，并在内屏画布上检测当前用户光标的坐标；将内屏画布上当前用户光标的坐标实时转换为外屏画布上当前用户光标的坐标；根据外屏画布上当前用户光标的坐标，在外屏画布上渲染当前用户光标。本申请实施例在内屏画布上渲染画布页元素，在外屏上渲染用户光标，通过分屏画布渲染的方式，避免光标渲染影响到画布页元素的渲染，提高在多画布页元素下渲染用户光标时画布的渲染性能，从而提高页面渲染效率。率。率。

【技术实现步骤摘要】
一种页面渲染方法、装置、设备及可读存储介质


[0001]本申请涉及计算机
，尤其涉及一种页面渲染方法、装置、设备及可读存储介质。

技术介绍

[0002]随着科学技术的发展，计算机和移动终端的软件技术和硬件技术都有了长足的进步。由于互联网技术的广泛应用，用户可以足不出户的情况下从网络上得到大量的信息，不但为用户的工作和学习提供了帮助，也丰富了用户的日常生活。如今，可以通过浏览器进行多用户之间的交互。
[0003]如今浏览器页面的布局越来越复杂，一个页面上往往包含了大量的信息，除了文字信息之外，还可能包含有图片、视频和其他多媒体信息。目前的页面渲染技术都是把页面上包含的所有元素和所有光标在一个画布中进行渲染，根据画布渲染的特性，移动光标需要重新渲染整个画布。对于包含内容较多的页面来说，一旦有一个光标发生移动，就需要将画布上包含的所有内容重新进行渲染，效率较低，会导致画布性能下降，也会对页面显示速度产生影响。页面渲染作为浏览器完成页面加载的其中一个重要步骤，如果渲染的效率低，会造成页面加载速度慢，影响用户浏览页面，因此，需要提供一种高性能的页面渲染方法。

技术实现思路

[0004]有鉴于此，本申请的目的在于提供了一种页面渲染方法、装置、设备及可读存储介质，以避免光标渲染影响到画布页元素的渲染，提高在多画布页元素下渲染用户光标时画布的渲染性能，从而提高页面渲染效率，其具体技术方案如下：
[0005]第一方面，本申请提供了一种页面渲染方法，所述方法包括：
[0006]获取浏览器页面上的画布页元素；
[0007]在内屏画布上渲染所述画布页元素，并在所述内屏画布上检测当前用户光标的坐标；
[0008]将所述内屏画布上当前用户光标的坐标实时转换为外屏画布上当前用户光标的坐标；
[0009]根据所述外屏画布上当前用户光标的坐标，在所述外屏画布上渲染所述当前用户光标。
[0010]在一种可能的实现方式中，所述将内屏画布上当前用户光标的坐标实时转换为外屏画布上当前用户光标的坐标，包括：
[0011]在所述内屏画布上渲染所述当前用户光标所在的透明元素；
[0012]将所述当前用户光标所在的透明元素的坐标实时转换为所述外屏画布上当前用户光标的坐标。
[0013]在一种可能的实现方式中，在所述在外屏画布上渲染当前用户光标之后，所述方法还包括：
[0014]通过所述内屏画布获取其他用户光标的坐标；
[0015]将所述内屏画布上其他用户光标的坐标实时转换为所述外屏画布上其他用户光标的坐标；
[0016]根据所述外屏画布上其他用户光标的坐标，在所述外屏画布上渲染所述其他用户光标。
[0017]在一种可能的实现方式中，在所述在外屏画布上渲染其他用户光标之后，所述方法还包括：
[0018]获取所述其他用户光标对应的用户信息；
[0019]在所述当前用户光标的坐标与所述其他用户光标的坐标相同时，在所述外屏画布上渲染所述其他用户光标对应的用户信息。
[0020]第二方面，本申请还提供了一种页面渲染装置，所述装置包括：
[0021]获取模块，用于获取浏览器页面上的画布页元素；
[0022]内屏画布渲染模块，用于在内屏画布上渲染所述画布页元素；
[0023]检测模块，用于在所述内屏画布上检测当前用户光标的坐标；
[0024]坐标转换模块，用于将所述内屏画布上当前用户光标的坐标实时转换为外屏画布上当前用户光标的坐标；
[0025]外屏画布渲染模块，用于根据所述外屏画布上当前用户光标的坐标，在所述外屏画布上渲染所述当前用户光标。
[0026]在一种可能的实现方式中，所述坐标转换模块，具体用于：
[0027]在所述内屏画布上渲染所述当前用户光标所在的透明元素；
[0028]将所述当前用户光标所在的透明元素的坐标实时转换为所述外屏画布上当前用户光标的坐标。
[0029]在一种可能的实现方式中，
[0030]所述获取模块，还用于通过所述内屏画布获取其他用户光标的坐标；
[0031]所述坐标转换模块，还用于将所述内屏画布上其他用户光标的坐标实时转换为所述外屏画布上其他用户光标的坐标；
[0032]所述外屏画布渲染模块，还用于根据所述外屏画布上其他用户光标的坐标，在所述外屏画布上渲染所述其他用户光标。
[0033]在一种可能的实现方式中，
[0034]所述获取模块，还用于获取所述其他用户光标对应的用户信息；
[0035]所述外屏画布渲染模块，还用于在所述当前用户光标的坐标与所述其他用户光标的坐标相同时，在所述外屏画布上渲染所述其他用户光标对应的用户信息。
[0036]第三方面，本申请还提供了一种计算机设备，所述计算机设备包括：存储器、收发器、处理器以及总线系统；
[0037]其中，所述存储器用于存储程序；
[0038]所述处理器用于执行所述存储器中的程序，以实现上述第一方面任一项所述的方法；
[0039]所述总线系统用于连接所述存储器以及所述处理器，以使所述存储器以及所述处理器进行通信。
[0040]第四方面，本申请还提供了一种计算机可读存储介质，所述计算机可读存储介质存储有指令，当其在计算机上运行时，使得计算机执行上述第一方面任一项所述的方法。
[0041]本申请实施例提供的方法，获取浏览器页面上的画布页元素；在内屏画布上渲染画布页元素，并在内屏画布上检测当前用户光标的坐标；将内屏画布上当前用户光标的坐标实时转换为外屏画布上当前用户光标的坐标；根据外屏画布上当前用户光标的坐标，在外屏画布上渲染当前用户光标。本申请实施例在内屏画布上渲染画布页元素，在外屏上渲染用户光标，通过分屏画布渲染的方式，避免光标渲染影响到画布页元素的渲染，提高在多画布页元素下渲染用户光标时画布的渲染性能，从而提高页面渲染效率。
附图说明
[0042]为了更清楚地说明本申请实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
[0043]图1示出了本申请提供的一种页面渲染方法实施例的流程图；
[0044]图2示出了本申请提供的一种画布演示模式下当前用户光标和其他用户光标的示意图；
[0045]图3示出了本申请提供的一种画布演示模式下当前用户光标聚集到其他用户光标的示意图；
[0046]图4示出了本申请提供的一种页面渲染装置的结构示意图。
具体实施方式
[0047]为使本申请实施例的目的、技术方案和优点更加清楚，下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种页面渲染方法，其特征在于，所述方法包括：获取浏览器页面上的画布页元素；在内屏画布上渲染所述画布页元素，并在所述内屏画布上检测当前用户光标的坐标；将所述内屏画布上当前用户光标的坐标实时转换为外屏画布上当前用户光标的坐标；根据所述外屏画布上当前用户光标的坐标，在所述外屏画布上渲染所述当前用户光标。2.根据权利要求1所述的方法，其特征在于，所述将内屏画布上当前用户光标的坐标实时转换为外屏画布上当前用户光标的坐标，包括：在所述内屏画布上渲染所述当前用户光标所在的透明元素；将所述当前用户光标所在的透明元素的坐标实时转换为所述外屏画布上当前用户光标的坐标。3.根据权利要求1至2任一项所述的方法，其特征在于，在所述在外屏画布上渲染当前用户光标之后，所述方法还包括：通过所述内屏画布获取其他用户光标的坐标；将所述内屏画布上其他用户光标的坐标实时转换为所述外屏画布上其他用户光标的坐标；根据所述外屏画布上其他用户光标的坐标，在所述外屏画布上渲染所述其他用户光标。4.根据权利要求3所述的方法，其特征在于，在所述外屏画布上渲染其他用户光标之后，所述方法还包括：获取所述其他用户光标对应的用户信息；在所述当前用户光标的坐标与所述其他用户光标的坐标相同时，在所述外屏画布上渲染所述其他用户光标对应的用户信息。5.一种页面渲染装置，其特征在于，所述装置包括：获取模块，用于获取浏览器页面上的画布页元素；内屏画布渲染模块，用于在内屏画布上渲染所述画布页元素；检测模块，用于在所述内屏画布上检测当前用户光标的坐标；坐标转换模块，用于将所述内...

【专利技术属性】
技术研发人员：李彦风，
申请(专利权)人：北京尽微致广信息技术有限公司，
类型：发明
国别省市：