CN106021421B - 一种加速网页渲染的方法及装置 - Google Patents

Abstract

本申请提供了一种加速网页渲染的方法及装置，其中，方法包括：接收网页元素的渲染指令；判断显存中是否缓存有所述网页元素，若所述显存中缓存有所述网页元素，则将显存中缓存的所述网页元素作为渲染结果，忽略所述渲染指令，否则响应所述渲染指令。本申请能够减少渲染占用的计算资源，提高网页的渲染速度，加快相似网页的显示进度。

Description

一种加速网页渲染的方法及装置

技术领域

本申请属于网页显示领域，特别涉及一种加速网页渲染的方法及装置。

背景技术

当前浏览器主要用于客户端，服务于单个用户，根据用户要求，获取、解析和渲染显示网页，这种应用场景存在如下特点：

1)用户独占资源，需要终端设备具有相对充足的资源，包括CPU，GPU，内存和显存等。

2)同一个网页，在同一时刻，被同时访问的可能性小，这意味着网页资源被重用的概率不高。

在视频云计算场景中，一台服务器上同时运行多个浏览器，为多个用户服务，存在不同用户在不同时刻访问的网页具有高度重复的特点，在这种应用场景中，希望一台服务器能够同时为尽量多的用户服务，以降低运营成本。

现有通用浏览器的结构如图1所示，通过浏览器显示网页主要由三类进程组成，Browser，Render和GPU进程。Browser进程负责浏览器和用户交互、UI显示以及管理插件等；Render进程进行网页解析，产生3D渲染指令；GPU进程负责渲染显示。每一个Render进程对应浏览器的一个Tab，并有一个GPU进程负责页面渲染显示。每个GPU进程之间完全独立，每个进程维护自己独立的显存空间，进行独立的渲染工作。

发明内容

本申请提供一种加速网页渲染的方法及装置，适用于云端(即服务器端)的浏览器，用于解决传统浏览器在显示多个网页时，即使网页间存在大量相同内容，不同渲染进程之间也需要独自渲染整个网页。每个渲染进程间的资源无法共享，同时也会伴随大量重复渲染的过程，导致资源浪费的问题。

为了解决上述技术问题，本申请的一技术方案为提供一种加速网页渲染的方法，包括：

接收网页元素的渲染指令；

判断显存中是否缓存有所述网页元素，若所述显存中缓存有所述网页元素，则将显存中缓存的所述网页元素作为渲染结果，忽略所述渲染指令，否则响应所述渲染指令，将网页元素缓存于显存中；

将显存中的网页元素按照显示规则绘制，在显示器上显示。

本申请一实施例中，当所述网页元素为图片元素时，响应所述渲染指令之前还包括：

判断存储器中是否存储有所述图片元素，若所述存储器中存储有所述图片元素，则从所述存储器中获取所述图片元素，否则下载所述图片元素并将其存储于存储器中。

本申请一实施例中，判断显存中是否缓存有所述网页元素，若所述显存中缓存有所述网页元素，则将显存中缓存的所述网页元素作为渲染结果，忽略所述渲染指令，否则响应所述渲染指令进一步包括：

根据网页元素内容计算得到网页元素标识码；

在显存的标识码列表中查找所述网页元素标识码，若能查找到所述网页元素标识码，则将显存中所述网页元素标识码对应的网页元素作为渲染结果，忽略渲染指令，否则将所述网页元素标识码插入到所述标识码列表中，响应渲染指令。

本申请一实施例中，所述网页元素标识码为根据网页元素内容得到的CRC校验码、彩色直方图及图像特征点向量中的任意一种。

本申请另提供一种加速网页渲染的装置，包括：

指令接收模块，用于接收网页元素的渲染指令；

处理模块，用于判断显存中是否缓存有所述网页元素，若所述显存中缓存有所述网页元素，则将显存中缓存的所述网页元素作为渲染结果，忽略所述渲染指令，否则响应所述渲染指令，将网页元素缓存于显存中；

处理模块还用于，将显存中的网页元素按照显示规则绘制，在显示器上显示。

本申请一实施例中，加速网页渲染的装置还包括：图片元素获取模块，用于判断存储器中是否存储有所述图片元素，若所述存储器中存储有所述图片元素，则从所述存储器中获取所述图片元素，否则下载所述图片元素并将其存储于存储器中。

