CN101201832B

CN101201832B - 优化网页图像的方法和系统

Info

Publication number: CN101201832B
Application number: CN2006101694814A
Authority: CN
Inventors: 王庆波; 方兴; 叶萌; 程龙; 陆晟
Original assignee: International Business Machines Corp
Current assignee: International Business Machines Corp
Priority date: 2006-12-15
Filing date: 2006-12-15
Publication date: 2010-04-21
Anticipated expiration: 2026-12-15
Also published as: CN101201832A; US20080152260A1; US8111944B2

Abstract

本发明涉及计算机多媒体技术，尤其涉及对因特网上传输的网页的图像的优化。公开了一种优化网络服务器上的网页中的图像的方法和系统，该方法包含以下步骤：检测网页中的图像，确定图像之间的关系；响应对图像之间的关系的确定，将两个或更多的相关图像组合成组合图像；更新网页，以对组合图像的引用代替对所述相关图像的引用。通过优化网页图像，减少了在传送网页时服务器为处理大量的HTTP请求所需的工作量，降低了对传送网页图像的带宽要求。网页的更新，不降低相关原始图像的质量，也不需要对客户端的操作作出任何改动。

Description

优化网页图像的方法和系统

发明领域

本发明涉及计算机多媒体技术，尤其涉及对因特网上传输的网页的图像的优化。

背景技术

随着因特网的普及和发展，因特网应用越来越多地采用多媒体技术来表现网页，以改善用户的体验。网页中一般含有许多图像，大多数图像的文件大小一般都较小，例如小于1Kb。如图1左边所示的一例网页中，包含三个图像“CHILD”、“MOUSE”、“PET”。按照传统的网页设计，这三个“CHILD”、“MOUSE”、“PET”被表示为三个文件，例如图1右上方中的三个图像文件“image1.gif”、“image2.gif”、“image3.gif”。要显示该网页，这三个图像文件要被单独引用。图像资源部署在网络的服务器上，当客户机向服务器请求一个网页时，网页中的每一个图像都要启动一个HTTP连接，占用一定的网络带宽；对于每一个图像，都需要处理和传输HTTP请求和响应报头。当网页中的图像过多时，不但耗费网络带宽，影响传输速度，也增加服务器的工作量。

美国专利申请(公开号US 2004/0120589 A1)公开了一种加速图像数据传输的方法，该方法在远程客户端网络服务器之间设置一个网络装置，用来转换从网络服务器接收的数据，然后将修改的数据发送到远程客户端，该网络装置将图像数据改造为具有不同的格式、减少的色彩的较小版本。虽然该方法能加速图像数据传输，却可能影响所传输的图像的质量。

发明内容

本发明的一个目的是，在不降低网页图像质量的同时，减少在传送网页的图像时服务器的工作量。

本发明的另一个目的是，减少对传送网页的图像时的带宽要求。

一方面，本发明提供一种优化网络服务器上的网页中的图像的方法，包含以下步骤：

检测网页中的图像，以确定图像之间的关系；

响应对图像之间的关系的确定，将两个或更多的相关图像组合成组合图像；

更新网页，以对组合图像的引用代替对所述相关图像的引用。

另一方面，本发明提供一种用于优化网络服务器上的网页中的图像的系统，包含：

图像检测装置，用于检测网页中的图像，确定图像之间的关系；

图像组合装置，用于响应对图像之间的关系的确定，将相关图像组合成组合图像；

网页更新装置，用于更新网页，以对组合图像的引用代替对所述相关图像的引用。

本发明还提供一种计算机程序产品，其中包含在被计算机执行时实现本发明方法的程序代码。

本发明的方法和系统，通过在服务器侧对网页中的图像预先进行合并处理，减少要传送的图像文件的数量，相应地减少了对传输的请求和响应报头的处理，由此能降低服务器在传送网页的图像时的工作量，以及对传送网页的图像的带宽要求。

附图说明

本发明的上述和其它优点的特点，显见于以下结合附图对具体实施方式的说明；附图中，

图1示意性表示现有技术的引用单个图像的方式和本发明的引用组合图像的方式；

图2表示一例网站的资源结构关系；

图3a和3b示意性表示DOM树；

图4是一例表示网页与分段之间关系的表；

图5a和5b表示一个网页结构的分段布局的例子；

图6是一例表示分段与图像之间关系的表；

图7是一例表示图像与网页之间关系的表；

图8是表示图像与图像之间关系的例子；

图9表示图7中每个网页被访问的次数；

图10表示图7中每个图像被访问的次数；

图11表示按访问次数加权的图像关系表；

图12表示图像-组合图像对应关系表的一个例子；

图13a是一段包含要显示的图像的原始HTML文档的例子；

图13b是按照本发明更新后的HTML文档的例子；

图14是按照本发明实施例的用于优化网页图像的系统的方框图。

具体实施方式

以下结合附图，说明本发明的具体实施方式。

图2表示一例网站的资源结构关系为了简要，图中只表示了五个网页wp0-wp4。一个网站含有多个网页，本发明实施例中，用标记语言(例如HTML、XML等等)的文档来描述网页，每个网页可由一个文档组成，也可由多个被称作分段(segment)的文档组成。为了简要和一致，以下说明中的网页，指的是以HTML文档描述的网页。

在描述网页的HTML文档中，通过引用对应的图像文件(例如-但不限于-.gif文件)来表示要显示的图像。网页文档通常需要引用许多图像文件。

本发明的优化网页图像的基本构思如图1所示，即把网页中包含的如图1右上方所示的几个相关的小图像组合成如图1右下方所示的单一的图像文件combine1.gif，这样，当客户端请求该网页时，不是单独下载这几个小图像，而只下载这一个组合图像文件。

按照本发明的优化网页图像的方法，总体上包含三个阶段：

第一阶段检测网页中的图像，以确定图像之间的关系。该阶段可以选择检测静态图像关系和动态图像关系，静态图像关系包括基于DOM树的图像距离关系和图像包含关系，后者进一步包括图像之间在分段级或网页级被不同的网页共同引用的关系。

第二阶段响应对图像之间的关系的确定，将两个或更多的相关图像组合成组合图像。可以选择进行基于DOM树的图像组合、分段级的图像组合、网页级的图像组合和网站级的图像组合。

第三阶段更新网页，以对组合图像的引用代替对所述相关图像的引用。该阶段响应第二阶段组合图像的结果，将原网页文档中的对单个图像的引用的代码替换为对包含各单个图像的组合图像的引用的代码。

以下说明第一阶段的各种实现的实施例。

网页图像之间的距离，可以用来表征网页之间的关系。图像之间的距离，分为空间距离和时间距离。空间距离表征两个图像在相同的视图上显示的可能性，两个图像的空间距离越近，在相同的视图上显示的可能性越大。时间距离表征两个图像在较短的时间间隔内被先后显示的可能性，两个图像的时间距离越近，在较短的时间间隔内被先后显示的可能性越大。空间距离与时间距离相互关联，又相互区别。例如，如果两个图像总是在相同的视图中被显示，则它们的空间距离和时间距离都很小。但是，空间距离大，并不意味着时间距离大，因为两个从不在相同的视图上显示的图像，完全有可能在两个互相链接的网页上，因此在较短的时间间隔内被顺序显示。按照本发明，不但可以把网页中包含的几个小图像组合成单一的图像文件，而且可以根据图像之间的距离进行这种组合，以提高组合图像的使用效率。

按照本发明一个实施例，检测网页中的图像，包括检测基于DOM树的图像距离关系。

图3a表示一例文档对象模型(DOM)树的视图。DOM树是HTML文档或XML文档的一种结构描述。由于网页的每个分段可以由一个HTML文档描述，因此可以用图3a的DOM树来表示。

按照本发明，可以将这样一个DOM树改造为缩减的DOM树，在保留足够的结构信息的同时，省略一些不含图像节点的树枝。图3b是按照本发明一个实施例改造的一个网页的分段的DOM树，树中表示了两个含有图像叶结点的分支，一个分支含有三个图像IMG1、IMG2和IMG3，另一个分支含有一个图像IMG4。

按照本发明，可以进一步通过检测缩减的DOM树中图像叶节点之间的相对距离，来检测网页中的图像关系，供第二阶段用于对图像的组合。也可以将检测的结果，存储在一个图像节点距离关系表，在该表中列出表示所有各图像叶节点与其它各图像叶节点之间的距离的值。例如图3b中，图像IMG1与IMG2之间的距离为1，与图像IMG3之间的距离为2。一般来说，两个图像的距离越近，表示两个图像的空间距离或者时间距离较近的可能性更大。在第二阶段，如果按照图像距离的大小，优先合并或组合距离较小的图像，效率更高。关于如何根据图像的距离关系组合图像，将在下文中说明。

按照本发明一个实施例，检测网页中的图像，包括检测图像包含关系，例如图像之间被不同分段共同引用的关系和/或被不同分段共同引用的关系。

图4是一例表示网页与分段之间关系的表，该表以另一种表示方式表示图2中网页与片段的关系。例如从表中可见，分段seg1被包含在网页wp1中，分段seg4被包含在两个网页wp0和wp3中，等等。

图5a表示一个网页结构的分段布局的例子。该网页中包括不同的部分seg0、seg2、seg4、seg5。为方便描述，本说明中将网页的不同部分称作“分段”。在描述网页的HTML文档中，每个分段可以由一个HTML文档描述。需要指出的是，分段的划分是相对的，较大的HTML文档可表示网页的较大一个部分，而一个HTML文档中又可以包含许多更小的HTML文档，每个较小的HTML文档表示网页中的一个较小的部分。

HTML文档是结构化的，并且采用标签(tag)来表示内容，因此可以用程序方法检测这些内容，检测网页中分段之间的各种关系。图5b中所表示的是分段之间的一例关系，即图5a所示的网页中分段之间的空间距离关系。图5b的表中的关系值代表片段的距离。例如，图5a所示的网页中，seg0与seg2、seg4之间的距离都是1，而与seg5之间的距离是2。所属技术领域的技术人员知道，现有技术中存在各种检测HTML文档的网页的工具和方法，针对不同编程语言的编写的网页，现有技术中存在不同的类似检测方法，这些都不在本发明的范围之内，因此不再赘述。

对网页的分析，还可以检测网页的分段与图像之间的关系。图6是一例表示分段与图像之间关系的表，用以表示哪些图像被哪些分段引用。例如，该表表示，图像img0被分段seg0引用，图像img6和img7被分段seg5引用，等等。

要指出的是，由于HTML文档的特点，很容易通过适当的编程，用程序得出图4和图6所示的表。

通过图4所示的网页与分段之间关系和图6所示的分段与图像之间关系，还可以自动推导出图像与网页之间关系，如图7所示的表示图像与网页之间关系的表中所示的那样。例如，图像img0被分段seg0引用(参看图6)，而分段seg0包含在网页wp0中(参看图4)，因此，图像img0被网页wp0引用；类似地，图像img3被分段seg2引用(参看图6)，而分段seg3包含在网页wp0和wp2中，因此，图像img3被网页wp0和wp2引用，等等。从图7中可见，网页wp1引用图像img0，img1，img3，网页wp3引用图像img4-img5。

一般来说，位于同一个网页中的不同图像被同时提取的概率较高。分段是网页一部分，因此也可以说，位于同一个分段中的不同图像被同时提取的概率较高。

[如何分析？]通过分析图7的表，可得出图8所示的表，以表示图像与图像之间关于网页的关系。其中，第x行第y列中的数字R[x，y]，表示图像x和图像y共同被R[x，y]个网页引用，我们将R[x，y]称作“共用网页数”。例如，图8中第6行第7列的数字R[6，7]＝2，表示图像img6和img7共同被2个网页引用，就是说，有2个网页既引用img6又引用img7。而R[6，8]＝1，表示图像img6和img8共同被1个网页引用，或者只有一个网页既引用img6又引用img8。相比之下，img6和img7被一个网页同时提取的概率，比img6和img8被同时提取的概率高，因此，优先合并img6和img7的效率更高。

图8也可以通过对类似于图2所示的树结构的遍历而得出，这属于现有技术的范畴，因此不在这里赘述。

