CN108280216A - 一种页面性能优化方法和装置 - Google Patents
一种页面性能优化方法和装置 Download PDFInfo
- Publication number
- CN108280216A CN108280216A CN201810117181.4A CN201810117181A CN108280216A CN 108280216 A CN108280216 A CN 108280216A CN 201810117181 A CN201810117181 A CN 201810117181A CN 108280216 A CN108280216 A CN 108280216A
- Authority
- CN
- China
- Prior art keywords
- page
- file
- browser
- resource file
- files
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
- G06F16/9577—Optimising the visualization of content, e.g. distillation of HTML documents
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
- G06F16/9574—Browsing optimisation, e.g. caching or content distillation of access to content, e.g. by caching
Landscapes
- Engineering & Computer Science (AREA)
- Databases & Information Systems (AREA)
- Theoretical Computer Science (AREA)
- Data Mining & Analysis (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Information Transfer Between Computers (AREA)
- Information Retrieval, Db Structures And Fs Structures Therefor (AREA)
Abstract
本发明公开了一种页面性能优化方法和装置，该页面性能优化方法包括：接收浏览器的访问请求时，确定访问请求对应的多个页面文件；将多个页面文件压缩成一个资源文件，并将资源文件返回给浏览器；浏览器根据接收到的资源文件，渲染页面。本发明通过接收浏览器的访问请求时，确定访问请求对应的多个页面文件，随后将多个页面文件压缩成一个资源文件，并将资源文件返回给浏览器，最后浏览器根据接收到的资源文件，渲染页面，从而通过将浏览器所需要的页面文件进行合并，浏览器请求完之后再拆分出浏览器需要的页面文件实现了请求次数的减少，进而实现了性能的优化。
Description
技术领域
本发明涉及计算机领域，具体来说，涉及一种页面性能优化方法和装置。
背景技术
随着浏览器的发展的越来越迅速，性能优化的问题也是越来越重要。然而，现有的技术方案是每次访问页面需要的文件都得分开进行一个一个的请求需要的数据，因为文件的类型的不同，如HTML(超文本链接标示语言)文件、JS(JavaScript，其是脚本语言，向HTML添加交互的语言)文件、CSS(层叠样式表)文件、图片等它们的格式本来就不同，所以每次请求的方式，怎样来请求都是不一样的，所以只能分开来一个一个的请求来实现网页需要的结果，但是，上面这种方式导致浏览器的请求次数比较多，从而浏览器的性能受到了影响。
针对相关技术中的问题，目前尚未提出有效的解决方案。
发明内容
针对相关技术中的问题，本发明提出一种页面性能优化方法和装置。
本发明的技术方案是这样实现的：
根据本发明的一个方面，提供了一种页面性能优化方法。
该页面性能优化方法包括：接收浏览器的访问请求时，确定访问请求对应的多个页面文件；将多个页面文件压缩成一个资源文件，并将资源文件返回给浏览器；浏览器根据接收到的资源文件，渲染页面。
根据本发明的一个实施例，页面文件包括以下至少之一：HTML文件、JS文件、CSS文件。
根据本发明的一个实施例，将多个页面文件压缩成一个资源文件，并将资源文件返回给浏览器包括：分别在每个页面文件上添加特殊字段；将多个添加特征字段后的页面文件压缩成一个资源文件，并将资源文件返回给浏览器。
根据本发明的一个实施例，浏览器根据接收到的资源文件，渲染页面包括：浏览器将接收到的资源文件进行拆分，并根据页面文件的扩展名和特征字段，区分每个页面文件；浏览器将拆分后的页面文件保存在缓存中，并根据缓存中保存的页面文件，渲染页面。
根据本发明的另一方面，提供了一种页面性能优化装置。
该页面性能优化装置包括：确定模块，用于接收浏览器的访问请求时，确定访问请求对应的多个页面文件；压缩模块，用于将多个页面文件压缩成一个资源文件，并将资源文件返回给浏览器；渲染模块，用于浏览器根据接收到的资源文件，渲染页面。
根据本发明的一个实施例，页面文件包括以下至少之一：HTML文件、JS文件、CSS文件。
根据本发明的一个实施例，压缩模块包括：添加模块，用于分别在每个页面文件上添加特殊字段；压缩子模块，用于将多个添加特征字段后的页面文件压缩成一个资源文件，并将资源文件返回给浏览器。
根据本发明的一个实施例，渲染模块包括：拆分模块，用于浏览器将接收到的资源文件进行拆分，并根据页面文件的扩展名和特征字段，区分每个页面文件；渲染子模块，用于浏览器将拆分后的页面文件保存在缓存中，并根据缓存中保存的页面文件，渲染页面。
本发明的有益技术效果在于：
本发明通过接收浏览器的访问请求时，确定访问请求对应的多个页面文件，随后将多个页面文件压缩成一个资源文件，并将资源文件返回给浏览器，最后浏览器根据接收到的资源文件，渲染页面，从而通过将浏览器所需要的页面文件进行合并，浏览器请求完之后再拆分出浏览器需要的页面文件实现了请求次数的减少，进而实现了性能的优化。
附图说明
为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
图1是根据本发明实施例的页面性能优化方法的流程图；
图2是根据本发明实施例的页面性能优化方法的具体流程图；
图3是现有技术中的请求数据的示意图；
图4是根据本发明实施例的请求数据的示意图；
图5是根据本发明实施例的页面性能优化装置的框图。
具体实施方式
下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员所获得的所有其他实施例，都属于本发明保护的范围。
根据本发明的实施例，提供了一种页面性能优化方法。
如图1所示，根据本发明实施例的页面性能优化方法包括：步骤S101，接收浏览器的访问请求时，确定访问请求对应的多个页面文件；步骤S103，将多个页面文件压缩成一个资源文件，并将资源文件返回给浏览器；步骤S105，浏览器根据接收到的资源文件，渲染页面。
借助于本发明的技术方案，通过接收浏览器的访问请求时，确定访问请求对应的多个页面文件，随后将多个页面文件压缩成一个资源文件，并将资源文件返回给浏览器，最后浏览器根据接收到的资源文件，渲染页面，从而通过将浏览器所需要的页面文件进行合并，浏览器请求完之后再拆分出浏览器需要的页面文件实现了请求次数的减少，进而实现了性能的优化。
根据本发明的一个实施例，页面文件包括以下至少之一：HTML文件、JS文件、CSS文件。
根据本发明的一个实施例，将多个页面文件压缩成一个资源文件，并将资源文件返回给浏览器包括：分别在每个页面文件上添加特殊字段；将多个添加特征字段后的页面文件压缩成一个资源文件，并将资源文件返回给浏览器。
根据本发明的一个实施例，浏览器根据接收到的资源文件，渲染页面包括：浏览器将接收到的资源文件进行拆分，并根据页面文件的扩展名和特征字段，区分每个页面文件；浏览器将拆分后的页面文件保存在缓存中，并根据缓存中保存的页面文件，渲染页面。
为了更好的理解本发明的技术方案，下面通过具体的实施例进行详细的描述。
由于现有的技术方案是浏览器在请求资源时，其都是频繁的建立连接跟断开连接来实现多个页面文件的请求，该方式对浏览器的性能影响比较大。然而，本发明通过将浏览器需要渲染的全部的页面文件合并为一个资源文件来减少HTTP(超文本传输协议)的请求，从而优化了浏览器的性能。
此外，如图2所示，本发明的页面性能优化方法详细步骤如下：
首先，渲染页面需要的HTML文件、JS文件、CSS文件、和/或图片等其他文件，同时，根据每个页面文件的扩展名(或后缀名)的不同来区分出页面文件的类别，例如，根据本发明的一个实施例，在页面文件的后缀名为.HTML(或.html)的情况下，确定该页面文件的类别为HTML文件。此外，为了区分每个类别中的页面文件，在每个页面文件中添加特殊字段(或字段)，以便于后面的分类识别，从而通过扩展名和特殊字段的方式，能够在每个类别中再具体区分具体哪个文件。此外，当然可以理解，虽然本实施例中仅示出了页面文件的三个内容，本领域的技术人员应当理解，该页面文件的具体类别可根据实际需求进行选择，本发明对此不作限定。
其次，如图3所示，在现有技术中，浏览器在渲染页面的时候，其通过HTTP请求频繁的建立连接和断开连接，来得到自己需要的数据并且渲染到页面上。然而。如图4所述，本发明通过将浏览器需要渲染的全部的页面文件合并为一个资源文件，从而避开浏览器频繁的建立连接和断开连接的情况，其能够提高浏览器的性能，进而实现浏览器对性能的优化。
再次，建立一个所有浏览器都识别的中转机制，通过这个中转机制根据页面文件的特殊字段，来对资源文件进行拆分，并且将拆分后的页面文件，每一个都存到浏览器便于取到位置，例如，根据本发明的一个实施例，将拆分后的页面文件保存到缓存中，以方便后面的各个浏览器(例如火狐浏览器、360浏览器等)识别浏览器应该渲染的文件。
最后，浏览器根据中转机制拆分资源文件。随后，浏览器会将HTML文件解析成一个DOM树(文档对象模型)，该DOM树的构建过程是一个深度遍历过程：当前节点的所有子节点都构建好后才会去构建当前节点的下一个兄弟节点。随后，浏览器将CSS文件解析成CSSRule Tree(CSS规则树)。随后，浏览器根据DOM树和CSSOM(CSS对象模型，其是建立在Web页面上的CSS样式的映射，与DOM类似，只是针对的对象与DOM不同)来构造Render Tree(渲染树)。此外，需要注意的是：该渲染树并不等同于上述的DOM树，因为一些像Header(标头)或display:none(隐藏对象内容)的东西就没必要放在渲染树中了。同时，有了渲染树，浏览器已经能知道网页中有哪些节点、各个节点的CSS定义以及他们的从属关系。下一步操作称之为layout(布局)，顾名思义就是计算出每个节点在屏幕中的位置。再下一步就是绘制，即遍历渲染树，并使用UI(用户界面)后端层绘制每个节点。此外，应当理解的是，通过页面文件渲染页面的过程属于本领域的常用技术手段，本发明在此不再过多细致的描述。
根据本发明的实施例，还提供了一种页面性能优化装置。
如图5所示，根据本发明实施例的页面性能优化装置包括：确定模块51，用于接收浏览器的访问请求时，确定访问请求对应的多个页面文件；压缩模块52，用于将多个页面文件压缩成一个资源文件，并将资源文件返回给浏览器；渲染模块53，用于浏览器根据接收到的资源文件，渲染页面。
根据本发明的一个实施例，页面文件包括以下至少之一：HTML文件、JS文件、CSS文件。
根据本发明的一个实施例，压缩模块52包括：添加模块(未示出)，用于分别在每个页面文件上添加特殊字段；压缩子模块(未示出)，用于将多个添加特征字段后的页面文件压缩成一个资源文件，并将资源文件返回给浏览器。
根据本发明的一个实施例，渲染模块53包括：拆分模块(未示出)，用于浏览器将接收到的资源文件进行拆分，并根据页面文件的扩展名和特征字段，区分每个页面文件；渲染子模块(未示出)，用于浏览器将拆分后的页面文件保存在缓存中，并根据缓存中保存的页面文件，渲染页面。
综上所述，借助于本发明的上述技术方案，通过接收浏览器的访问请求时，确定访问请求对应的多个页面文件，随后将多个页面文件压缩成一个资源文件，并将资源文件返回给浏览器，最后浏览器根据接收到的资源文件，渲染页面，从而通过将浏览器所需要的页面文件进行合并，浏览器请求完之后再拆分出浏览器需要的页面文件实现了请求次数的减少，进而实现了性能的优化。
以上所述仅为本发明的较佳实施例而已，并不用以限制本发明，凡在本发明的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。
Claims (8)
1.一种页面性能优化方法，其特征在于，包括：
接收浏览器的访问请求时，确定所述访问请求对应的多个页面文件；
将多个所述页面文件压缩成一个资源文件，并将所述资源文件返回给所述浏览器；
所述浏览器根据接收到的所述资源文件，渲染页面。
2.根据权利要求1所述的页面性能优化方法，其特征在于，所述页面文件包括以下至少之一：HTML文件、JS文件、CSS文件。
3.根据权利要求1所述的页面性能优化方法，其特征在于，将多个所述页面文件压缩成一个资源文件，并将所述资源文件返回给所述浏览器包括：
分别在每个所述页面文件上添加特殊字段；
将多个添加所述特征字段后的页面文件压缩成一个所述资源文件，并将所述资源文件返回给所述浏览器。
4.根据权利要求3所述的页面性能优化方法，其特征在于，所述浏览器根据接收到的所述资源文件，渲染页面包括：
所述浏览器将接收到的所述资源文件进行拆分，并根据所述页面文件的扩展名和所述特征字段，区分每个所述页面文件；
所述浏览器将拆分后的页面文件保存在缓存中，并根据所述缓存中保存的页面文件，渲染页面。
5.一种页面性能优化装置，其特征在于，包括：
确定模块，用于接收浏览器的访问请求时，确定所述访问请求对应的多个页面文件；
压缩模块，用于将多个所述页面文件压缩成一个资源文件，并将所述资源文件返回给所述浏览器；
渲染模块，用于所述浏览器根据接收到的所述资源文件，渲染页面。
6.根据权利要求5所述的页面性能优化装置，其特征在于，所述页面文件包括以下至少之一：HTML文件、JS文件、CSS文件。
7.根据权利要求5所述的页面性能优化装置，其特征在于，所述压缩模块包括：
添加模块，用于分别在每个所述页面文件上添加特殊字段；
压缩子模块，用于将多个添加所述特征字段后的页面文件压缩成一个所述资源文件，并将所述资源文件返回给所述浏览器。
8.根据权利要求7所述的页面性能优化装置，其特征在于，所述渲染模块包括：
拆分模块，用于所述浏览器将接收到的所述资源文件进行拆分，并根据所述页面文件的扩展名和所述特征字段，区分每个所述页面文件；
渲染子模块，用于所述浏览器将拆分后的页面文件保存在缓存中，并根据所述缓存中保存的页面文件，渲染页面。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201810117181.4A CN108280216A (zh) | 2018-02-06 | 2018-02-06 | 一种页面性能优化方法和装置 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201810117181.4A CN108280216A (zh) | 2018-02-06 | 2018-02-06 | 一种页面性能优化方法和装置 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN108280216A true CN108280216A (zh) | 2018-07-13 |
Family
ID=62807678
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201810117181.4A Pending CN108280216A (zh) | 2018-02-06 | 2018-02-06 | 一种页面性能优化方法和装置 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN108280216A (zh) |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN115982491A (zh) * | 2023-03-20 | 2023-04-18 | 建信金融科技有限责任公司 | 页面更新方法及装置、电子设备和计算机可读存储介质 |
Citations (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102185923A (zh) * | 2011-05-16 | 2011-09-14 | 广州市动景计算机科技有限公司 | 一种移动通讯设备终端网页浏览方法 |
| CN103020155A (zh) * | 2012-11-23 | 2013-04-03 | 中国电信股份有限公司云计算分公司 | 一种Web前端资源请求处理方法及装置 |
-
2018
- 2018-02-06 CN CN201810117181.4A patent/CN108280216A/zh active Pending
Patent Citations (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102185923A (zh) * | 2011-05-16 | 2011-09-14 | 广州市动景计算机科技有限公司 | 一种移动通讯设备终端网页浏览方法 |
| CN103020155A (zh) * | 2012-11-23 | 2013-04-03 | 中国电信股份有限公司云计算分公司 | 一种Web前端资源请求处理方法及装置 |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN115982491A (zh) * | 2023-03-20 | 2023-04-18 | 建信金融科技有限责任公司 | 页面更新方法及装置、电子设备和计算机可读存储介质 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN100462964C (zh) | 一种网页数据的更新显示方法 | |
| CN101197849B (zh) | 将互联网页面转换为无线应用协议页面的转换方法 | |
| JP5321586B2 (ja) | アプリケーション拡張システム、拡張方法、拡張プログラム | |
| US20160283499A1 (en) | Webpage advertisement interception method, device and browser | |
| US20090112824A1 (en) | Method and apparatus for generating presentation configuration file of document content | |
| US20070130510A1 (en) | Method and apparatus for improving user accessibility on the web | |
| JP2001344169A (ja) | ネットワークシステム、サーバ、ウェブサーバ、ウェブページ、データ処理方法、記憶媒体及びプログラム伝送装置 | |
| CN103258058B (zh) | 页面展现方法、系统及浏览器 | |
| CN100590624C (zh) | 基于soa架构的多维空间数据展现方法 | |
| US20090265420A1 (en) | Method of rendering at least one element in a client browser | |
| US20130124684A1 (en) | Visual separator detection in web pages using code analysis | |
| King et al. | WebbIE: a web browser for visually impaired people | |
| JP4846832B2 (ja) | Ｗｅｂページの表示方法、計算機システム及びプログラム | |
| CN110851136A (zh) | 数据获取方法、装置、电子设备及存储介质 | |
| CN103902571A (zh) | 保存网页完整内容的方法、系统及相应的客户端和服务器 | |
| JP2001195391A (ja) | フォーマット変換・ページ分割中継サーバ | |
| US20120120436A1 (en) | Remote printing | |
| Artail et al. | Device-aware desktop web page transformation for rendering on handhelds | |
| CN108280216A (zh) | 一种页面性能优化方法和装置 | |
| WO2002006981A1 (en) | Method of reformatting web page and method of providing web page using the same | |
| CN112433995A (zh) | 文件格式转换方法、系统、计算机设备及存储介质 | |
| US20090106651A1 (en) | Rendering Data From A Server For Display In A Web Browser On A Client Computer | |
| US7512905B1 (en) | Highlight linked-to document sections for increased readability | |
| CN101539914A (zh) | 对网页进行可读化定制转换的技术方案 | |
| JP2008123425A (ja) | ウェブ文書データ提供装置、方法、およびシステム |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| RJ01 | Rejection of invention patent application after publication | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20180713 |