本申请一实施例中，所述处理模块具体用于根据网页元素的内容计算得到网页元素标识码；

在显存的标识码列表中查找所述网页元素标识码，若能查找到所述网页元素标识码，则将显存中所述网页元素标识码对应的网页元素作为渲染结果，忽略渲染指令，否则将所述网页元素标识码插入到所述标识码列表中，响应渲染指令。

本申请一实施例中，所述网页元素标识码为根据网页元素内容得到的CRC校验码、彩色直方图及图像特征点向量中的任意一种。

本申请提供的加速网页渲染的方法及装置将多个渲染进程合并到同一个进程中，从而实现共享显存资源。当接收到网页元素的渲染指令后，先判断显存中是否缓存有该网页元素，如果显存中缓存有该网页元素，则认为该网页元素的渲染指令已经被执行过了，将显存中缓存的网页元素作为渲染结果，忽略该渲染指令，否则执行渲染指令，将网页元素缓存于显存中。通过本申请的技术方案能够减少渲染占用的计算资源，提高网页的渲染速度，加快相似网页的显示进度。

附图说明

为了更清楚地说明本申请实施例或现有技术中的技术方案，下面将对实施例所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1为现有技术中通用浏览器结构示意图；

图2为本申请一实施例改进的浏览器结构示意图；

图3为本申请一实施例加速网页渲染的方法流程图；

图4为本申请另一实施例加速网页渲染的方法流程图；

图5为本申请一实施例加速网页渲染的装置结构图；

图6为本申请一实施例显存的标识码列表示意图。

具体实施方式

为了使本申请的技术特点及效果更加明显，下面结合附图对本申请的技术方案做进一步说明，本申请也可有其他不同的具体实例来加以说明或实施，任何本领域技术人员在权利要求范围内做的等同变换均属于本申请的保护范畴。

如图2所示，图2为本申请一实施例改进的浏览器结构示意图，本申请将多个渲染进程合并到同一个进程中，每个网页共享显存资源，对于重复度高的网页，能够减少渲染占用的资源，提高网页的渲染速度，加快显示进度。

具体的，如图3所示，本申请提供的加速网页渲染的方法流程为：

接收网页元素的渲染指令；

判断显存中是否缓存有所述网页元素，若所述显存中缓存有所述网页元素，则将显存中缓存的所述网页元素作为渲染结果，忽略所述渲染指令，否则响应所述渲染指令。

进一步的，确定显存中缓存有所述网页元素后，根据网页元素的显示规则绘制网页元素，在显示器上显示。

本实施例接收到网页元素的渲染指令后先不执行，先判断显存中是否缓存有所述网页元素，如果有，则不再在显存中建立缓冲区，将显存中缓存的网页元素作为渲染结果。本实施例能够避免重复渲染导致资源浪费。

需要说明的是，本申请所述的网页元素包括图片元素及文本元素。

本申请一实施例中，当所述网页元素为图片元素时，响应所述渲染指令之前还包括：

获取所述图片元素，其中，获取所述图片元素的过程包括，

判断存储器中是否存储有所述图片元素，若所述存储器中存储有所述图片元素，则从所述存储器中获取所述图片元素，否则下载所述图片元素并将其存储于存储器中。

详细的说，存储器中存储有图片元素ID列表，判断存储器中是否存储有所述图片元素进一步为：在存储器的图片元素ID列表中查找所述图片元素的ID，如果能查找到所述图片元素的ID，则从存储器中获取所述图片元素。

本实施例中，将网页中涉及的图片元素存储于存储器中，当接收到一图片元素的渲染指令后，先从存储器中查找该图片元素，如果能够查找到，可直接在存储器中获取，无需通过网络再次下载。本实施例在某种程度上能够提升网页显示的速度。

如图4所示，图4为本申请一实施例加速网页渲染的流程图，该实施例中，加速网页渲染的方法包括：

步骤401：接收网页元素的渲染指令；

步骤402：根据网页元素内容计算得到网页元素标识码；

详细的说，所述网页元素标识码为任何唯一区分网页元素的值，如为根据网页元素内容得到的CRC校验码、彩色直方图、图像特征点向量，本申请对网页元素标识码具体为何不做限制。

步骤403：在显存的标识码列表中查找所述网页元素标识码；

步骤404：若能查找到所述网页元素标识码，则将显存中所述网页元素标识码对应的网页元素作为渲染结果，忽略渲染指令，否则将所述网页元素标识码插入到所述标识码列表中，响应渲染指令。

本申请提供的加速网页渲染的方法将多个渲染进程合并到同一个进程中，从而实现共享显存资源。当接收到网页元素的渲染指令后，先判断显存中是否缓存有该网页元素，如果显存中缓存有该网页元素，则认为该网页元素的渲染指令已经被执行过了，将显存中缓存的网页元素作为渲染结果，忽略该渲染指令，否则执行渲染指令，将网页元素缓存于显存中。通过本申请的技术方案能够减少渲染占用的计算资源，提高网页的渲染速度，加快相似网页的显示进度。

如图5所示，图5为本申请一实施例加速网页渲染的装置结构图。该装置可以通过逻辑电路或者芯片实现，或者安装于现有的高性能计算终端，例如手机、平板电脑、计算机等设备中，或者以功能模块的方式由软件实现各部件的功能。

具体的，该装置包括：指令接收模块501及处理模块502；

所述指令接收模块501用于接收网页元素的渲染指令；所述处理模块502用于判断显存中是否缓存有所述网页元素，若所述显存中缓存有所述网页元素，则将显存中缓存的所述网页元素作为渲染结果，忽略所述渲染指令，否则响应所述渲染指令。

本申请一实施例中，加速网页渲染的装置还包括：图片元素获取模块，用于判断存储器中是否存储有所述图片元素，若所述存储器中存储有所述图片元素，则从所述存储器中获取所述图片元素，否则下载所述图片元素并将其存储于存储器中。详细的说，存储器中存储有图片元素ID列表，判断存储器中是否存储有所述图片元素进一步为：在存储器的图片元素ID列表中查找所述图片元素的ID，如果能查找到所述图片元素的ID，则从存储器中获取所述图片元素。

本申请一实施例中，所述处理模块具体用于根据网页元素的内容计算得到网页元素的标识码；

在显存的标识码列表中查找所述网页元素标识码，若能查找到所述网页元素标识码，则将显存中所述网页元素标识码对应的网页元素作为渲染结果，忽略渲染指令，否则将所述网页元素标识码插入到所述标识码列表中，响应渲染指令。

详细的说，所述网页元素标识码为任何唯一区分网页元素的值，如为根据网页元素内容得到的CRC校验码、彩色直方图、图像特征点向量，本申请对网页元素标识码具体为何不做限制。

本申请提供的加速网页渲染的装置将多个渲染进程合并到同一个进程中，从而实现共享显存资源。当接收到网页元素的渲染指令后，先判断显存中是否缓存有该网页元素，如果显存中缓存有该网页元素，则认为该网页元素的渲染指令已经被执行过了，将显存中缓存的网页元素作为渲染结果，忽略该渲染指令，否则执行渲染指令，将网页元素缓存于显存中。通过本申请的技术方案能够减少渲染占用的计算资源，提高网页的渲染速度，加快相似网页的显示进度。

为了更清楚的说明本申请的技术方案，下面以渲染图片元素为例进行说明。本实施例中，图片元素的渲染指令为：

glGenBuffers(size,&buffer0)；//用于在显存中创建缓存区buffer0；

glBindBuffer(GL_ARRAY_BUFFER,buffer0)；//用于将后续的处理对象设定为buffer0；

glBufferData(GL_ARRAY_BUFFER,size1,data,GL_STREAM_DRAW)；//将内存中待渲染的图片元素存储于显存中的buffer0中；

其中，glGenBuffers及glBufferData占用资源严重。

当渲染进程第一次接收到上述指令集时，先根据图片元素的内容计算图片元素对应的key值(即标识码，可唯一区分图片元素，该key值可以为CRC校验码)；

接着，运行该指令集，将图片元素存储于显存中的buffer0中，将图片元素对应的key值插入至标识码列表中，如图6所示，对象为显存中存储的网页元素，对象序号为网页元素的编号，对象编号中存储有网页元素对应的key值；

当再次接收到的类似指令集时，例如待渲染的图片元素对应的key值为keyn，则从图6所示的表中查找该待渲染的图片元素对应的keyn值，若能够查找到，则返回keyn值对应的对象序号n，接着根据对象序号n，利用glBindBuffer函数将后续处理对象设置为buffern，调用方式为：glBindBuffer(GL_ARRAY_BUFFER,buffern)，同时忽略当前指令集，不予执行；若不能查找到，则执行当前指令集，并将该待渲染的图片元素对应的keyn插入至显存的标识码列表中。

本申请提供的加速网页渲染的方法及装置将多个渲染进程合并到同一个进程中，从而实现共享显存资源。当接收到网页元素的渲染指令后，先判断显存中是否缓存有该网页元素，如果显存中缓存有该网页元素，则认为该网页元素的渲染指令已经被执行过了，将显存中缓存的网页元素作为渲染结果，忽略该渲染指令，否则执行渲染指令，将网页元素缓存于显存中。通过本申请的技术方案能够减少渲染占用的计算资源，提高网页的渲染速度，加快相似网页的显示进度。

本领域内的技术人员应明白，本发明的实施例可提供为方法、系统、或计算机程序产品。因此，本发明可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本发明可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。

本发明是参照根据本发明实施例的方法和装置的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。

这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。

这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。

以上所述仅用于说明本申请的技术方案，任何本领域普通技术人员均可在不违背本申请的精神及范畴下，对上述实施例进行修饰与改变。因此，本申请的权利保护范围应视权利要求范围为准。

Claims (8)

1.一种加速网页渲染的方法，其特征在于，将多个渲染进程合并到同一进程中，使得每个网页共享显存资源，包括：

接收网页元素的渲染指令，所述网页元素包括：图片元素和文本元素；

判断显存中是否缓存有所述网页元素，若所述显存中缓存有所述网页元素，则将显存中缓存的所述网页元素作为渲染结果，忽略所述渲染指令，否则响应所述渲染指令，将网页元素缓存于显存中；

将显存中的网页元素按照显示规则绘制。

2.如权利要求1所述的加速网页渲染的方法，其特征在于，当所述网页元素为图片元素时，响应所述渲染指令之前还包括：

判断存储器中是否存储有所述图片元素，若所述存储器中存储有所述图片元素，则从所述存储器中获取所述图片元素，否则下载所述图片元素并将其存储于存储器中。

3.如权利要求1所述的加速网页渲染的方法，其特征在于，判断显存中是否缓存有所述网页元素，若所述显存中缓存有所述网页元素，则将显存中缓存的所述网页元素作为渲染结果，忽略所述渲染指令，否则响应所述渲染指令进一步包括：

根据网页元素内容计算得到网页元素标识码；

在显存的标识码列表中查找所述网页元素标识码，若能查找到所述网页元素标识码，则将显存中所述网页元素标识码对应的网页元素作为渲染结果，忽略渲染指令，否则将所述网页元素标识码插入到所述标识码列表中，响应渲染指令。

4.如权利要求3所述的加速网页渲染的方法，其特征在于，所述网页元素标识码为CRC校验码。

5.一种加速网页渲染的装置，其特征在于，将多个渲染进程合并到同一进程中，使得每个网页共享显存资源，包括：

指令接收模块，用于接收网页元素的渲染指令，所述网页元素包括：图片元素和文本元素；

处理模块，用于判断显存中是否缓存有所述网页元素，若所述显存中缓存有所述网页元素，则将显存中缓存的所述网页元素作为渲染结果，忽略所述渲染指令，否则响应所述渲染指令，将网页元素缓存于显存中；

处理模块还用于，将显存中的网页元素按照显示规则绘制。

6.如权利要求5所述的加速网页渲染的装置，其特征在于，还包括：

图片元素获取模块，用于判断存储器中是否存储有所述图片元素，若所述存储器中存储有所述图片元素，则从所述存储器中获取所述图片元素，否则下载所述图片元素并将其存储于存储器中。

7.如权利要求5所述的加速网页渲染的装置，其特征在于，所述处理模块具体用于根据网页元素的内容计算得到网页元素标识码；

在显存的标识码列表中查找所述网页元素标识码，若能查找到所述网页元素标识码，则将显存中所述网页元素标识码对应的网页元素作为渲染结果，忽略渲染指令，否则将所述网页元素标识码插入到所述标识码列表中，响应渲染指令。

8.如权利要求7所述的加速网页渲染的装置，其特征在于，所述网页元素标识码为CRC校验码。