需要指出的是，由于分段是网页的子集，因此也可以以类似的方式，分析得出图像与图像之间基于分段的关系，即分析不同的图像共同被几个分段引用。在一个实施例中，也可以用图8来表示图像与图像之间基于分段的关系，此时，图8中的第x行第y列中的数字R[x，y]，表示图像x和图像y共同被R[x，y]个分段引用，我们将R[x，y]称作“共用分段数”。此时，图8中第6行第7列的数字R[6，7]＝2，表示有2个分段既引用img6又引用img7。而R[6，8]＝1，表示只有一个分段既引用img6又引用img8。相比之下，img6和img7被一个分段同时提取的概率，比img6和img8被同时提取的概率高，因此，优先合并img6和img7的效率更高。

以上进行的图像检测，都是对静态的图像关系的检测。

统计表明，90％的服务器请求涉及网站中2-4％的文件。一个图像被多个网页引用，不一定表示该图像被经常访问。在不同访问模式下，由于网页被访问的频率不同，图像被访问的频率不同，此时，图像与图像之间基于网页的动态关系也与静态关系不同。

本发明的另一个实施例，可以进一步检测动态的图像关系，即图像之间被不同的网页动态引用的关系。该实施例例如利用现有技术监测和记录(logging)工具收集关于网页的信息，得出图9中例示的数据。图9表示在一定时间期间，图7中每个网页被访问的次数，反映动态的网页访问模式。

将图7和图9分别表示的两个矩阵相乘，可以得出图10的矩阵，表示在一定时间期间每个图像被访问的次数。由图10的矩阵与图7的矩阵相乘，得出如图11所示的表，表示图像与图像之间的动态关系，即按网页访问次数加权了的关系。图11中的任意两个图像x与y之间关系，可以由一个“图像访问模式近似性尺度”S(x，y)来衡量，S(x，y)可以由第x行第y列中的数字R[x，y]推导得出：对于图像x1、x2、x3来说，如果

|R[x1，x1]-R[x1，x2]|＜|R[x1，x1]-R[x1，x3]|

则S(x1，x2)＞S(x1，x3)。对一个图像集合，可以算出所有的图像对的图像访问模式近似性尺度，由此可以比较它们之间的相对大小。

例如，从图11中可以得出S(0，1)＞S(0，7)。这表示，相比之下，img0和img1未来被同时提取或访问的概率，比img0和img7被同时提取或访问的概率高，因此，优先合并img0和img1的效率更高。

以下说明第二阶段的实现方式。该阶段可以进行基于DOM树的图像组合、分段级的图像组合、网页级的图像组合和网站级的图像组合。

首先，举例说明图像组合的方法。

假设要合并两个图像image1和image2。

第一步，创建一个包含图像image1的组合图像。首先，创建一个指定大小的空白图像文件combine1.gif，将图像image1粘贴到空白区中，使得留下的空白区最大。然后，记录图像image1与组合图像combine1.gif的对应关系。例如，在图12所示的图像-组合图像对应关系表中，记录图像image1和组合图像combine1的文件名，以及图像image1在组合图像combine1.gif中的位置信息。

图12所示的表的例子，用来表示每一个被组合的原始图像与相应的组合图像的关系。例如，第一行中的image1.gif和combine1.gif分别是被组合的原始图像image1和组合图像combine1的文件名，“0，0，50，38”是图像image1在组合图像combine1中的位置信息，意思是，长方形的图像image1宽50高38，左上角位于组合图像combine1中[0，0]的位置(即左上角)。第二步，将图像image2粘贴到组合图像combine1。首先，判断组合图像combine1中剩余的空白区是否能够容纳图像image2。如果是，则将图像image2粘贴到剩余的空白区中与图像image1相邻的位置，并记录图像image2与组合图像combine1的对应关系，如图12的第二行所示。如果组合图像combine1中剩余的空白区不能容纳图像image 2，则不粘贴图像image2。

如果要合并3个的图像，例如，如果要将另一个图像image3与图像image1和image2合并，则对图像image3重复上述的第二步。

图12所示的例子中的第三行所示，图像image2被合并到组合图像combine1中图像image1右面，图像image3被合并图像image2右面的位置。类似地，可以合并更多的图像。

需要指出的是，以上步骤只是对合并图像的方法的示例。但是本发明并不限于此，例如，本例中用坐标和原图像的高度和宽度表达的原图像在组合图像中的位置信息，但是也可以用其它方式表达位置信息。所属技术领域的技术人员、尤其是编程人员可以灵活地实现的这些或其它细节。任何将多个图像合并成一个大的组合图像的方法，都可用于实现本发明。

按照本发明的一个实施例，在第一阶段对缩减的DOM树中图像节点的距离关系的检测的基础上，可以进行基于DOM树的图像组合。前文说过，第一阶段对缩减的DOM树中图像节点的距离关系的检测，可生成一个图像节点距离关系表。本实施例可以根据DOM树中的图像距离大小的关系，进行图像组合，例如先组合距离较小的图像，再组合距离较大的图像。以下举例说明这种图像组合的详细步骤。

(1)设置一个组合图像大小阈值，例如5k字节。理论上讲，本发明对网页图像的组合的技术方案并不受组合图像大小的限制。但是在实践中，最好把组合图像的大小限制在适当的范围内。这是因为，虽然将小图像合并为大的组合图像，能减少处理图像的次数，但是如果一个组合图像过大，会过长多地占用HTTP传输时间，降低组合图像传输的速度。因此，要为组合图像的大小限定一个阈值，在具体实施例中，这可以依网络状况和经验而定。除了可以用文件大小的字节数来表示组合图像大小的阈值，还可以用其它方式，例如可以用组合图像的尺寸来表示这种阈值。当然，也可以通过限制被组合的图像的数量，来限制组合图像的大小。(2)设置图像节点的初始距离值D＝1；

(3)通过例如上文所述的“图像节点距离关系表”，选取所有与其它图像的节点距离为D的尚未被组合的图像的集合；

(4)对于该集合中任意一个尚未被组合的图像image1来说，如果该集合中存在另一个图像image2，并且图像image1和图像image2的大小之和不超过所述阈值，则将图像image1和图像image2合并成一个组合图像；否则，执行步骤(6)；

(5)重复执行以下步骤：如果该集合中的有另一个图像image3与已经被组合的图像的大小之和不超过所述阈值，则将图像image3合并到该组合图像中；否则，执行步骤(4)；

(6)将距离值D递增1，返回步骤(2)。

以上组合图像的过程中，如前文所述的一样，可以生成一个如图12所示的图像-组合图像对应关系表。

按照另一个实施例，可以选择设定一个距离值D的阈值，当距离值D达到这个阈值时，就不再进行图像组合。

通过上述步骤，优先组合距离较小的图像，被组合的图像的空间距离或者时间距离较近的可能性更大，因此组合图像的效率更高。

按照本发明的另一个实施例，基于DOM树的图像组合，可以直接进行。可以从任意一个图像叶节点开始，遍历DOM树，将相近的图像合并成一个个组合图像，结果生成一个图像-组合图像对应关系表。合并的方法与上文根据图像节点距离关系表进行的合并类似，并且也可用阈值来限定组合图像的大小。

现有技术中有各种遍历DOM树的算法，例如深度优先算法，都可以用来进行这种图像合并，这里不作赘述。

按照本发明一个实施例，进行分段级的图像组合。可以按照在第一阶段的检测中确定的图像与图像之间基于分段的关系来进行分段级的图像组合。如图8所示，图像x与图像y之间基于分段的关系，可用“共用分段数”R[x，y]来表征，表示图像x和图像y共同被R[x，y]个分段引用的程度。

按照一个实施例，按照图像被不同分段共同引用的概率的大小顺序对网页中的图像进行图像组合，其步骤是：

(1)设置一个组合图像大小阈值；

(2)按照“共用分段数”R[x，y]从高到低的顺序，对每个尚

未被组合的图像重复执行以下操作：

如果与R[x，y]相关联的一个图像x的大小与另一个相关联的图像y的大小之和不大于所述阈值，则将图像x与图像y合并为一个组合图像；

如果与R[x，y]相关联的一个图像x的大小，与已经被组合的其它图像的大小之和不大于所述阈值，则将该图像x合并到包含该其它图像的组合图像中。

以上过程中“阈值”的概念和合并图像的操作，如前文所述的一样，输出的结果，例如是一个图像-组合图像对应关系表。

前文已经指出过，如果用图8表示图像与图像之间基于分段的关系的一个例子，则“共用分段数”R[6，7]＝2大于“共用分段数”R[6，8]＝1，图像img6和img7将优先于img6和img8被组合，产生的组合图像的效率更高。当然，按照以上所述的图像组合步骤，如果图像img6和img7已经被组合，而图像img8的大小与图像img6和img7之和不大于预定的阈值，则图像img8最终也可能与图像img6和img7组合。

按照本发明另一个实施例，在第二阶段，可以进行网页级的图像组合。

该实施例按照在第一阶段的检测中确定的图像之间基于网页的关系，进行网页级的图像组合。仍然用图8所示的表，表示图像x与图像y之间基于网页的关系，此时可以用“共用网页数”R[x，y]来表征这种关系，即图像x和图像y共同被R[x，y]个网页引用的程度。

按照一个实施例，按照图像被不同网页共同引用的概率的大小顺序对网页中的图像进行图像组合，其步骤是：

为组合图像的大小设置一个阈值；

按照“共用网页数”R[x，y]从高到低的顺序，对每个尚未被组合的图像重复执行以下操作：

如果与R[x，y]相关联的一个图像x的大小，与已经被组合的其它图像的大小之和不大于所述阈值，则将该图像合并到包含该其它图像的组合图像中。

显然，对图像进行网页级的图像组合的步骤，与对图像进行分段级的图像组合的步骤非常类似，其输出的结果例如也可以是一个图像-组合图像对应关系表，其效果也类似，就是说，如果也用图8表示图像与图像之间基于网页的关系，则图像img6和img7将优先于img6和img8被组合。。

按照本发明的一个实施例，进行网站级的图像组合，其特点是对具有类似访问模式的图像优先组合。网站级的图像组合，按照图像与图像之间的动态关系对图像进行组合。如上文参照图11所述的那样，在第一阶段的检测中可以确定图像与图像之间的动态关系；可以用图像访问模式近似性尺度S[x，y]，来表征两个图像x与图像y之间的动态关系。

本发明一个实施例，按照图像访问模式近似性的大小顺序，对网页中的图像进行网站级的图像组合，其步骤是：

设置一个组合图像大小阈值；

按照图像访问模式近似性尺度S[x，y]从高到低的顺序，对每个尚未被组合的图像重复执行以下操作：

如果与S[x，y]相关联的一个图像x的大小与另一个相关联的图像y的大小之和不大于所述阈值，则将图像x与图像y合并为一个组合图像；

如果与S[x，y]相关联的一个图像x的大小，与已经被组合的其它图像的大小之和不大于所述阈值，则将该图像合并到包含该其它图像的组合图像中。

对图像进行网站级的图像组合的步骤，与图像进行网页级和分段级的图像组合的步骤非常类似，其输出的结果例如也是一个图像-组合图像对应关系表。

第二阶段对图像关系的检测的各种方式，可以单独进行，也可以组合地进行。相应地，第三阶段对图像的组合，也可以基于单独进行的检测结果和组合进行的检测结果而进行。

按照本发明，在第二阶段把网页中的图像组合成组合图像之后，根据第二阶段的结果进行第三阶段，即更新网页，以对组合图像的引用代替对所述相关图像的引用。

在描述网页的HTML文档中，标记了对每个原始图像的引用，以及该原始图像在网页的显示位置。图13a是一段包含要显示的图像的原始HTML文档的例子。该HTML文档中对原始图像image1、image2、image3的引用的代码段可以用伪码表达为：

“在网页的位置A显示文件image1.gif的图片”；

“在网页的位置B显示文件image2.gif的图片”；

“在网页的位置C显示文件image3.gif的图片”。

按照本发明的一个实施例，利用第二阶段在生成组合图像时记录的原始图像与组合图像的对应关系，把网页文档中对每个原始图像的文件的引用，替换为对对应的组合图像的文件和相关原始图像在组合图像中的位置信息的引用。例如，利用图12例示的图像-组合图像对应关系表中所表达的图像image1与组合图像combine1的对应关系，将上述HTML文档中对原始图像image1的引用的代码段替换为以下述伪码表达的代码段：

“在网页的位置A将组合图像combine1.gif中由位置信息[0，0，50，38]表示的部分图像作为背景图片；在网页的位置A把一个透明图片作为当前图片”。其中，A是原始HTML文档中设定的显示图像image1的位置，已经体现在原始HTML文档中。

