CN109213948A - 网页加载方法、中间服务器和网页加载系统 - Google Patents
网页加载方法、中间服务器和网页加载系统 Download PDFInfo
- Publication number
- CN109213948A CN109213948A CN201811214794.6A CN201811214794A CN109213948A CN 109213948 A CN109213948 A CN 109213948A CN 201811214794 A CN201811214794 A CN 201811214794A CN 109213948 A CN109213948 A CN 109213948A
- Authority
- CN
- China
- Prior art keywords
- loading
- document
- item
- asynchronous
- function
- 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.)
- Granted
Links
- 238000011068 loading method Methods 0.000 title claims abstract description 196
- 238000013515 script Methods 0.000 claims abstract description 86
- 238000000034 method Methods 0.000 claims abstract description 50
- 230000006870 function Effects 0.000 claims description 86
- 230000008569 process Effects 0.000 claims description 31
- 230000006399 behavior Effects 0.000 claims description 11
- 238000004590 computer program Methods 0.000 claims description 6
- 238000004088 simulation Methods 0.000 abstract description 3
- 230000006872 improvement Effects 0.000 description 10
- 238000005457 optimization Methods 0.000 description 10
- 230000008859 change Effects 0.000 description 6
- 230000000694 effects Effects 0.000 description 5
- 230000002452 interceptive effect Effects 0.000 description 4
- 238000009877 rendering Methods 0.000 description 4
- 230000004044 response Effects 0.000 description 4
- 238000012360 testing method Methods 0.000 description 4
- 230000001133 acceleration Effects 0.000 description 3
- 238000004422 calculation algorithm Methods 0.000 description 2
- 238000010276 construction Methods 0.000 description 2
- 230000003111 delayed effect Effects 0.000 description 2
- 238000013461 design Methods 0.000 description 2
- 238000011161 development Methods 0.000 description 2
- 238000010586 diagram Methods 0.000 description 2
- 238000012986 modification Methods 0.000 description 2
- 230000004048 modification Effects 0.000 description 2
- 238000012544 monitoring process Methods 0.000 description 2
- 230000002093 peripheral effect Effects 0.000 description 2
- 230000005540 biological transmission Effects 0.000 description 1
- 230000000903 blocking effect Effects 0.000 description 1
- 238000005516 engineering process Methods 0.000 description 1
- 230000014509 gene expression Effects 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 238000012545 processing Methods 0.000 description 1
- 230000002035 prolonged effect Effects 0.000 description 1
- 238000011160 research Methods 0.000 description 1
- 230000002123 temporal effect Effects 0.000 description 1
- 230000001960 triggered effect Effects 0.000 description 1
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/9574—Browsing optimisation, e.g. caching or content distillation of access to content, e.g. by caching
-
- 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/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
- G06F16/972—Access to data in other repository systems, e.g. legacy data or dynamic Web page generation
-
- 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
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/12—Use of codes for handling textual entities
- G06F40/14—Tree-structured documents
- G06F40/143—Markup, e.g. Standard Generalized Markup Language [SGML] or Document Type Definition [DTD]
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/20—Natural language analysis
- G06F40/205—Parsing
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/445—Program loading or initiating
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Databases & Information Systems (AREA)
- Data Mining & Analysis (AREA)
- Software Systems (AREA)
- Health & Medical Sciences (AREA)
- Artificial Intelligence (AREA)
- Audiology, Speech & Language Pathology (AREA)
- Computational Linguistics (AREA)
- General Health & Medical Sciences (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本发明实施例涉及互联网领域，公开了一种网页加载方法、中间服务器和网页加载系统。本发明中的网页加载方法应用于中间服务器，方法包括：在接收到来自用户终端的页面加载请求时，根据加载请求获得对应页面的加载清单，加载清单中包括若干个异步加载项；在加载清单中增加调度脚本，其中，调度脚本用于：在页面加载完成后，执行异步加载项；若一异步加载项中存在文档写入函数，则改写文档写入函数的函数名，并将文档写入函数的参数值写入预设的缓存区；在该异步加载项执行完成后，读取缓存区中的数据，模拟文档写入函数的原生行为；将增加调度脚本后的加载清单反馈给用户终端，供用户终端请求加载清单上各加载项以进行页面加载，提升网页加载速度。
Description
技术领域
本发明实施例涉及互联网领域，特别涉及网页加载技术。
背景技术
一个页面中有多种资源，如HTML、JS(JavaScript)、CSS(Cascading Style Sheet，层叠样式表单)和IMAGE(图片)等。脚本(Script)是批处理文件的延伸，是一种纯文本保存的程序，一般来说的计算机脚本程序是确定的一系列控制计算机进行运算操作动作的组合，在其中可以实现一定的逻辑分支等。一个页面中有多种元素，如HTML、JS(即JavaScript的缩写)、CSS(Cascading Style Sheet，层叠样式表单)和图片等等。
JS脚本在浏览器的工作方式中，默认情况下遇到一段脚本时，浏览器需要停止并等待它执行完成，然后才能完成绘制页面，这意味着，文件是一个一个加载和执行，如果javascript加载或者执行时间过长，会阻塞后续大量资源请求，从而造成页面加载时间变长。这将影响浏览器的执行时间，当页面架构不合理，JS脚本位置靠前时，就会出现首屏加载缓慢，图片出不来，长期显示白屏，用户体验差的问题。
发明内容
本发明实施方式的目的在于提供一种网页加载方法、中间服务器和网页加载系统，使得提升网页加载速度。
为解决上述技术问题，本发明的实施方式提供了一种网页加载方法，应用于中间服务器，网页加载方法包括：在接收到来自用户终端的页面加载请求时，根据所述加载请求获得对应所述页面的加载清单，所述加载清单中包括若干个异步加载项；在所述加载清单中增加调度脚本，其中，所述调度脚本用于：在所述页面加载完成后，执行所述异步加载项；若一异步加载项中存在文档写入函数，则改写所述文档写入函数的函数名，并将所述文档写入函数的参数值写入预设的缓存区；在该异步加载项执行完成后，读取所述缓存区中的数据，模拟所述文档写入函数的原生行为；将增加调度脚本后的加载清单反馈给所述用户终端，供所述用户终端请求所述加载清单上的各加载项以进行页面加载。
本发明的实施方式还提供了一种中间服务器，包括：至少一个处理器；以及，与所述至少一个处理器通信连接的存储器；其中，所述存储器存储有可被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行，以使所述至少一个处理器能够执行如上述的网页加载方法。
本发明的实施方式还提供了一种网页加载系统，包括：用户终端和如上述的中间服务器。
本发明的实施方式还提供了一种计算机可读存储介质，存储有计算机程序，所述计算机程序被处理器执行时实现上所述的网页加载方法。
本发明实施方式相对于现有技术而言，通过改写文档写入函数的函数名称，避免在页面加载完成后，执行异步加载项时同时执行文档写入函数，造成调用文档流开启函数而形成的页面重绘问题。另外，将文档写入函数的参数值写入预设的缓存区，在异步加载项执行完成后，模拟文档写入函数的原生行为，保证原本文档写入函数的正确执行，不会对页面显示效果造成影响，兼容性强。可见，本发明实施方式中的网页加载方法、中间服务器和网页加载系统可以提升网页加载速度，同时避免页面在加载完成后再次出现白屏，兼容性好。另外，本发明实施方式创新地改进了行内既定的网站优化模式，既不需要改变用户终端的配置，也不需要改变源站的代码，又不需要改变需访问页面源站的网站构架，实施便捷，可以减少网站拥有者的技术开发时间，给用户终端侧提供更优质的上网体验，便于本发明实施方式的推广。
作为进一步改进，所述读取所述缓存区中的数据，具体包括：解析所述缓存区中的数据；在解析出待加载项时，将所述待加载项加入待执行队列头部，其中，所述待执行队列为所述异步加载项所处的队列，保护了文档写入函数中嵌套加载项的情况，更符合实际的应用场景。
作为进一步改进，所述解析缓存区中的数据之前，包括：利用所述缓存区中的数据构建文档树；所述解析缓存区中的数据，具体为：解析所述文档树。在解析数据之前先构建文档树再解析，可以加快解析速度。
作为进一步改进，所述模拟文档写入函数的原生行为，具体为：根据所述异步加载项在所述加载清单中的位置，将所述缓存区中的数据中的文本字段写入对应的位置。
作为进一步改进，所述根据异步加载项在所述加载清单中的位置，将所述缓存区中的数据中的文本字段写入对应的位置，具体包括：若所述异步加载项在所述加载清单中的头部位置，则将所述所述缓存区中的数据中的文本字段写入所述加载清单中的身体部的第一行；若所述异步加载项不在所述加载清单中的头部位置，则将所述所述缓存区中的数据中的文本字段写入所述异步加载项所在的位置。细化模拟原生行为的内容，保证文档写入函数被准确执行。
作为进一步改进，所述改写文档写入函数的函数名，具体为：利用预设的字符串改写文档写入函数的函数名。利用字符串替换，简单直接，兼容性好。
作为进一步改进，所述文档写入函数为document.write函数或document.writeln函数。明确两种写入函数，更符合实际应用场景。
作为进一步改进，所述调度脚本具体用于，通过改写所述加载清单的文档状态，注册并触发预设事件以模拟页面的加载过程。本实施例明确模拟页面加载过程的方式。
作为进一步改进，所述在加载清单中增加调度脚本之前，还包括：判断是否采用优化服务，并在判定为是时，执行所述在加载清单中增加调度脚本的步骤。本实施例只在判定为需要优化时才进入，使得本发明实施方式更符合实际情况。
作为进一步改进，根据所述页面加载请求中的请求地址，判断是否采用所述优化服务。
附图说明
一个或多个实施例通过与之对应的附图中的图片进行示例性说明，这些示例性说明并不构成对实施例的限定，附图中具有相同参考数字标号的元件表示为类似的元件，除非有特别申明，附图中的图不构成比例限制。
图1是根据本发明第一实施方式中的网页加载方法流程图；
图2是根据本发明第一实施方式中的网页加载系统的整体工作流程图；
图3是根据本发明第二实施方式中的调度脚本的执行流程图；
图4是根据本发明第三实施方式中的浏览器的一般渲染过程流程图；
图5是根据本发明第三实施方式中的调度脚本的执行流程图；
图6是根据本发明第五实施方式中的中间服务器的结构示意图。
具体实施方式
为使本发明实施例的目的、技术方案和优点更加清楚，下面将结合附图对本发明的各实施方式进行详细的阐述。然而，本领域的普通技术人员可以理解，在本发明各实施方式中，为了使读者更好地理解本申请而提出了许多技术细节。但是，即使没有这些技术细节和基于以下各实施方式的种种变化和修改，也可以实现本申请所要求保护的技术方案。
本发明的第一实施方式涉及一种网页加载方法。
本实施方式应用于一种中间服务器，中间服务器可以是网络中用于传递数据的一些服务器，它接收客户端发送的请求，之后将请求发送到后端(即源站服务器)获取后端响应，在收到后端响应后，再将响应内容以适当的形式发送给前端(即客户端)。例如：CDN节点是非常典型的中间服务器，其响应所需的数据均是后端产生的，只是可能会缓存在节点上；负载均衡服务器也是非常典型的中间服务器，用于接收客户端的请求，并发请求分散到多个后端服务器上；代理服务器也是中间服务器，负责转发请求到真正的后端服务器上，可见，实际应用中有不同种类的中间服务器，在此不再一一列举。
本实施方式中的网页加载方法的流程如图1所示，具体如下：
步骤101，根据加载请求获得对应页面的加载清单。
具体的说，本步骤在接收到来自用户终端的页面加载请求时，根据加载请求获得对应页面的加载清单。更具体的说，加载清单实际应用中可以是html文档，其中包括若干个异步加载项，本实施方式以异步加载项为JS脚本为例进行说明，实际应用中加载清单中除了异步加载项外，还有HTML、CSS和图片等，在此不再一一列举。
步骤102，在加载清单中增加调度脚本。
具体的说，调度脚本用于：在所述页面加载完成后，模拟所述页面的加载过程，执行所述异步加载项；若一异步加载项中存在文档写入函数，则改写所述文档写入函数的函数名，并将所述文档写入函数的参数值写入预设的缓存区；在该异步加载项执行完成后，读取所述缓存区中的数据，模拟所述文档写入函数的原生行为，本实施方式中的页面加载过程主要指的是浏览器渲染的过程。其中，文档写入函数可以为document.write函数或document.writeln函数。
更具体的说，在该异步加载项执行完成后，读取所述缓存区中的数据的过程，可以利用回调函数实现，具体在从执行队列中提取异步加载项时，就在其中增加回调函数，用于在该异步加载项执行完成后，读取缓存区中的数据。
另一方面，预设的缓存区可以预先新建，具体可以每次执行异步加载项时新建。
步骤103，将增加调度脚本后的加载清单反馈给用户终端，供用户终端请求加载清单上的各加载项以进行页面加载。
具体的说，用户终端侧在收到加载清单后，即可进行解析执行等步骤，无需改变浏览器本身的操作流程，加载清单中的调度脚本将会完成页面加载过程的模拟以及JS脚本的调用执行。
本申请发明人发现，虽然在优化网页加载速度后，可以避免JS脚本对加载过程的阻塞，使得用户尽快看到网页上的内容，但有时用户虽然看到了页面内容，页面会再次白屏，或发生大部分内容消失的情况，这显然是需要避免的现象。进一步研究后发现，由于一个页面中采用document.write函数(文档写入函数)可以向文档(即加载清单)写入HTML(超文本)表达式或JavaScript代码。当文档加载时调用document.write直接向页面输出内容，文档加载结束后调用document.write，将自动调用document.open函数(文档打开函数)以打开文档流，这时文档流已经关闭，则浏览器会重写页面所有内容，造成页面内容被覆盖，出现页面白屏或者只显示部分内容的现象。所以本申请的发明人想到，修改加载清单，加入调度脚本，避免文档写入函数在页面加载完成后执行，这样就不会调用document.open函数，也就不会造成页面的重绘。
需要说明的是，上述步骤101至103涉及的是中间服务器的主要执行步骤，本实施方式继续以中间服务器为边缘节点、用户终端为用户浏览器为例，说明实际应用的网页加载系统的整体工作流程，其流程图如图2所示。具体的说，首先由用户浏览器向边缘节点发起网站访问请求，边缘节点接收到用户请求后，向源站服务器请求资源，源站服务器收到请求后，返回原始html文档(即加载清单)，边缘节点收到html文档后，根据服务器配置判断是否改写，也就是说，边缘节点判断是否采用优化服务，具体可以根据加载请求中的请求地址判断，如果判定为是，那么边缘脚本就对html文档内容进行改写，也就是说，在判定为是时，将在html文档中增加调度脚本，之后将改写后的html文档发送至用户浏览器，如果判定为否，则直接将原始html文档发送至用户浏览器，用户浏览器在收到html文档后，进行解析，解析中调度脚本对JS脚本进行加载、执行，直至解析完成。可见，图3也是浏览器在加载页面时的完整过程。
可见，本实施方式通过改写文档写入函数的函数名称，避免在模拟加载过程中国执行异步加载项时同时执行文档写入函数，造成调用文档流开启函数而形成的页面重绘问题。另外，将文档写入函数的参数值写入预设的缓存区，在异步加载项执行完成后，模拟文档写入函数的原生行为，保证原本文档写入函数的正确执行，不会对页面显示效果造成影响，兼容性强。可见，本发明实施方式中的网页加载方法可以提升网页加载速度，同时避免页面在加载完成后再次出现白屏，兼容性好。此外，本实施方式创新地改进了行内既定的网站优化模式，既不需要改变用户终端的配置，也不需要改变源站的代码，又不需要改变需访问页面源站的网站构架，实施便捷，可以减少网站拥有者的技术开发时间，给用户终端侧提供更优质的上网体验，便于本发明实施方式的推广。
本发明的第二实施方式涉及一种网页加载方法。在本实施方式中，明确调用脚本的执行过程。
具体的说，本实施方式中在所述页面加载完成后，执行所述异步加载项。其中，在执行异步加载项时，进一步执行：若一异步加载项中存在文档写入函数，则改写所述文档写入函数的函数名，并将所述文档写入函数的参数值写入预设的缓存区；在该异步加载项执行完成后，读取所述缓存区中的数据，模拟所述文档写入函数的原生行为。
如图3所示，具体说明调用脚本执行异步加载项的过程：
步骤301，判断异步加载项中是否存在文档写入函数；若是，则执行步骤302；若否，则结束本实施方式中调用脚本异步加载项的流程。
步骤302，将文档写入函数的参数值写入预设的缓存区。
具体的说，缓存区可以利用变量建立，可以预先建立后备用。更具体的说，将文档写入函数的所有参数内容完全地写入该缓存区，以备后续解析，此时暂不执行。
步骤303，改写文档写入函数的函数名。
具体的说，文档写入函数的函数名可以是document.write函数或document.writeln函数，在改写时，可以用预设的字符串替换上述函数名，使得执行异步加载项时，无法识别出文档写入函数。
虽然本实施方式中限定上述步骤302和303的执行顺序，但实际应用中，也可以同时执行，或先执行函数名改写，在此不做限定。
步骤304，在该异步加载项执行完成后，读取缓存区中的数据。
具体的说，在异步加载项执行完成后，由于之前的文档写入函数没有执行，所以为保证文档写入函数的准确执行。
实际应用中，在读取之后，还可以利用所述缓存区中的数据构建文档树，如使用DOMParser(文档解析)类传入缓存数据，构建内存虚拟的文档树，如构建为xml(文本标记语言)格式的文档树，以便于后续解析时更为快速简便。
步骤305，判断缓存区中的数据中是否存在待加载项；若是，则执行步骤306；若否，则执行步骤307。
具体的说，待加载项可以是JS脚本，可以利用JS脚本的识别标签<script>标签来识别缓存区中是否存在JS脚本。
实际应用中，如果将数据先行构建为虚拟文档树，那么在判定是否存在JS脚本时，就可以在虚拟文档树中检索<script>标签。
步骤306，将待加载项加入待执行队列头部。
实际应用中，可以将识别出的JS脚本加入待执行队列头部，也就是当前正在执行的异步加载项所在的执行队列的头部，以便在当前异步加载项执行完成后，继续执行识别出的JS脚本。其中，如果识别出多个JS脚本，也将依次放入待执行队列头部。
步骤307，模拟文档写入函数的原生行为处理缓存区数据中的文本字段。
在处理完缓存区中的JS脚本后，可能还存在文本字段，由于文档写入函数的函数名被改写，所以在异步加载项执行时，文档写入函数并未执行，本步骤中以模拟原生行为的方式来执行文档写入函数，在保证文档写入函数被准确执行的同时，不会调用document.open函数。其中，识别文本字段也可以在步骤304构建的虚拟文档树中解析获得。
具体的说，文档写入函数的原生行为是将参数值中的文本字段写入文档的某个位置，具体的写入位置根据当前异步加载项所处的位置确定。更具体的说，若所述异步加载项在所述加载清单中的头部位置，则将所述缓存区中的数据中的文本字段写入所述加载清单中的身体部的第一行；若所述异步加载项不在所述加载清单中的头部位置，则将所述缓存区中的数据中的文本字段写入所述异步加载项所在的位置。
以当前执行的异步加载项为JS脚本为例举例说明：判断脚本位置是否位于<head>标签中，如果处于标签中，则将文本内容添加至<body></body>第一行内容；如果脚本位置非<head>位置，则在脚本的当前位置写入文本内容。
需要说明的是，步骤305和步骤307的执行顺序可以改变，可以先执行步骤307，对文本字段进行处理，再执行步骤305确定是否存在JS脚本，并在存在JS脚本时进一步将JS脚本放入待执行队列。
继续说明的是，上述步骤301至步骤307为调用脚本对一个异步加载项的执行过程，在完成之后可以继续调用待执行队列中的下一个异步加载项继续执行，直至所有异步加载项被执行完成。
可见，本实施方式明确了调用脚本的执行过程，更符合实际情况，在文档写入函数中存在嵌套脚本的情况下，也能在脚本准确执行的同时，不会调用document.open函数而造成网页重绘的问题。
本发明的第三实施方式涉及一种网页加载方法。本实施方式是在第二实施方式上的进一步改进，主要改进之处在于：调度脚本具体用于，在所述页面加载完成后，模拟所述页面的加载过程，在模拟出的加载过程中执行所述异步加载项。在模拟出的加载过程中执行异步加载项，使得本实施方式中网页加载方法的兼容性更好，减少错误概率。
具体的说，在模拟所述页面的加载过程时，可以通过改写所述加载清单的文档状态，注册并触发预设事件以模拟页面的加载过程。以下具体说明：
浏览器的一般渲染过程如图4所示，在整个渲染过程中，html文档(下部分简称为“文档”)状态共包括四个状态，也就是说，Document.readyState属性具体有四个值：uninitialized(未开始载入)、loading(载入中)、interactive(已加载，文档和用户开始交互)、complete(载入完成)，在特定阶段还会触发特定事件。本实施方式中的调度脚本具体用于改写加载清单的文档状态，注册并触发预设事件，从而模拟页面的加载过程。
进一步说，由于在网页加载过程中需要构建dom树(文档树)，现在对dom树和本申请中模拟出的页面加载过程的关系进行概要说明：在开始加载后，首先将Document.readyState属性设置为uninitialized，开始构建dom树，再将Document.readyState属性设置为loading，随后执行非defer属性脚本，在dom树构建即将完成时，将Document.readyState属性设置为interactive，随后执行defer属性脚本，之后在dom树构建完成后，触发domcontentloaded事件，之后在页面资源完成下载后，将Document.readyState属性设置为complete，接着再触发page load事件，从而结束整个页面加载过程。
本实施方式中的调度脚本的执行流程可以如图5所示，具体如下：
步骤501，拦截第一类预设事件。
具体的说，第一类预设事件可以包括以下之一或其任意组合：document.onreadystatechange(文档状态改变)事件、window.onload(页面加载完成)事件、document.body.onload(页面加载完成)事件。由于原有html文档中可能存在监听脚本，在监听到上述事件后，将对待加载页面重新渲染，所以拦截上述事件可以进一步避免网页白屏，提升调度脚本的兼容性。
值得一提的是，由于实际应用中，源站服务器提供的html文档可能不存在上述事件的监听脚本，那么调度脚本中也可以不执行本步骤501，也就是说，步骤501可以为非必要步骤。
步骤502，设置当前文档状态readyState＝loading(文档状态加载中)，并注册window.load(页面加载完成)事件。
具体的说，本步骤改写了html文档的状态，也就是对原本已加载完成的页面进行模拟加载，后续对加载清单中各JS脚本进行加载。
步骤503，在浏览器页面加载完成时，触发window.load事件。
步骤504，扫描文档中非延迟属性的脚本，加入脚本执行队列。
具体的说，异步加载项对应有延迟属性和非延迟属性，其中的延迟属性用defer表征，非延迟属性即属性字符串中不包含defer的属性，所以在扫描时，通过扫描“defer”即可明确是否为延迟属性的脚本。
还需要说明的是，本实施方式可以和第二实施方式结合使用，也就是预先对异步加载项的属性进行改写，改写时利用预设字符串进行替换，那么在本步骤进行扫描时，即可用预设字符串进行扫描，从而明确是否为异步加载项。
如：预设字符串为“comet”，预先将“javascript”替换为“comet”避免浏览器在第一次加载页面时对其解析，那么在步骤504中通过“comet”识别出需要执行的异步加载项。
步骤505，执行队列中的脚本。
具体的说，可以根据脚本加入队列的时间前后关系，依次执行队列中的脚本。
还需说明的是，上述步骤502至504在设置当前文档状态readyState＝loading，注册并触发window.load事件后执行非延迟属性的异步加载项。
步骤506，设置当前文档状态readyState＝interactive(文档状态为已加载，文档和用户开始交互)，触发onreadystatechange(文档状态改变)事件。
步骤507，扫描文档中延迟属性的脚本，加入脚本执行队列。
步骤508，执行队列中的脚本。
具体的说，根据脚本加入队列的时间前后关系，依次执行队列中的脚本。
还需说明的是，上述步骤506至508在设置当前文档状态readyState＝interactive，触发onreadystatechange事件后执行延迟属性的异步加载项。
还需说明的是，本实施方式中在非延迟属性的异步加载项执行完成后，再执行延迟属性的异步加载项，保证不同类型的异步加载项均被准确执行。
步骤509，触发浏览器DomContentLoaded事件。
步骤510，设置当前文档状态readyState＝complete(文档状态＝完全加载)，触发onreadystatechange事件。
步骤511，触发浏览器page load事件。
具体的说，至此页面脚本解析结束，在各异步加载项被加载完成后，仍继续模拟加载过程中的剩余阶段，避免页面出现重新渲染的问题。
值得一提的是，本发明的发明人使用2台测试机器同时开始测试，范围涉及159个网站，分别测试未加速场景和加速场景的domcontentloaded(HTML文档已完全加载和解析)时间以及page load(页面资源加载成功)时间，并且统计使用加速场景的网站兼容性指标。测试结果如下表1-3：
表1加速场景平均优化率
表2加速场景加速效果
| 优化率>0％(网站数) | 优化率>50％(网站数) | |
| domcontentloaded | 127 | 64 |
| pageload | 127 | 36 |
表3加速场景兼容性指标
可见，加速场景平均优化率、加速场景加速效果、加速场景兼容性指标均体现了本发明实施方式不仅加速效果好，兼容率也大有提升，符合产品上线要求。
本实施方式中明确了调度脚本具体模拟过程，且在特定过程中执行对应属性的异步加载项，使得异步加载项均可以被准确执行，也尽可能避免了待加载页面在第一次加载完成后重新渲染。
上面各种方法的步骤划分，只是为了描述清楚，实现时可以合并为一个步骤或者对某些步骤进行拆分，分解为多个步骤，只要包括相同的逻辑关系，都在本专利的保护范围内；对算法中或者流程中添加无关紧要的修改或者引入无关紧要的设计，但不改变其算法和流程的核心设计都在该专利的保护范围内。
本发明第四实施方式涉及一种中间服务器，如图6所示，包括：
至少一个处理器；以及，与至少一个处理器通信连接的存储器；其中，存储器存储有可被至少一个处理器执行的指令，指令被至少一个处理器执行，以使至少一个处理器能够执行如第一实施方式至第四实施方式中任一的网页加载方法。
其中，存储器和处理器采用总线方式连接，总线可以包括任意数量的互联的总线和桥，总线将一个或多个处理器和存储器的各种电路连接在一起。总线还可以将诸如外围设备、稳压器和功率管理电路等之类的各种其他电路连接在一起，这些都是本领域所公知的，因此，本文不再对其进行进一步描述。总线接口在总线和收发机之间提供接口。收发机可以是一个元件，也可以是多个元件，比如多个接收器和发送器，提供用于在传输介质上与各种其他装置通信的单元。经处理器处理的数据通过天线在无线介质上进行传输，进一步，天线还接收数据并将数据传送给处理器。
处理器负责管理总线和通常的处理，还可以提供各种功能，包括定时，外围接口，电压调节、电源管理以及其他控制功能。而存储器可以被用于存储处理器在执行操作时所使用的数据。
本发明第五实施方式涉及一种网页加载系统，具体包括：用户终端和如第五实施方式中的中间服务器。
不难发现，本实施方式为与第六实施方式相对应的系统实施例，本实施方式可包含第六实施方式的技术方案，第六实施方式中提到的相关技术细节在本实施方式中依然有效，为了减少重复，这里不再赘述。
本发明第六实施方式涉及一种计算机可读存储介质，存储有计算机程序。计算机程序被处理器执行时实现上述方法实施例。
即，本领域技术人员可以理解，实现上述实施例方法中的全部或部分步骤是可以通过程序来指令相关的硬件来完成，该程序存储在一个存储介质中，包括若干指令用以使得一个设备(可以是单片机，芯片等)或处理器(processor)执行本申请各个实施例方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(ROM，Read-OnlyMemory)、随机存取存储器(RAM，Random Access Memory)、磁碟或者光盘等各种可以存储程序代码的介质。
本领域的普通技术人员可以理解，上述各实施方式是实现本发明的具体实施例，而在实际应用中，可以在形式上和细节上对其作各种改变，而不偏离本发明的精神和范围。
Claims (15)
1.一种网页加载方法，其特征在于，应用于中间服务器，所述网页加载方法包括：
在接收到来自用户终端的页面加载请求时，根据所述加载请求获得对应所述页面的加载清单，所述加载清单中包括若干个异步加载项；
在所述加载清单中增加调度脚本，其中，所述调度脚本用于：在所述页面加载完成后，执行所述异步加载项；其中，若一异步加载项中存在文档写入函数，则改写所述文档写入函数的函数名，并将所述文档写入函数的参数值写入预设的缓存区；在该异步加载项执行完成后，读取所述缓存区中的数据，模拟所述文档写入函数的原生行为；
将增加调度脚本后的加载清单反馈给所述用户终端，供所述用户终端请求所述加载清单上的各加载项以进行页面加载。
2.根据权利要求1所述的网页加载方法，其特征在于，所述读取所述缓存区中的数据，具体包括：
解析所述缓存区中的数据；
在解析出待加载项时，将所述待加载项加入待执行队列头部，其中，所述待执行队列为所述异步加载项所处的队列。
3.根据权利要求2所述的网页加载方法，其特征在于，所述解析缓存区中的数据之前，包括：利用所述缓存区中的数据构建文档树；
所述解析缓存区中的数据，具体为：解析所述文档树。
4.根据权利要求2所述的网页加载方法，其特征在于，所述待加载项为JS脚本。
5.根据权利要求1所述的网页加载方法，其特征在于，所述模拟文档写入函数的原生行为，具体为：根据所述异步加载项在所述加载清单中的位置，将所述缓存区中的数据中的文本字段写入对应的位置。
6.根据权利要求5所述的网页加载方法，其特征在于，所述根据异步加载项在所述加载清单中的位置，将所述缓存区中的数据中的文本字段写入对应的位置，具体包括：
若所述异步加载项在所述加载清单中的头部位置，则将所述缓存区中的数据中的文本字段写入所述加载清单中的身体部的第一行；
若所述异步加载项不在所述加载清单中的头部位置，则将所述缓存区中的数据中的文本字段写入所述异步加载项所在的位置。
7.根据权利要求1所述的网页加载方法，其特征在于，所述改写文档写入函数的函数名，具体为：利用预设的字符串改写文档写入函数的函数名。
8.根据权利要求1至7中任意一项所述的网页加载方法，其特征在于，所述文档写入函数为document.write函数或document.writeln函数。
9.根据权利要求1所述的网页加载方法，其特征在于，所述调度脚本具体用于，在所述页面加载完成后，模拟所述页面的加载过程，在模拟出的加载过程中执行所述异步加载项。
10.根据权利要求9所述的网页加载方法，其特征在于，所述调度脚本具体用于，通过改写所述加载清单的文档状态，注册并触发预设事件以模拟页面的加载过程。
11.根据权利要求1所述的网页加载方法，其特征在于，所述在加载清单中增加调度脚本之前，还包括：
判断是否采用优化服务，并在判定为是时，执行所述在加载清单中增加调度脚本的步骤。
12.根据权利要求11所述的网页加载方法，其特征在于，根据所述页面加载请求中的请求地址，判断是否采用所述优化服务。
13.一种中间服务器，其特征在于，包括：
至少一个处理器；以及，
与所述至少一个处理器通信连接的存储器；其中，
所述存储器存储有可被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行，以使所述至少一个处理器能够执行如权利要求1至12中任一所述的网页加载方法。
14.一种网页加载系统，其特征在于，包括：用户终端和如权利要求13所述的中间服务器。
15.一种计算机可读存储介质，存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现权利要求1至12中任一项所述的网页加载方法。
Priority Applications (4)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201811214794.6A CN109213948B (zh) | 2018-10-18 | 2018-10-18 | 网页加载方法、中间服务器和网页加载系统 |
| PCT/CN2018/119595 WO2020077764A1 (zh) | 2018-10-18 | 2018-12-06 | 网页加载方法、中间服务器和网页加载系统 |
| US16/766,732 US20200293593A1 (en) | 2018-10-18 | 2018-12-06 | Page loading method, intermediate server, and page loading system |
| EP18936943.2A EP3866030A4 (en) | 2018-10-18 | 2018-12-06 | WEB PAGE LOADING PROCESS, INTERMEDIATE SERVER AND WEB PAGE LOADING SYSTEM |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201811214794.6A CN109213948B (zh) | 2018-10-18 | 2018-10-18 | 网页加载方法、中间服务器和网页加载系统 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN109213948A true CN109213948A (zh) | 2019-01-15 |
| CN109213948B CN109213948B (zh) | 2020-12-04 |
Family
ID=64980714
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201811214794.6A Active CN109213948B (zh) | 2018-10-18 | 2018-10-18 | 网页加载方法、中间服务器和网页加载系统 |
Country Status (4)
| Country | Link |
|---|---|
| US (1) | US20200293593A1 (zh) |
| EP (1) | EP3866030A4 (zh) |
| CN (1) | CN109213948B (zh) |
| WO (1) | WO2020077764A1 (zh) |
Cited By (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN110489698A (zh) * | 2019-08-16 | 2019-11-22 | 南京云帐房网络科技有限公司 | 一种自动化采集网页数据的系统及方法 |
| CN111124528A (zh) * | 2019-11-11 | 2020-05-08 | 泰康保险集团股份有限公司 | 页面加载方法、装置、电子设备及计算机可读存储介质 |
| CN111428171A (zh) * | 2020-03-23 | 2020-07-17 | 郑州悉知信息科技股份有限公司 | 接口调用处理方法和系统 |
| CN111753227A (zh) * | 2019-03-26 | 2020-10-09 | 北京宸信征信有限公司 | 一种基于异步加载数据信息的屏幕展示系统和方法 |
| CN114968407A (zh) * | 2022-05-30 | 2022-08-30 | 北京金堤科技有限公司 | 插件调用方法、装置、电子设备及存储介质 |
Families Citing this family (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN111782996A (zh) * | 2020-05-29 | 2020-10-16 | 厦门市美亚柏科信息股份有限公司 | 异步请求处理方法和装置 |
| CN111783018B (zh) * | 2020-07-28 | 2024-07-05 | 支付宝(杭州)信息技术有限公司 | 一种页面处理方法、装置及设备 |
| CN112035186B (zh) * | 2020-09-02 | 2023-10-13 | 湖北华中电力科技开发有限责任公司 | H5页面的预加载及跳转方法、装置、设备及介质 |
| CN113360807B (zh) * | 2021-06-24 | 2023-03-31 | 平安普惠企业管理有限公司 | 混合模式移动应用的页面显示方法、装置及相关设备 |
Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102185923A (zh) * | 2011-05-16 | 2011-09-14 | 广州市动景计算机科技有限公司 | 一种移动通讯设备终端网页浏览方法 |
| US20120079057A1 (en) * | 2009-08-03 | 2012-03-29 | Limelight Networks, inc | Acceleration and optimization of web pages access by changing the order of resource loading |
| CN103336702A (zh) * | 2013-06-29 | 2013-10-02 | 广州市动景计算机科技有限公司 | 网页加载加速方法及装置 |
| CN103412890A (zh) * | 2013-07-19 | 2013-11-27 | 北京亿赞普网络技术有限公司 | 一种网页加载方法和装置 |
| US20160094615A1 (en) * | 2014-09-25 | 2016-03-31 | Oracle International Corporation | Reducing web page load latency by scheduling sets of successive outgoing http calls |
Family Cites Families (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US8285808B1 (en) * | 2011-05-20 | 2012-10-09 | Cloudflare, Inc. | Loading of web resources |
| CN103778236B (zh) * | 2014-01-26 | 2018-06-08 | 网宿科技股份有限公司 | 网页数据分发处理方法和装置及网页生成处理方法和装置 |
| CN104182547A (zh) * | 2014-09-10 | 2014-12-03 | 北京浩瀚深度信息技术股份有限公司 | 一种服务器优化页面渲染的方法及web cache服务器 |
| CN105630524B (zh) * | 2014-10-31 | 2019-04-12 | 广州市动景计算机科技有限公司 | 网页文本解析方法、装置和移动终端 |
| CN105468369B (zh) * | 2015-11-19 | 2019-03-26 | 深圳联友科技有限公司 | 移动平台上JavaScript调用原生功能的方法以及系统 |
| CN105608152A (zh) * | 2015-12-17 | 2016-05-25 | 无锡天脉聚源传媒科技有限公司 | 一种网页资源异步加载的方法及装置 |
-
2018
- 2018-10-18 CN CN201811214794.6A patent/CN109213948B/zh active Active
- 2018-12-06 US US16/766,732 patent/US20200293593A1/en not_active Abandoned
- 2018-12-06 EP EP18936943.2A patent/EP3866030A4/en not_active Withdrawn
- 2018-12-06 WO PCT/CN2018/119595 patent/WO2020077764A1/zh unknown
Patent Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20120079057A1 (en) * | 2009-08-03 | 2012-03-29 | Limelight Networks, inc | Acceleration and optimization of web pages access by changing the order of resource loading |
| CN102185923A (zh) * | 2011-05-16 | 2011-09-14 | 广州市动景计算机科技有限公司 | 一种移动通讯设备终端网页浏览方法 |
| CN103336702A (zh) * | 2013-06-29 | 2013-10-02 | 广州市动景计算机科技有限公司 | 网页加载加速方法及装置 |
| CN103412890A (zh) * | 2013-07-19 | 2013-11-27 | 北京亿赞普网络技术有限公司 | 一种网页加载方法和装置 |
| US20160094615A1 (en) * | 2014-09-25 | 2016-03-31 | Oracle International Corporation | Reducing web page load latency by scheduling sets of successive outgoing http calls |
Non-Patent Citations (1)
| Title |
|---|
| 我要评论: "用js的document.write输出的广告无阻塞加载的方法", 《脚本之家》 * |
Cited By (10)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN111753227A (zh) * | 2019-03-26 | 2020-10-09 | 北京宸信征信有限公司 | 一种基于异步加载数据信息的屏幕展示系统和方法 |
| CN111753227B (zh) * | 2019-03-26 | 2024-04-26 | 北京宸信征信有限公司 | 一种基于异步加载数据信息的屏幕展示系统和方法 |
| CN110489698A (zh) * | 2019-08-16 | 2019-11-22 | 南京云帐房网络科技有限公司 | 一种自动化采集网页数据的系统及方法 |
| CN110489698B (zh) * | 2019-08-16 | 2023-03-21 | 云帐房网络科技有限公司 | 一种自动化采集网页数据的系统及方法 |
| CN111124528A (zh) * | 2019-11-11 | 2020-05-08 | 泰康保险集团股份有限公司 | 页面加载方法、装置、电子设备及计算机可读存储介质 |
| CN111124528B (zh) * | 2019-11-11 | 2023-06-27 | 泰康保险集团股份有限公司 | 页面加载方法、装置、电子设备及计算机可读存储介质 |
| CN111428171A (zh) * | 2020-03-23 | 2020-07-17 | 郑州悉知信息科技股份有限公司 | 接口调用处理方法和系统 |
| CN111428171B (zh) * | 2020-03-23 | 2023-06-30 | 郑州悉知信息科技股份有限公司 | 接口调用处理方法和系统 |
| CN114968407A (zh) * | 2022-05-30 | 2022-08-30 | 北京金堤科技有限公司 | 插件调用方法、装置、电子设备及存储介质 |
| CN114968407B (zh) * | 2022-05-30 | 2024-03-08 | 北京金堤科技有限公司 | 插件调用方法、装置、电子设备及存储介质 |
Also Published As
| Publication number | Publication date |
|---|---|
| US20200293593A1 (en) | 2020-09-17 |
| EP3866030A1 (en) | 2021-08-18 |
| WO2020077764A1 (zh) | 2020-04-23 |
| CN109213948B (zh) | 2020-12-04 |
| EP3866030A4 (en) | 2021-12-08 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN109213948B (zh) | 网页加载方法、中间服务器和网页加载系统 | |
| US11915018B2 (en) | Method and apparatus for user interface modification | |
| US11032388B2 (en) | Methods for prerendering and methods for managing and configuring prerendering operations | |
| US9141611B2 (en) | Aggregated web analytics request systems and methods | |
| WO2019205203A1 (zh) | 一种网页加载方法、服务器和网页加载系统 | |
| US20170315982A1 (en) | Method, device and mobile terminal for webpage text parsing | |
| CN109344351B (zh) | 网页加载方法、中间服务器和网页加载系统 | |
| US9678814B2 (en) | Implementing a java method | |
| US10726092B2 (en) | Method of improving web page loading time using scannable indicia | |
| CN112116325A (zh) | 审批表单控制方法、装置、电子设备和可读存储介质 | |
| CN111079048A (zh) | 一种页面加载方法及装置 | |
| CN112818270A (zh) | 数据跨域传递方法、装置及计算机设备 | |
| US20090300103A1 (en) | Storage medium recording a program for rewriting uniform resource locator information | |
| US10417318B2 (en) | Treatment controller | |
| US20140237133A1 (en) | Page download control method, system and program for ie core browser | |
| US20220066810A1 (en) | Information processing system and method of controlling information processing system | |
| US9122519B1 (en) | Governor for elimination of repetitive requests | |
| CN115185513A (zh) | 界面的更新方法及装置、存储介质、计算机设备 | |
| CN113918852A (zh) | 一种网页显示方法、装置及设备 | |
| CN117332173A (zh) | 基于Vue3组件的页面渲染方法、系统、介质及设备 | |
| CN117093800A (zh) | 网络资产数据报告pdf批量输出方法、装置及电子设备 | |
| CN115795202A (zh) | 一种浏览器换肤方法、装置、系统、设备和介质 | |
| CN116501408A (zh) | 用于管理资源加载过程的方法和计算机系统 | |
| CN117573107A (zh) | 前端页面生成方法和装置 | |
| CN111079050A (zh) | 页面信息获取方法、页面信息获取装置及计算机存储介质 |
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 | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |