。
[0039]图10是图8所示大小及相对坐标计算单元210的可选内部结构的示意性方框图。
【具体实施方式】
[0040]下面将参照附图更详细地描述本公开的优选实施方式。虽然附图中显示了本公开的优选实施方式，然而应该理解，可以以各种形式实现本公开而不应被这里阐述的实施方式所限制。相反，提供这些实施方式是为了使本公开更加透彻和完整，并且能够将本公开的范围完整地传达给本领域的技术人员。
[0041]图1是根据本发明的一个实施例的网页渲染方法的示意性流程图。
[0042]在步骤S100，将网页中的html标签作为节点并引入CSS信息，由此建立包含视觉信息的网页树状结构(VisualTree)，其中引入的CSS信息包括节点的显示属性。
[0043]在步骤S200，计算VisualTree中节点的大小和绝对坐标。
[0044]在步骤S300，根据节点的大小、绝对坐标和显示属性来计算节点的可见性，以完成对网页的渲染。
[0045]众所周知，html (超文本标记语言)是用来描述网页的一种标记语言，其使用标签用来结构化信息，例如标题、段落和列表等。而CSS(层叠样式表)则是一种为结构化文档(诸如，html文档)添加样式(诸如，字体、间距和颜色等)的计算机语言，被引入以方便对网页的内容与显示进行区分。
[0046]根据html自身的结构层次特性，一个标签中可以包含若干子标签。这在视觉上体现为一个网页块可以包含若干网页块，而且这种包含层次关系是可以嵌套的。由于每一个html标签基本上可以代表一个网页块，因此计算网页的视觉信息就可以转化为计算各网页块的视觉信息，即是网页块在整个网页中的绝对坐标、网页块大小和网页块可见性等特征，针对网页块的渲染布局就是计算网页块视觉信息的过程。
[0047]在本发明中，通过将网页中的html标签作为节点并引入CSS信息，建立包含视觉信息的网页树状结构，即VisualTree。VisualTree中的各个节点与网页中的各个网页块相对应，并且引入定义了各网页块样式的CSS信息，因此通过读取CSS信息中包括的显示属性，并且计算VisualTree中的各个节点的大小和绝对坐标，就能够计算节点的可见性，由此实现对网页的渲染布局。
[0048]在现有技术中，浏览器内核进行网页渲需要与多个模块进行各种交互和调用，并且需要大量的计算。例如，火狐浏览器内核的网页渲染速度经测试只能达到每秒10?20页面。相比之下，通过使用本发明中自定义的VisualTree来将网页渲染简化为网页块级的计算，就能够在保证网页搜索和网页转码等场景所需要的准确性的同时，大大提高网页渲染速度。例如，在一个优选实施例中，以字符误差的准确性实现每秒600页面以上的渲染速度。
[0049]另外，本发明所公开的上述方法基于html和CSS，完全遵循W3C(万维网联盟)现行的CSS2.1规范，具有良好的兼容性和可移植性。
[0050]在一个优选实施例中，VisualTree上只包括和渲染布局有关的节点。例如，在创建VisualTree时排除CSS属性display (显示)为none (无)的节点，因为它和布局无关。
[0051]这样就将需要处理的节点进一步限定为那些涉及渲染布局的节点，从而排除与显示无关的节点的相关计算，由此提高计算效率。显而易见的是，VisualTree上也可以包括全部节点，这并不影响本发明所要实现的效果。
[0052]图2是图1所示步骤S200可以包括的子步骤的流程图。
[0053]在步骤S210，对VisualTree进行后根遍历以计算节点的大小和相对坐标。
[0054]在步骤S220，根据计算出的节点的大小和相对坐标，对VisualTree进行先根遍历以计算节点的绝对坐标。
[0055]在本发明的一个优选实施例中，对VisualTree中各节点大小和绝对坐标的计算可以通过可以对VisualTree进行一遍后根遍历，再进行一遍先根遍历来实现。
[0056]具体地，对VisualTree进行后根遍历可以实现对VisualTree中各个节点的大小(即长度和宽度)和相对坐标的计算。当遍历到根节点时，全局视图限于该根节点及其所有直接子节点，因此能够算出该根节点的子节点针对于其父节点的相对坐标。
[0057]对VisualTree进行后根遍历是自底向上遍历。例如，当一个body (主体)节点A包含了两个div (分割)节点B和C时，会先完成两个div节点B和C的大小(即长度和宽度)和相对坐标的计算，再完成body节点A的大小(即长度和宽度)和相对坐标的计算。
[0058]在计算出各节点的大小和相对坐标之后，就能够根据算出的大小和相对坐标对VisualTree进行先根遍历，由此计算各个节点的绝对坐标。
[0059]在一个优选实施例中，计算节点的绝对坐标的方法可以是:先将根节点的绝对坐标初始化为(O, O)，从根节点开始遍历，该根节点的直接子节点的绝对坐标等于该根节点的绝对坐标加上该直接子节点的相对坐标；因此任意一个节点的绝对坐标的算法即为:节点的绝对坐标=该节点的父节点的绝对坐标+该节点的相对坐标。
[0060]例如，根节点为body节点，首先将body节点的绝对坐标初始化为(0，O)，遍历从body节点开始，该body节点的直接子节点的绝对坐标=body节点绝对坐标+该直接子节点相对坐标。当计算出直接子节点的绝对坐标后，该直接子节点的直接子节点的绝对坐标也可以采用该方式计算。所有节点的绝对坐标采用先根遍历递归调用方式完成。
[0061]由此，通过上述优选实施例的描述，进一步明确了是使用自下而上的方式计算节点的大小和相对坐标，并使用自上而下的方式计算节点的绝对坐标，由此进一步提高了对各网页块大小和坐标的计算速度。
[0062]虽然上文给出了通过后根先根两次遍历来计算节点大小和绝对坐标的方法，但是本领域技术人员也可以根据此处的公开想到其他求取节点大小和绝对坐标的方法，而不被背离本发明的精神和范围。
[0063]图3是图1所示方法的一个可选步骤S150的流程图。
[0064]在步骤S150，将VisualTree上的节点分类为table (表格)节点或非table节点。
[0065]在计算节点大小和绝对坐标的步骤200之前，可以先对VisualTree上的节点进行分类。可以根据CSS信息来定义节点的分类标准。在一个优选实施例中，根据现有技术，节点主要分为table节点与非table节点。对于不同的节点，可以使用不同的方法来获取节点的大小与相对坐标。
[0066]图4是图2所示步骤S210可以包括的子步骤的流程图。
[0067]非table节点(非t节点)包括块级节点、内联节点和浮动节点。因此，在一个优选实施例中，可以使用不同的方法来获取对上述非table节点及table节点(t节点)的大小和相对坐标，由此进一步优化计算效率。
[0068]在步骤S211中，使用棋盘布局算法计算table节点的大小。
[0069]在html语言中，使用〈table〉标签来定义html表格。html表格由table元素以及一个或多个tr和td元素组成，其中tr元素定义表格行，td元素定义表格单元。
[0070]在本发明所定义的VisualTree上，table标签变为table节点。由于table节点通常分为若干行，即若干个tr节点，一个tr节点又分为若干列，即包括若干td节点，所以一个table节点由若干td节点组成，整个table节点类似棋盘，每个td节点类似棋盘上的格子，同一行的td节点组成了 tr节点。td节点可能会跨行跨列(由td元素的rowspan (行跨度)和colspan(列跨度)属性决定)，table节点每行的所有td节点高度必须一致，每列的td节点宽度必须一致；因此针对table节点的特殊性，使用棋盘布局算法来计算各个tab I e节点的大小，棋盘的每一个格子放入一个td节点，可以方便的解决tab I e的行列一致性问题及跨行跨列问题。