类似地，将原始HTML文档中对原始图像image2、image3的引用的代码段分别替换为：

“在网页的位置B将组合图像combine1.gif中由位置信息[50，0，50，38]表示的部分图像作为背景图片，在网页的位置B把一个透明图片作为当前图片”；

“在网页的位置C将组合图像combine1.gif中由位置信息[100，0，40，38]表示的部分图像作为背景图片，在网页的位置C把一个透明图片作为当前图片”。其中，B、C分别是原始HTML文档中设定的显示image2、image3的位置。

图13是一个更新后的HTML文档的例子，其中已经用对组合图像进行单独的显示的代码替换了用于显示相关原始图像的原始代码。通过适当的编程，可以自动进行这种替换。

原始HTML文档被更新后，如果在客户端的浏览器上要同时显示(例如图1所示的)三个图像image1、image2和image3，客户端不必请求三个图像文件image1.gif、image2.gif和image3.gif，而只要请求一个图像文件combine1.gif。客户端浏览器解析与原始HTML文档相对应的更新了的HTML文档，原本要对较多的(例如图1右上方所示的)小原始图像文件的引用变成对较少的(例如图1右下方所示的)组合图像文件的引用。

图14是表示根据本发明实施例的用于优化网页图像的系统的方框图。如图14所示，按照本实施例的系统140，包含：图像检测装置141，用于检测网页中的图像，确定图像之间的关系；图像组合装置142，用于响应对图像之间的关系的确定，将相关图像组合成组合图像；网页更新装置143，用于更新网页，以对组合图像的引用代替对所述相关图像的引用。图中可见，图像检测装置141输入网页，输出对图像关系的检测结果，例如图8所示的图像关系表。检测结果可以存储在一个存储装置中，也可以直接馈送到图像组合装置142。图像组合装置142根据图像检测装置141输出的检测结果，将相关的图像组合成组合图像，存储或输出被组合的相关图像与组合图像的关系，例如被组合图像的文件名，组合图像的文件名，以及被组合图像在组合图像中的位置信息。网页更新装置142根据图像组合装置142的输出，把网页中对相关图像的引用修改为对组合图像的文件和相关图像在组合图像中的位置信息的引用。

可选地，系统140包含一个存储装置，用于存储图像检测装置141、图像组合装置142和网页更新装置143的任何一个或全部所产生的结果输出数据，以及为上述装置提供输入数据。

如图所示，按照本发明的一个实施例，图像检测装置141可包含DOM树分析装置1411和/或图像包含关系分析装置1412，DOM树分析装置1411用于分析网页的结构，而图像包含关系分析装置1412用于按照本发明方法分析和记录网页图像之间被共同引用的关系。在具体实践中，DOM树分析装置1411和图像包含关系分析装置1412可以相互独立，也可以体现为单一的分析装置1410，用于按照本发明方法分析网页的结构。

按照本发明一个实施例，图像组合装置142被配置得通过遍历表示网页的DOM树，将相近的图像合并成组合图像。

按照本发明的一个实施例，图像组合装置142包含网页级图像组合装置1421、分段级图像组合装置1422、网站级图像组合装置1423。网页级图像组合装置1421用于根据图像之间被不同的网页共同引用的关系组合图像；分段级图像组合装置1422用于根据图像之间被相同网页的不同分段或分区共同引用的关系组合图像；网站级组合装置1423，用于根据图像之间图像访问模式近似性的关系组合图像。当然，在具体实现中，根据需要，图像组合装置142可以只包含上述三种装置的一部分。

按照本发明的实施例，图像组合装置142进一步被配置得能按照被共同引用的概率的大小顺序和/或按照图像访问模式近似性的大小页序，将相关图像组合成组合图像，并且/或者能根据DOM树中的图像的距离，先组合距离较小的图像，再组合距离较大的图像。

按照本发明的实施例，为图像组合装置142进行图像的组合，预定一个组合图像大小阈值。阈值的选择，可以依具体实现而定。对于两个或更多的相关图像的来说，只有它们的大小总和不超过这个阈值时，图像组合装置142才把它们合并成一个组合图像，或者将其中一个合并到一个组合图像中。

本实施例的系统14及其各个组成部分与前文所述的优化网页图像的方法对应，属于同一发明构思，然而本发明的优化网页图像的系统的实现开不限于上述结构。系统14及其各个组成部分可以由诸如逻辑芯片和可编程硬件设备的硬件电路实现，也可以用由各种处理器执行相应的软件的方式实现，例如以包含执行本发明方法步骤的程序代码的计算机程序产品的形式提供，或者由上述硬件和软件的结合实现。这些各个组成部分可以集成在一起，也可以物理上相互独立而操作上互相协作。

本发明的方法和系统，通过优化网页图像，能减少在传送网页时服务器为处理大量的HTTP请求所需的工作量，降低对传送网页图像的带宽要求。对网页图像的优化，不降低相关原始图像的质量，也不需要对客户端的操作作出任何改动。

以上通过实施例详细说明了本发明的用于优化网页图像的方法和系统进行了详细的描述，这些实施例仅仅是示例性的，而非限定性的，也不是穷举的。本领域技术人员可以在本发明的精神和范围内对这些实施例作出各种变化和修改。

Claims

1.一种优化网络服务器上的网页中的图像的方法，包含以下步骤：

检测网页中的图像，以确定图像之间的关系；

2.按照权利要求1的方法，其中，所述检测图像之间的关系，包括检测图像在缩减的DOM树中的距离。

3.按照权利要求1的方法，其中，所述检测图像之间的关系，包含检测图像之间被不同的网页共同引用的关系。

4.按照权利要求1的方法，其中，所述检测图像之间的关系，包含检测图像之间被相同网页的不同分段或分区共同引用的关系。

5.按照权利要求3的方法，其中，所述检测图像之间被不同的网页共同引用的关系的步骤，进一步检测图像之间被不同的网页动态引用的关系。

6.按照权利要求3或4的方法，其中，将相关图像组合成组合图像的步骤，包括按照被共同引用的概率的大小顺序进行组合。

7.按照权利要求5的方法，其中，将相关图像组合成组合图像的步骤，包括按照图像访问模式近似性的大小顺序进行组合。

8.按照权利要求2的方法，其中，将相关图像组合成组合图像的步骤，包括根据DOM树中的图像的距离，先组合距离较小的图像，再组合距离较大的图像。

9.按照权利要求2的方法，其中，将相关图像组合成组合图像的步骤，包括遍历表示网页的DOM树，将相近的图像合并成组合图像。

10.按照权利要求1至9中的任何一个方法，其中，所述两个或更多的相关图像的大小之和，小于一个预定的组合图像阈值。

11.按照权利要求1的方法，其中，对组合图像的引用包括对组合图像的文件和相关图像在组合图像中的位置信息的引用。

12.一种用于优化网络服务器上的网页中的图像的系统，包含：

13.按照权利要求12的系统，其中，图像检测装置包括DOM树分析装置，用于分析和记录在网页在DOM树中图像之间的距离。

14.按照权利要求12或13的系统，其中，图像检测装置装置包括图像包含关系分析装置，用于分析和记录网页图像之间被共同引用的关系。

15.按照权利要求14的系统，其中，所述图像组合装置，包含下述的一个或多个：

网页级图像组合装置，用于根据图像之间被不同的网页共同引用的关系组合图像；

分段级图像组合装置，用于根据图像之间被相同网页的不同分段或分区共同引用的关系组合图像；

网站级组合装置，用于根据图像之间图像访问模式近似性的关系组合图像。

16.按照权利要求14或15的系统，其中，图像组合装置按照相关图像被共同引用的概率的大小，顺序将相关图像组合成组合图像。

17.按照权利要求13的系统，其中，图像组合装置根据DOM树中的图像的距离，先组合距离较小的图像，再组合距离较大的图像。

18.按照权利要求12的系统，其中，图像组合装置通过遍历表示网页的DOM树，将相近的图像合并成组合图像。

19.按照权利要求12至18中的任何一个系统，其中，图像组合装置按照预定的组合图像大小阈值，组合两个或更多的相关图像。

20.按照权利要求12的系统，网页更新装置把网页中对相关图像的引用修改为对组合图像的文件和相关图像在组合图像中的位置信息的引用。