CN110795195A - 一种网页渲染方法、装置、电子设备及存储介质 - Google Patents

一种网页渲染方法、装置、电子设备及存储介质 Download PDF

Info

Publication number
CN110795195A
CN110795195A CN201911052348.4A CN201911052348A CN110795195A CN 110795195 A CN110795195 A CN 110795195A CN 201911052348 A CN201911052348 A CN 201911052348A CN 110795195 A CN110795195 A CN 110795195A
Authority
CN
China
Prior art keywords
page
file
target webpage
terminal
distribution network
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
Application number
CN201911052348.4A
Other languages
English (en)
Other versions
CN110795195B (zh
Inventor
王宁
张研婷
韩珺方
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Beijing Baidu Netcom Science and Technology Co Ltd
Original Assignee
Beijing Baidu Netcom Science and Technology Co Ltd
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by Beijing Baidu Netcom Science and Technology Co Ltd filed Critical Beijing Baidu Netcom Science and Technology Co Ltd
Priority to CN201911052348.4A priority Critical patent/CN110795195B/zh
Publication of CN110795195A publication Critical patent/CN110795195A/zh
Priority to US16/875,575 priority patent/US11144711B2/en
Priority to JP2020087106A priority patent/JP6997253B2/ja
Priority to EP20175916.4A priority patent/EP3816823A1/en
Application granted granted Critical
Publication of CN110795195B publication Critical patent/CN110795195B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

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
    • 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
    • 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/451—Execution arrangements for user interfaces
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04L—TRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
    • H04L67/00—Network arrangements or protocols for supporting network services or applications
    • H04L67/01—Protocols
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04L—TRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
    • H04L67/00—Network arrangements or protocols for supporting network services or applications
    • H04L67/01—Protocols
    • H04L67/02—Protocols based on web technology, e.g. hypertext transfer protocol [HTTP]
    • H—ELECTRICITY
    • H04—ELECTRIC COMMUNICATION TECHNIQUE
    • H04L—TRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
    • H04L67/00—Network arrangements or protocols for supporting network services or applications
    • H04L67/01—Protocols
    • H04L67/10—Protocols in which an application is distributed across nodes in the network

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Signal Processing (AREA)
  • Computer Networks & Wireless Communication (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Software Systems (AREA)
  • Databases & Information Systems (AREA)
  • Computational Linguistics (AREA)
  • Artificial Intelligence (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Health & Medical Sciences (AREA)
  • General Health & Medical Sciences (AREA)
  • Data Mining & Analysis (AREA)
  • Human Computer Interaction (AREA)
  • Information Transfer Between Computers (AREA)
  • Document Processing Apparatus (AREA)

Abstract

本申请公开了网页渲染方法、装置、电子设备及存储介质，涉及网页渲染技术领域。具体实现方案为：接收来自终端的目标网页访问请求；响应于所述目标网页访问请求，将所述目标网页的页面配置文件发送至所述终端，其中，所述页面配置文件用于形成所述目标网页的预渲染页面，所述预渲染页面包括已经过渲染的部分或全部目标网页；所述预渲染页面用于使所述终端得到所述目标网页的渲染页面。通过上述方案，彻底解放了服务器，服务器在接收到访问请求后不再进行任何渲染工作。将渲染过程交给终端执行。由于页面配置文件可以用于形成目标网页的预渲染页面，终端获取到该配置文件以后就可直接生成预渲染页面，以及渲染页面，从而在整体上提高了效率。

Description

一种网页渲染方法、装置、电子设备及存储介质
技术领域
本申请涉及移动通信技术领域，尤其涉及网页渲染技术领域。
背景技术
网页应用(Web App)是与各种移动客户端、桌面客户端、服务器端深度整合的互联网空间应用，是一个庞大规模原生承载互联网链接万物景观精神的内容整合与分发持续开放的平台。伴随着移动通信技术的升级迭代，音视频等富媒体内容的流量池膨胀，使得用户在终端上对网页装载速度尤其敏感。
已有技术的实现方案大多是：服务器在接收到终端访问请求后，使用模版引擎生成网页应用的页面，进而响应该访问请求，将生成的页面发送给终端。此方案会造成服务器的压力增加，进而会导致终端设备获取网页应用的页面速度慢，已无法满足用户对于页面显示速度的期待和需求。
发明内容
本申请实施例提供一种网页渲染方法、装置、电子设备及存储介质，以至少解决现有技术中的以上技术问题。
第一方面，本申请实施例提供了一种网页渲染方法，应用于服务端，该方法包括：
接收来自终端的目标网页访问请求；
响应于目标网页访问请求，将目标网页的页面配置文件发送至终端，其中，
页面配置文件用于形成目标网页的预渲染页面，预渲染页面包括已经过渲染的部分或全部目标网页；
预渲染页面用于使终端得到目标网页的渲染页面。
通过上述方案，彻底解放了服务器，服务器在接收到访问请求后不再进行任何渲染工作。而是将渲染过程交给终端执行。由于页面配置文件可以用于形成目标网页的预渲染页面，终端获取到该配置文件以后就可直接生成预渲染页面以及渲染页面，从而在整体上提高了效率。
在一种实施方式中，页面配置文件存储于内容分发网络；
将目标网页的页面配置文件发送至终端，包括：
将目标网页的页面配置文件从内容分发网络发送至终端。
通过上述方案，利用内容分发网络可以改善终端获取页面配置文件的速度。
在一种实施方式中，页面配置文件包括超文本标记语言文件、层叠样式表文件和脚本语言文件；
超文本标记语言文件存储于第一内容分发网络；
层叠样式表文件和脚本语言文件存储于第二内容分发网络；
其中，第一内容分发网络的地址与目标网页的地址相同，超文本标记语言文件中包括第二内容分发网络的地址。
通过上述方案，避免将所有文件存储在第一内容分发网络上，造成该内容分发网络的存储压力以及访问压力。利用不同内容分发网络实现文件均衡，从而可以提高整体效率。
在一种实施方式中，将目标网页的页面配置文件从内容分发网络发送至终端，包括：
根据终端的地理位置，将超文本标记语言文件从第一内容分发网络发送至终端；
接收终端发送的文件获取请求；
响应于文件获取请求，将层叠样式表文件和脚本语言文件从第二内容分发网络发送至终端。
通过上述方案，利用内容分发网络的特性，可以使终端从距离其所在位置较近的节点获取到超文本标记语言文件。终端可以根据超文本标记语言文件中的地址获取到层叠样式表文件和脚本语言文件。在整体上提高终端获取目标网页的页面配置文件的速度。
在一种实施方式中，在预渲染页面为部分目标网页的情况下，该方法还包括：
在目标网页的剩余部分填充骨架页面。
通过上述方案，可以预先采用骨架页面的对目标网页的剩余位置进行占位。使得终端率先展示预渲染页面和骨架页面，避免白屏或者长时间的渲染过程，从而提升用户的体验。
在一种实施方式中，脚本语言文件中包括用户个性化数据的存储地址；
该方法还包括：
获取终端的用户标识信息；
将与用户标识信息相匹配的用户个性化数据从用户个性化数据的存储地址发送至终端；
其中，用户个性化数据用于在终端形成目标网页的渲染页面过程中，填充骨架页面。
通过上述方案，在获取到用户个性化数据的情况下，可以利用用户个性化数据填充骨架页面，形成目标网页的最终页面。对于终端来说，可以第一时间获取到目标页面，减少白屏或者渲染所等待的时间。
第二方面，本申请实施例提供了一种网页渲染方法，应用于终端，该方法包括：
向服务器发送目标网页的访问请求；
接收服务器发送的目标网页的页面配置文件；
根据页面配置文件形成目标网页的预渲染页面，预渲染页面包括已经过渲染的部分或全部目标网页；
根据预渲染页面得到目标网页的渲染页面。
在一种实施方式中，页面配置文件存储于内容分发网络；
接收服务器发送的目标网页的页面配置文件，包括：
从内容分发网络接收服务器发送的目标网页的页面配置文件。
在一种实施方式中，页面配置文件包括超文本标记语言文件、层叠样式表文件和脚本语言文件；
超文本标记语言文件存储于第一内容分发网络；
层叠样式表文件和脚本语言文件存储于第二内容分发网络；
其中，第一内容分发网络的地址与目标网页的地址相同，超文本标记语言文件中包括第二内容分发网络的地址。
在一种实施方式中，从内容分发网络接收服务器发送的目标网页的页面配置文件，包括：
接收第一内容分发网络发送的超文本标记语言文件；
向第二内容分发网络的地址发出文件获取请求；
接收第二内容分发网络发送的层叠样式表文件。
在一种实施方式中，根据页面配置文件形成目标网页的预渲染页面，包括：
根据超文本标记语言文件和层叠样式表文件形成目标网页的预渲染页面。
在一种实施方式中，在预渲染页面包括已经过渲染的部分目标网页的情况下，目标网页的剩余部分填充有骨架页面；
根据预渲染页面得到目标网页的渲染页面，包括：
接收第二内容分发网络发送的脚本语言文件，脚本语言文件中包括用户个性化数据的存储地址；
将用户标识信息发送至用户个性化数据的存储地址；
接收服务器发送的用户个性化数据；
利用用户个性化数据填充骨架页面。
第三方面，本申请实施例提供了一种网页渲染装置，应用于服务端，该装置包括：
访问请求接收模块，用于接收来自终端的目标网页访问请求；
页面配置文件发送模块，用于响应于目标网页访问请求，将目标网页的页面配置文件发送至终端，其中，
页面配置文件用于形成目标网页的预渲染页面，预渲染页面包括已经过渲染的部分或全部目标网页；
预渲染页面用于使终端形成目标网页的渲染页面。
在一种实施方式中，页面配置文件包括超文本标记语言文件、层叠样式表文件和脚本语言文件；
该装置还包括：
第一存储模块，用于将超文本标记语言文件存储于第一内容分发网络；
第二存储模块，用于将层叠样式表文件和脚本语言文件存储于第二内容分发网络；
其中，第一内容分发网络的地址与目标网页的地址相同，超文本标记语言文件中包括第二内容分发网络的地址。
在一种实施方式中，页面配置文件发送模块包括：
第一发送子模块，用于根据终端的地理位置，将超文本标记语言文件从第一内容分发网络发送至终端；
第一接收子模块，用于接收终端发送的文件获取请求；
第二发送子模块，用于响应于文件获取请求，将层叠样式表文件和脚本语言文件从第二内容分发网络发送至终端。
在一种实施方式中，在预渲染页面为部分目标网页的情况下，装置还包括：
填充模块，用于在目标网页的剩余部分填充骨架页面。
在一种实施方式中，脚本语言文件中包括用户个性化数据的存储地址；
该装置还包括：
用户标识信息获取模块，用于获取终端的用户标识信息；
个性化数据发送模块，用于将与用户标识信息相匹配的用户个性化数据从用户个性化数据的存储地址发送至终端；
其中，用户个性化数据用于在终端形成目标网页的渲染页面过程中，填充骨架页面。
第四方面，本申请实施例提供了一种网页渲染装置，应用于终端，该装置包括：
访问请求发送模块，用于向服务器发送目标网页的访问请求；
页面配置文件接收模块，用于接收服务器发送的目标网页的页面配置文件；
第一渲染模块，用于根据页面配置文件形成目标网页的预渲染页面，预渲染页面包括已经过渲染的部分或全部目标网页；
第二渲染模块，用于根据预渲染页面得到目标网页的渲染页面。
在一种实施方式中，页面配置文件包括超文本标记语言文件、层叠样式表文件和脚本语言文件；
超文本标记语言文件存储于第一内容分发网络；
层叠样式表文件和脚本语言文件存储于第二内容分发网络；
其中，第一内容分发网络的地址与目标网页的地址相同，超文本标记语言文件中包括第二内容分发网络的地址。
在一种实施方式中，页面配置文件接收模块，包括：
第二接收子模块，用于接收超文本标记语言文件；
第三发送子模块，用于向第二内容分发网络的地址发出文件获取请求；
第三接收子模块，用于接收第二内容分发网络发送的层叠样式表文件。
在一种实施方式中，第一渲染模块包括：
渲染执行子模块，用于根据超文本标记语言文件和层叠样式表文件形成目标网页的预渲染页面。
在一种实施方式中，在预渲染页面包括已经过渲染的部分目标网页的情况下，目标网页的剩余部分填充有骨架页面；
第二渲染模块，包括：
脚本语言文件接收子模块，用于接收第二内容分发网络发送的脚本语言文件，脚本语言文件中包括用户个性化数据的存储地址；
用户标识信息发送子模块，用于将用户标识信息发送至用户个性化数据的存储地址；
用户个性化数据接收子模块，用于接收服务器发送的用户个性化数据；
骨架页面填充子模块，用于利用用户个性化数据填充骨架页面。
第五方面，本申请实施例提出一种电子设备，包括：
至少一个处理器；以及
与至少一个处理器通信连接的存储器；其中，
存储器存储有可被至少一个处理器执行的指令，指令被至少一个处理器执行，以使至少一个处理器能够执行网页渲染的任一方法。
第六方面，本申请实施例提出一种存储有计算机指令的非瞬时计算机可读存储介质，计算机指令用于使计算机执行网页渲染的任一方法。
上述可选方式所具有的其他效果将在下文中结合具体实施例加以说明。
附图说明
附图用于更好地理解本方案，不构成对本申请的限定。其中：
图1是根据本申请页面渲染方法第一实施例的示意图；
图2是目标网页的预渲染页面的示意图；
图3是根据本申请页面渲染方法第一实施例的示意图；
图4是根据本申请页面渲染方法第一实施例的示意图；
图5是目标网页的最终渲染页面的示意图；
图6是根据本申请页面渲染方法第二实施例的示意图；
图7是根据本申请页面渲染方法第二实施例的示意图；
图8是根据本申请页面渲染方法第二实施例的示意图；
图9是根据本申请页面渲染装置第一实施例的示意图；
图10是根据本申请页面渲染装置第一实施例的示意图；
图11是根据本申请页面渲染装置第一实施例的示意图；
图12是根据本申请页面渲染装置第一实施例的示意图；
图13是根据本申请页面渲染装置第二实施例的示意图；
图14是根据本申请页面渲染装置第二实施例的示意图；
图15是根据本申请页面渲染装置第二实施例的示意图；
图16是用来实现本申请实施例的页面渲染方法的电子设备的框图；
图17是可以实现本申请实施例的页面渲染方法的场景图。
具体实施方式
以下结合附图对本申请的示范性实施例做出说明，其中包括本申请实施例的各种细节以助于理解，应当将它们认为仅仅是示范性的。因此，本领域普通技术人员应当认识到，可以对这里描述的实施例做出各种改变和修改，而不会背离本申请的范围和精神。同样，为了清楚和简明，以下的描述中省略了对公知功能和结构的描述。
图1所示为本申请网页渲染方法的流程图，如图1所示，在应用于服务端的情况下，该方法包括以下步骤：
S101：接收来自终端的目标网页访问请求。
S102：响应于目标网页访问请求，将目标网页的页面配置文件发送至终端，其中，
页面配置文件用于形成目标网页的预渲染页面，预渲染页面包括已经过渲染的部分或全部目标网页；
预渲染页面用于使终端得到目标网页的渲染页面。
服务器接收到终端发送的目标网页的访问请求，可以查询到目标网页的页面配置文件。该目标网页的页面配置文件可以是预先生成的。例如，开发者可以在目标网页的开发阶段，采用本地模式的持续集成环境运行预先编写好的超文本标记语言(Html)格式的配置文件。
持续集成环境可以是代码合并、构建、部署、测试等过程都在一起，不断重复循环上述过程，并对各过程所对应的结果进行反馈的开发环境。本地模式的持续集成环境可以是通过终端的浏览器或者应用程序(APP)执行。终端可以包括个人电脑、智能手机等设备。
预先编写好的超文本标记语言格式的配置文件可以利用REACT框架、VUE框架等不同框架进行开发。以REACT框架为例，该框架的核心思想是封装组件。当组件的状态变更，自动重新渲染。组件可以包括结构组件、布局组件、脚本组件等。
其中，结构组件可以定义出目标网页的菜单、按钮、图片、文字等元素。
布局组件可以定义出前述菜单、按钮、图片、文字等元素的位置和大小等。
脚本组件可以定义出前述菜单、按钮、图片、文字等元素的状态变化，例如在用户点击时，菜单弹出下拉选项等。
另外，在脚本组件中还可以定义网络地址，以使终端获取到脚本组件并执行时，向定义的网络地址发出访问请求。
服务器根据终端浏览器或应用程序的用户代理(UA，User Agent)识别出本地模式的持续集成环境。利用预渲染程序运行预先编写好的超文本标记语言格式的配置文件，得到目标网页的页面配置文件。该页面配置文件用于形成目标网页的预渲染页面，预渲染页面包括已经过渲染的部分或全部目标网页。预渲染页面用于使终端得到目标网页的渲染页面。
如图2所示为可以利用页面配置文件形成的目标网页的预渲染页面的示意图。其中的“拍视频得现金”、“全民小课堂”、“亿万奖金，全网最高！”、“加V认证，十倍收益！”、“邀友拍摄，获得提成”等文字框对应的显示区域，以及“PLAY”、“去拍摄”、“去认证”、“去邀请”等虚拟交互按键对应的显示区域，均可以对应为预渲染页面。
由于本地模式的持续集成环境可能存在多个开发者对于运行预先编写好的超文本标记语言格式的配置文件进行修改、调整。因此，可以采用模块加载打包器(Webpack)对预先编写好的超文本标记语言格式的配置文件进行打包。从而使其他开发者可以获取到该配置文件的全部内容。打包以后，该打包的入口可以通过模块加载打包器的展示插件(Library Target)进行展示，从而可以使其他开发者根据展示出的入口获取该预先编写好的超文本标记语言格式的配置文件。
由于已经在终端访问前得到了目标网页的页面配置文件，在接收到来自终端的目标网页访问请求时，服务器可以根据终端浏览器或应用程序的用户代理识别出该访问请求，将页面配置文件发送给终端。
终端在接收到配置文件以后，可以第一时间显示例如图2所示的预渲染页面。相比于现有技术的服务器每次接收到终端的访问请求都需要进行渲染相比，采用上述方案可以减轻服务器的压力。同时可以加速终端显示目标网页的页面。
另外，由于目标网页的页面配置文件是预先生成的，因此服务器无需在每次接到访问请求时均进行预渲染，只需将目标网页的页面配置文件发送给终端即可。从而实现了目标网页的页面配置文件的复用。
在一种实施方式中，页面配置文件存储于内容分发网络；
将目标网页的页面配置文件发送至终端，包括：
将目标网页的页面配置文件从内容分发网络发送至终端。
通过上述方式，利用内容分发网络可以改善终端获取页面配置文件的速度。
在一种实施方式中，页面配置文件包括超文本标记语言文件、层叠样式表文件和脚本语言文件；
超文本标记语言文件存储于第一内容分发网络；
层叠样式表文件和脚本语言文件存储于第二内容分发网络；
其中，第一内容分发网络的地址与目标网页的地址相同，超文本标记语言文件中包括第二内容分发网络的地址。
可以采用模块加载打包器运行预先编写好的超文本标记语言格式的配置文件，该模块加载打包器中包括预渲染插件，利用该插件可以得到目标网页的页面配置文件，并可以将该配置文件拆分为超文本标记语言(Html)文件、层叠样式表(CSS)文件和脚本语言(JS)文件。示例性的，预渲染插件可以采用prerender-spa-plugin插件。
服务器将通过拆分得到的超文本标记语言文件存储于第一内容分发网络(CND，Content Delivery Network)。第一内容分发网络的地址可以与目标网页的地址相同。
另外，服务器将层叠样式表文件和脚本语言文件存储于第二内容分发网络。第二内容分发网络的地址可以与目标网页的地址相同，也可以不同。
在通过拆分得到的超文本标记语言文件中包括有预先声明的第二内容分发网络的地址。因此，终端获取到超文本标记语言文件，即可根据声明的第二内容分发网络的地址向该地址发出文件获取请求，以获取到层叠样式表文件和脚本语言文件。具体获取过程后文详述。
通过上述步骤，利用内容分发网络的特性，可以使终端从距离其所在位置较近的节点获取到相关页面配置文件，从而提高了页面配置文件的获取速度。
此外，将页面配置文件分开存储，有助于减轻第一内容分发网络的存储压力。由于第一内容分发网络与目标网页的地址相同，如果将页面配置文件的所有子集均存储在第一内容分发网络，会导致其存储压力增加。
另一方面，由于终端获取超文本标记语言文件、层叠样式表文件和脚本语言文件存在先后顺序，将上述文件分开存储，可以减轻第一内容分发网络的通信压力。
如图3所示，在一种实施方式中，将目标网页的页面配置文件从内容分发网络发送至终端，包括：
S1021：根据终端的地理位置，将超文本标记语言文件从第一内容分发网络发送至终端。
S1022：接收终端发送的文件获取请求。
S1023：响应于文件获取请求，将层叠样式表文件和脚本语言文件从第二内容分发网络发送至终端。
服务器根据终端的地理位置，在第一内容分发网络的多个节点中确定与该地理位置距离较近的节点。自该节点下发给终端超文本标记语言文件。利用第一内容分发网络，可以使终端在最短时间获取到页面配置文件中的目标网页的超文本标记语言文件，从而进行显示。对于终端的地理位置的获取，可以通过查询终端所使用的通信运营商实现。
或者，服务器还可以结合终端的地理位置和各节点的负荷确定节点。例如，终端的位置相距第二节点的距离大于相距第一节点的距离，但第一节点在终端访问时的负荷远大于第二节点，则服务器可以通过第二节点向终端下发超文本标记语言文件。
第一内容分发网络可以设置在服务器，也可以设置于不同的终端。例如，当两个用户在近距离(例如同一房间或面对面等)使用不同终端访问相同的目标网页的情况下，在第一用户所使用的终端率先获取到目标网页的超文本标记语言文件的情况下，即可作为第一内容分发网络。在第二用户访问该目标网页的情况下，第二用户可以从第一用户所使用的终端获取到目标网页的超文本标记语言文件。从而可以进一步提高访问目标网页的速度。
终端接收到目标网页的超文本标记语言文件，向目标网页的超文本标记语言文件中的第二内容分发网络的地址发送文件获取请求。
服务器接收到文件获取请求的情况下，可以将层叠样式表文件和脚本语言文件发送给终端。
终端根据目标网页的超文本标记语言文件和层叠样式表文件，即可得到目标网页的预渲染页面。即对应图2所示的示意图。
通过上述方案，可以使终端在最短时间获取到超文本标记语言文件，从而根据超文本标记语言文件中的地址获取到层叠样式表文件和脚本语言文件。在整体上提高终端获取目标网页的页面配置文件的速度。
在一种实施方式中，在预渲染页面为部分目标网页的情况下，该方法还包括：
在目标网页的剩余部分填充骨架页面。
结合图2所示的示意图，图2中包括第一显示区域和第二显示区域。
第一显示区域可以包括预渲染页面，预渲染页面在所有终端上显示的相同的内容。例如，第一显示区域包括“拍视频得现金”、“全民小课堂”、“亿万奖金，全网最高！”、“加V认证，十倍收益！”、“邀友拍摄，获得提成”等文字框对应的显示区域，以及“PLAY”、“去拍摄”、“去认证”、“去邀请”等虚拟交互按键对应的显示区域。
第二显示区域可以用于显示不同的内容，例如使用终端的用户的个性化数据等。用户个性化数据可以是用户的头像、在线时长、经验值等。在获取到不同的内容前，第二显示区域可以预先采用目标网页的骨架页面进行填充。骨架页面可以包括图2所示的表示正在加载(Loading)的动态(或静态)图标，也可以是灰色矩形块或圆形块等。
上述填充的过程已在前述预先编写好的超文本标记语言格式的配置文件中声明。
通过上述方案，在目标页面中存在待填充的用户个性化数据的情况下，可以预先采用骨架页面的方式进行占位。使得终端在得到预渲染页面后，在待填充用户个性化数据的部分预先展示骨架页面，从而提升用户的体验。
在一种实施方式中，脚本语言文件中包括用户个性化数据的存储地址。
如图4所示，该方法还包括以下步骤：
S401：获取终端的用户标识信息。
S402：将与用户标识信息相匹配的用户个性化数据从用户个性化数据的存储地址发送至终端；其中，用户个性化数据用于在终端形成目标网页的渲染页面过程中，填充骨架页面。
在终端获取到脚本语言文件的情况下，通过执行该脚本语言文件，可以将用户标识信息(Cookie)发送至用户个性化数据的存储地址。
服务器获取到用户标识信息，可以在用户个性化数据的存储地址所对应的存储区域中查询出与该用户标识信息所匹配的用户个性化数据。将查询出的用户个性化数据发送给终端，以使得终端可以在形成目标网页的渲染页面过程中，利用用户个性化数据填充骨架页面。
结合图5所示，图5中的“排名”、“创作者”、“视频数”、和“收入(元)”所对应的数据即为用户个性化数据。在获取到上述用户个性化数据以后，填充至骨架页面，即可形成目标网页的最终页面。
通过上述方案，在获取到用户个性化数据的情况下，可以将用户个性化数据填充到骨架页面，形成目标网页的最终页面。对于终端来说，可以第一时间获取到目标页面，减少白屏或者等待时间。
如图6所示为本申请网页渲染方法的流程图，在应用于终端的情况下，该方法包括以下步骤：
S601：向服务器发送目标网页的访问请求。
S602：接收服务器发送的目标网页的页面配置文件。
S603：根据页面配置文件形成目标网页的预渲染页面，预渲染页面包括已经过渲染的部分或全部目标网页。
S604：根据预渲染页面得到目标网页的渲染页面。
终端通过浏览器或者应用程序向服务器发送目标网页的访问请求。接收到服务器发送的目标网页的页面配置文件，执行该页面配置文件，从而可以形成目标网页的预渲染页面。
预渲染页面包括已经过渲染的部分或全部目标网页，在预渲染页面包括已经过渲染全部目标网页的情况下，该预渲染页面可以作为目标网页的渲染页面。在预渲染页面包括已经过渲染的部分目标网页的情况下，终端根据该预渲染页面进一步进行渲染处理，得到目标网页的渲染页面。
在一种实施方式中，页面配置文件存储于内容分发网络；
步骤S602，包括：
从内容分发网络接收服务器发送的目标网页的页面配置文件。
在一种实施方式中，页面配置文件包括超文本标记语言文件、层叠样式表文件和脚本语言文件；
超文本标记语言文件存储于第一内容分发网络；
层叠样式表文件和脚本语言文件存储于第二内容分发网络；
其中，第一内容分发网络的地址与目标网页的地址相同，超文本标记语言文件中包括第二内容分发网络的地址。
如图7所示，在一种实施方式中，从内容分发网络接收服务器发送的目标网页的页面配置文件包括：
S6021：接收第一内容分发网络发送的超文本标记语言文件。
S6022：向第二内容分发网络的地址发出文件获取请求。
S6023：接收第二内容分发网络发送的层叠样式表文件。
终端首先接收到服务器从第一内容分发网络发送的超文本标记语言文件。根据超文本标记语言文件中声明的第二内容分发网络的地址，向该地址发送文件获取请求。
服务器接收到文件获取请求的情况下，可以将层叠样式表文件从第二内容分发网络发送给终端。使得终端接收第二内容分发网络发送的层叠样式表文件
在一种实施方式中，步骤S603包括：根据超文本标记语言文件和层叠样式表文件形成目标网页的预渲染页面。
终端根据超文本标记语言文件和层叠样式表文件，即可得到目标网页的预渲染页面。即对应图2所示的示意图。
在一种实施方式中，在预渲染页面包括已经过渲染的部分目标网页的情况下，目标网页的剩余部分填充有骨架页面；
如图8所示，步骤S604包括：
S6041：接收第二内容分发网络发送的脚本语言文件，脚本语言文件中包括用户个性化数据的存储地址。
S6042：将用户标识信息发送至用户个性化数据的存储地址。
S6043：接收服务器发送的用户个性化数据。
S6044：利用用户个性化数据填充骨架页面。
在终端获取到脚本语言文件的情况下，通过执行该脚本语言文件，可以将用户标识信息发送至用户个性化数据的存储地址。
服务器获取到用户标识信息后，可以在用户个性化数据的存储地址所对应的存储区域中查询出与该用户标识信息匹配的用户个性化数据。用户个性化数据可以是用户的头像、在线时长、经验值等。将查询出的用户个性化数据发送给终端。
终端在获取到上述用户个性化数据以后，填充至骨架页面，即可形成目标网页的最终页面。
如图9所示为本申请网页渲染装置的结构示意图，在应用于终端的情况下，该装置包括：
访问请求接收模块901，用于接收来自终端的目标网页访问请求；
页面配置文件发送模块902，用于响应于目标网页访问请求，将目标网页的页面配置文件发送至终端，其中，
页面配置文件用于形成目标网页的预渲染页面，预渲染页面包括已经过渲染的部分或全部目标网页；
预渲染页面用于使终端形成目标网页的渲染页面。
在一种实施方式中，页面配置文件存储于内容分发网络；
页面配置文件发送模块902将目标网页的页面配置文件从内容分发网络发送至所述终端。
在一种实施方式中，页面配置文件包括超文本标记语言文件、层叠样式表文件和脚本语言文件；
如图10所示，该装置还包括：
第一存储模块1001，用于将超文本标记语言文件存储于第一内容分发网络；
第二存储模块1002，用于将层叠样式表文件和脚本语言文件存储于第二内容分发网络；
其中，第一内容分发网络的地址与目标网页的地址相同，超文本标记语言文件中包括第二内容分发网络的地址。
如图11所示，在一种实施方式中，
页面配置文件发送模块902包括：
第一发送子模块9021，用于根据终端的地理位置，将超文本标记语言文件从第一内容分发网络发送至终端；
第一接收子模块9022，用于接收终端发送的文件获取请求；
第二发送子模块9023，用于响应于文件获取请求，将层叠样式表文件和脚本语言文件从第二内容分发网络发送至终端。
在一种实施方式中，在预渲染页面为部分目标网页的情况下，该装置还包括：
填充模块，用于在目标网页的剩余部分填充骨架页面。
在一种实施方式中，脚本语言文件中包括用户个性化数据的存储地址；
如图12所示，该装置还包括：
用户标识信息获取模块1201，用于获取终端的用户标识信息；
个性化数据发送模块1202，用于将与用户标识信息相匹配的用户个性化数据从用户个性化数据的存储地址发送至终端；
其中，用户个性化数据用于在终端形成目标网页的渲染页面过程中，填充骨架页面。
如图13所示为本申请网页渲染装置的结构示意图，在应用于终端的情况下，该装置包括：
访问请求发送模块1301，用于向服务器发送目标网页的访问请求。
页面配置文件接收模块1302，用于接收服务器发送的目标网页的页面配置文件。
第一渲染模块1303，用于根据页面配置文件形成目标网页的预渲染页面，预渲染页面包括已经过渲染的部分或全部目标网页。
第二渲染模块1304，用于根据预渲染页面得到目标网页的渲染页面。
在一种实施方式中，页面配置文件存储于内容分发网络；
页面配置文件接收模块1302从内容分发网络接收服务器发送的目标网页的页面配置文件。
在一种实施方式中，页面配置文件包括超文本标记语言文件、层叠样式表文件和脚本语言文件；
超文本标记语言文件存储于第一内容分发网络；
层叠样式表文件和脚本语言文件存储于第二内容分发网络；
其中，第一内容分发网络的地址与目标网页的地址相同，超文本标记语言文件中包括第二内容分发网络的地址。
如图14所示，在一种实施方式中，页面配置文件接收模块1302包括：
第二接收子模块13021，用于接收第一内容分发网络发送的超文本标记语言文件；
第三发送子模块13022，用于向第二内容分发网络的地址发出文件获取请求；
第三接收子模块13023，用于接收第二内容分发网络发送的层叠样式表文件。
在一种实施方式中，第一渲染模块1303，包括：
渲染执行子模块，用于根据超文本标记语言文件和层叠样式表文件形成目标网页的预渲染页面。
在一种实施方式中，在预渲染页面包括已经过渲染的部分目标网页的情况下，目标网页的剩余部分填充有骨架页面；
如图15所示，第二渲染模块1304包括：
脚本语言文件接收子模块13041，用于接收第二内容分发网络发送的脚本语言文件，脚本语言文件中包括用户个性化数据的存储地址；
用户标识信息发送子模块13042，用于将用户标识信息发送至用户个性化数据的存储地址；
用户个性化数据接收子模块13043，用于接收服务器发送的用户个性化数据；
骨架页面填充子模块13044，用于利用用户个性化数据填充骨架页面。
本申请实施例各装置中的各模块的功能可以参见上述方法中的对应描述，在此不再赘述。
根据本申请的实施例，本申请还提供了一种电子设备和一种可读存储介质。
如图16所示，是根据本申请实施例的网页渲染方法的电子设备的框图。电子设备旨在表示各种形式的数字计算机，诸如，膝上型计算机、台式计算机、工作台、个人数字助理、服务器、刀片式服务器、大型计算机、和其它适合的计算机。电子设备还可以表示各种形式的移动装置，诸如，个人数字处理、蜂窝电话、智能电话、可穿戴设备和其它类似的计算装置。本文所示的部件、它们的连接和关系、以及它们的功能仅仅作为示例，并且不意在限制本文中描述的和/或者要求的本申请的实现。
如图16所示，该电子设备包括：一个或多个处理器1610、存储器1620，以及用于连接各部件的接口，包括高速接口和低速接口。各个部件利用不同的总线互相连接，并且可以被安装在公共主板上或者根据需要以其它方式安装。处理器可以对在电子设备内执行的指令进行处理，包括存储在存储器中或者存储器上以在外部输入/输出装置(诸如，耦合至接口的显示设备)上显示图形用户界面(Graphical User Interface，GUI)的图形信息的指令。在其它实施方式中，若需要，可以将多个处理器和/或多条总线与多个存储器和多个存储器一起使用。同样，可以连接多个电子设备，各个设备提供部分必要的操作(例如，作为服务器阵列、一组刀片式服务器、或者多处理器系统)。图16中以一个处理器1610为例。
存储器1620即为本申请所提供的非瞬时计算机可读存储介质。其中，所述存储器存储有可由至少一个处理器执行的指令，以使所述至少一个处理器执行本申请所提供的网页渲染方法。本申请的非瞬时计算机可读存储介质存储计算机指令，该计算机指令用于使计算机执行本申请所提供的网页渲染方法。
存储器1620作为一种非瞬时计算机可读存储介质，可用于存储非瞬时软件程序、非瞬时计算机可执行程序以及模块，如本申请实施例中的网页渲染方法对应的程序指令/模块(例如，附图9所示的访问请求接收模块901和页面配置文件发送模块902，和/或图13所示的访问请求发送模块1301、页面配置文件接收模块1302、第一渲染模块1303和第二渲染模块1304)。处理器1610通过运行存储在存储器1620中的非瞬时软件程序、指令以及模块，从而执行服务器的各种功能应用以及数据处理，即实现上述方法实施例中的网页渲染方法。
存储器1620可以包括存储程序区和存储数据区，其中，存储程序区可存储操作系统、至少一个功能所需要的应用程序；存储数据区可存储根据网页渲染的电子设备的使用所创建的数据等。此外，存储器1620可以包括高速随机存取存储器，还可以包括非瞬时存储器，例如至少一个磁盘存储器件、闪存器件、或其他非瞬时固态存储器件。在一些实施例中，存储器1620可选包括相对于处理器1610远程设置的存储器，这些远程存储器可以通过网络连接至网页渲染的电子设备。上述网络的实例包括但不限于互联网、企业内部网、局域网、移动通信网及其组合。
网页渲染方法的电子设备还可以包括：输入装置1630和输出装置1640。处理器1610、存储器1620、输入装置1630和输出装置1640可以通过总线或者其他方式连接，图16中以通过总线连接为例。
输入装置1630可接收输入的数字或字符信息，以及产生与网页渲染的电子设备的用户设置以及功能控制有关的键信号输入，例如触摸屏、小键盘、鼠标、轨迹板、触摸板、指示杆、一个或者多个鼠标按钮、轨迹球、操纵杆等输入装置。输出装置1640可以包括显示设备、辅助照明装置(例如，LED)和触觉反馈装置(例如，振动电机)等。该显示设备可以包括但不限于，液晶显示器(Liquid Crystal Display，LCD)、发光二极管(Light EmittingDiode，LED)显示器和等离子体显示器。在一些实施方式中，显示设备可以是触摸屏。
此处描述的系统和技术的各种实施方式可以在数字电子电路系统、集成电路系统、专用集成电路(Application Specific Integrated Circuits，ASIC)、计算机硬件、固件、软件、和/或它们的组合中实现。这些各种实施方式可以包括：实施在一个或者多个计算机程序中，该一个或者多个计算机程序可在包括至少一个可编程处理器的可编程系统上执行和/或解释，该可编程处理器可以是专用或者通用可编程处理器，可以从存储系统、至少一个输入装置、和至少一个输出装置接收数据和指令，并且将数据和指令传输至该存储系统、该至少一个输入装置、和该至少一个输出装置。
这些计算程序(也称作程序、软件、软件应用、或者代码)包括可编程处理器的机器指令，并且可以利用高级过程和/或面向对象的编程语言、和/或汇编/机器语言来实施这些计算程序。如本文使用的，术语“机器可读介质”和“计算机可读介质”指的是用于将机器指令和/或数据提供给可编程处理器的任何计算机程序产品、设备、和/或装置(例如，磁盘、光盘、存储器、可编程逻辑装置(programmable logic device，PLD))，包括，接收作为机器可读信号的机器指令的机器可读介质。术语“机器可读信号”指的是用于将机器指令和/或数据提供给可编程处理器的任何信号。
为了提供与用户的交互，可以在计算机上实施此处描述的系统和技术，该计算机具有：用于向用户显示信息的显示装置(例如，CRT(Cathode Ray Tube，阴极射线管)或者LCD(液晶显示器)监视器)；以及键盘和指向装置(例如，鼠标或者轨迹球)，用户可以通过该键盘和该指向装置来将输入提供给计算机。其它种类的装置还可以用于提供与用户的交互；例如，提供给用户的反馈可以是任何形式的传感反馈(例如，视觉反馈、听觉反馈、或者触觉反馈)；并且可以用任何形式(包括声输入、语音输入或者、触觉输入)来接收来自用户的输入。
可以将此处描述的系统和技术实施在包括后台部件的计算系统(例如，作为数据服务器)、或者包括中间件部件的计算系统(例如，应用服务器)、或者包括前端部件的计算系统(例如，具有图形用户界面或者网络浏览器的用户计算机，用户可以通过该图形用户界面或者该网络浏览器来与此处描述的系统和技术的实施方式交互)、或者包括这种后台部件、中间件部件、或者前端部件的任何组合的计算系统中。可以通过任何形式或者介质的数字数据通信(例如，通信网络)来将系统的部件相互连接。通信网络的示例包括：局域网(Local Area Network，LAN)、广域网(Wide Area Network，WAN)和互联网。
计算机系统可以包括客户端和服务器。客户端和服务器一般远离彼此并且通常通过通信网络进行交互。通过在相应的计算机上运行并且彼此具有客户端-服务器关系的计算机程序来产生客户端和服务器的关系。
如图17所示为网页渲染方法的场景图。
服务器运行预先编写好的超文本标记语言格式的配置文件，将该配置文件拆分为页面html文件，页面样式文件和脚本文件。上述各文件可以分别对应前述实施例当中的超文本标记语言(Html)文件、层叠样式表(CSS)文件和脚本语言(JS)文件。
服务器将上述文件存储至持续交付平台。其中，页面html文件被存储至源站页面文件存储所对应的存储区域。页面样式文件和脚本文件被存储至源站静态资源存储所对应的存储区域。
进一步的，页面html文件由源站页面文件存储所对应的存储区域存储至页面内容分发网络。页面内容分发网络可以对应为前述实施例当中的第一内容分发网络。该第一内容分发网络的地址可以为“/m/a.html”。
页面样式文件和脚本文件由源站静态资源存储所对应的存储区域存储至静态资源内容分发网络。静态资源内容分发网络可以对应为前述实施例当中的第二内容分发网络。
在终端利用浏览器访问目标网页时，输入“/m/a.html”。服务器根据终端的地理位置，选择从节点E将页面html文件从第一内容分发网络发送至终端。
在上述过程中，若服务器检测到节点E中并未存储页面html文件，则需要回源至源站页面文件存储所对应的存储区域，将该页面html文件发生制节点E。并且将页面html文件缓存在节点E中，从而后续过程中，(其他)终端再次访问该目标网页的情况下，服务器可以从节点E中发送该页面html文件。
终端获取到页面html文件，根据页面html文件中声明的静态资源内容分发网络的地址，向该地址发送文件获取请求。
服务器接收到该文件获取请求，将页面样式文件和脚本文件从静态资源内容分发网络发送至终端。
同理，服务器也会根据终端的地理位置，在静态资源内容分发网络中选择对应的节点，从而由选择出的节点向终端发送页面样式文件和脚本文件。
终端获取到页面html文件和页面样式文件，即可形成预渲染中态页面结果。在预渲染中态页面结果为已经过渲染的部分目标网页的情况下，目标网页的剩余部分填充有骨架页面，利用骨架页面进行占位。预渲染中态页面结果对应中间态页面，该中间态页面可以是已经过渲染的部分目标网页的页面和骨架页面的组合页面。该组合页面即对应图2所示的页面示意图。
终端在获取到脚本文件后，执行该脚本文件。向脚本文件中声明的数据内容分发网络的地址发送用户标识信息。数据内容分发网络的地址即对应前述实施例中的用户个性化数据的存储地址。服务器将与用户标识信息相匹配的用户个性化数据从数据内容分发网络的地址发送至终端。
终端接收服务器发送的用户个性化数据，利用用户个性化数据填充骨架页面，即进行填充占位，从而形成终态页面。该终态页面即对应图5所示的页面示意图。
根据本申请实施例的技术方案，解决了服务器在每次收到目标网页的访问请求都需要进行渲染而造成服务器压力大，终端获取页面速度慢的问题。彻底解放了服务器，服务器在接收到访问请求后不再进行任何渲染工作。而是将渲染过程交给终端执行。由于页面配置文件可以用于形成目标网页的预渲染页面，终端获取到该配置文件以后就可直接生成预渲染页面，以及渲染页面，从而在整体上提高了效率。
应该理解，可以使用上面所示的各种形式的流程，重新排序、增加或删除步骤。例如，本申请中记载的各步骤可以并行地执行也可以顺序地执行也可以不同的次序执行，只要能够实现本申请公开的技术方案所期望的结果，本文在此不进行限制。
上述具体实施方式，并不构成对本申请保护范围的限制。本领域技术人员应该明白的是，根据设计要求和其他因素，可以进行各种修改、组合、子组合和替代。任何在本申请的精神和原则之内所作的修改、等同替换和改进等，均应包含在本申请保护范围之内。

Claims (25)

1.一种网页渲染方法，其特征在于，应用于服务端，所述方法包括：
接收来自终端的目标网页访问请求；
响应于所述目标网页访问请求，将所述目标网页的页面配置文件发送至所述终端，其中，
所述页面配置文件用于形成所述目标网页的预渲染页面，所述预渲染页面包括已经过渲染的部分或全部目标网页；
所述预渲染页面用于使所述终端得到所述目标网页的渲染页面。
2.根据权利要求1所述的方法，其特征在于，所述页面配置文件存储于内容分发网络；
所述将所述目标网页的页面配置文件发送至所述终端，包括：
将所述目标网页的页面配置文件从所述内容分发网络发送至所述终端。
3.根据权利要求2所述的方法，其特征在于，所述页面配置文件包括超文本标记语言文件、层叠样式表文件和脚本语言文件；
所述超文本标记语言文件存储于第一内容分发网络；
所述层叠样式表文件和所述脚本语言文件存储于第二内容分发网络；
其中，所述第一内容分发网络的地址与所述目标网页的地址相同，所述超文本标记语言文件中包括所述第二内容分发网络的地址。
4.根据权利要求3所述的方法，其特征在于，所述将所述目标网页的页面配置文件从所述内容分发网络发送至所述终端，包括：
根据所述终端的地理位置，将所述超文本标记语言文件从第一内容分发网络发送至所述终端；
接收所述终端发送的文件获取请求；
响应于所述文件获取请求，将所述层叠样式表文件和所述脚本语言文件从第二内容分发网络发送至所述终端。
5.根据权利要求3所述的方法，其特征在于，在所述预渲染页面为部分目标网页的情况下，所述方法还包括：
在所述目标网页的剩余部分填充骨架页面。
6.根据权利要求5所述的方法，其特征在于，所述脚本语言文件中包括用户个性化数据的存储地址；
所述方法还包括：
获取所述终端的用户标识信息；
将与所述用户标识信息相匹配的用户个性化数据从所述用户个性化数据的存储地址发送至终端；
其中，所述用户个性化数据用于在终端形成所述目标网页的渲染页面过程中，填充所述骨架页面。
7.一种网页渲染方法，其特征在于，应用于终端，所述方法包括：
向服务器发送目标网页的访问请求；
接收所述服务器发送的所述目标网页的页面配置文件；
根据所述页面配置文件形成所述目标网页的预渲染页面，所述预渲染页面包括已经过渲染的部分或全部目标网页；
根据所述预渲染页面得到所述目标网页的渲染页面。
8.根据权利要求7所述的方法，其特征在于，所述页面配置文件存储于内容分发网络；
所述接收所述服务器发送的所述目标网页的页面配置文件，包括：
从所述内容分发网络接收所述服务器发送的所述目标网页的页面配置文件。
9.根据权利要求8所述的方法，其特征在于，所述页面配置文件包括超文本标记语言文件、层叠样式表文件和脚本语言文件；
所述超文本标记语言文件存储于第一内容分发网络；
所述层叠样式表文件和所述脚本语言文件存储于第二内容分发网络；
其中，所述第一内容分发网络的地址与所述目标网页的地址相同，所述超文本标记语言文件中包括所述第二内容分发网络的地址。
10.根据权利要求9所述的方法，其特征在于，所述从所述内容分发网络接收所述服务器发送的所述目标网页的页面配置文件，包括：
接收所述第一内容分发网络发送的所述超文本标记语言文件；
向所述第二内容分发网络的地址发出文件获取请求；
接收所述第二内容分发网络发送的层叠样式表文件。
11.根据权利要求10所述的方法，其特征在于，所述根据所述页面配置文件形成所述目标网页的预渲染页面，包括：
根据所述超文本标记语言文件和所述层叠样式表文件形成所述目标网页的预渲染页面。
12.根据权利要求11所述的方法，其特征在于，在所述预渲染页面包括已经过渲染的部分目标网页的情况下，所述目标网页的剩余部分填充有骨架页面；
所述根据所述预渲染页面得到所述目标网页的渲染页面，包括：
接收所述第二内容分发网络发送的所述脚本语言文件，所述脚本语言文件中包括用户个性化数据的存储地址；
将用户标识信息发送至所述用户个性化数据的存储地址；
接收所述服务器发送的用户个性化数据；
利用所述用户个性化数据填充所述骨架页面。
13.一种网页渲染装置，其特征在于，应用于服务端，所述装置包括：
访问请求接收模块，用于接收来自终端的目标网页访问请求；
页面配置文件发送模块，用于响应于所述目标网页访问请求，将所述目标网页的页面配置文件发送至所述终端，其中，
所述页面配置文件用于形成所述目标网页的预渲染页面，所述预渲染页面包括已经过渲染的部分或全部目标网页；
所述预渲染页面用于使所述终端形成所述目标网页的渲染页面。
14.根据权利要求13所述的装置，其特征在于，所述页面配置文件包括超文本标记语言文件、层叠样式表文件和脚本语言文件；
该装置还包括：
第一存储模块，用于将所述超文本标记语言文件存储于第一内容分发网络；
第二存储模块，用于将所述层叠样式表文件和所述脚本语言文件存储于第二内容分发网络；
其中，所述第一内容分发网络的地址与所述目标网页的地址相同，所述超文本标记语言文件中包括所述第二内容分发网络的地址。
15.根据权利要求14所述的装置，其特征在于，所述页面配置文件发送模块包括：
第一发送子模块，用于根据所述终端的地理位置，将所述超文本标记语言文件从第一内容分发网络发送至所述终端；
第一接收子模块，用于接收所述终端发送的文件获取请求；
第二发送子模块，用于响应于所述文件获取请求，将所述层叠样式表文件和所述脚本语言文件从第二内容分发网络发送至所述终端。
16.根据权利要求14所述的装置，其特征在于，在所述预渲染页面为部分目标网页的情况下，所述装置还包括：
填充模块，用于在所述目标网页的剩余部分填充骨架页面。
17.根据权利要求16所述的装置，其特征在于，所述脚本语言文件中包括用户个性化数据的存储地址；
所述装置还包括：
用户标识信息获取模块，用于获取所述终端的用户标识信息；
个性化数据发送模块，用于将与所述用户标识信息相匹配的用户个性化数据从所述用户个性化数据的存储地址发送至终端；
其中，所述用户个性化数据用于在终端形成所述目标网页的渲染页面过程中，填充所述骨架页面。
18.一种网页渲染装置，其特征在于，应用于终端，所述装置包括：
访问请求发送模块，用于向服务器发送目标网页的访问请求；
页面配置文件接收模块，用于接收所述服务器发送的所述目标网页的页面配置文件；
第一渲染模块，用于根据所述页面配置文件形成所述目标网页的预渲染页面，所述预渲染页面包括已经过渲染的部分或全部目标网页；
第二渲染模块，用于根据所述预渲染页面得到所述目标网页的渲染页面。
19.根据权利要求18所述的装置，其特征在于，所述页面配置文件包括超文本标记语言文件、层叠样式表文件和脚本语言文件；
所述超文本标记语言文件存储于第一内容分发网络；
所述层叠样式表文件和所述脚本语言文件存储于第二内容分发网络；
其中，所述第一内容分发网络的地址与所述目标网页的地址相同，所述超文本标记语言文件中包括所述第二内容分发网络的地址。
20.根据权利要求19所述的装置，其特征在于，所述页面配置文件接收模块，包括：
第二接收子模块，用于接收所述超文本标记语言文件；
第三发送子模块，用于向所述第二内容分发网络的地址发出文件获取请求；
第三接收子模块，用于接收所述第二内容分发网络发送的层叠样式表文件。
21.根据权利要求20所述的装置，其特征在于，所述第一渲染模块，包括：
渲染执行子模块，用于根据所述超文本标记语言文件和所述层叠样式表文件形成所述目标网页的预渲染页面。
22.根据权利要求21所述的装置，其特征在于，在所述预渲染页面包括已经过渲染的部分目标网页的情况下，所述目标网页的剩余部分填充有骨架页面；
所述第二渲染模块，包括：
脚本语言文件接收子模块，用于接收所述第二内容分发网络发送的脚本语言文件，所述脚本语言文件中包括用户个性化数据的存储地址；
用户标识信息发送子模块，用于将用户标识信息发送至所述用户个性化数据的存储地址；
用户个性化数据接收子模块，用于接收所述服务器发送的用户个性化数据；
骨架页面填充子模块，用于利用所述用户个性化数据填充所述骨架页面。
23.一种电子设备，其特征在于，包括：
至少一个处理器；以及
与所述至少一个处理器通信连接的存储器；其中，
所述存储器存储有可被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行，以使所述至少一个处理器能够执行权利要求1-6中任一项所述的方法。
24.一种电子设备，其特征在于，包括：
至少一个处理器；以及
与所述至少一个处理器通信连接的存储器；其中，
所述存储器存储有可被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行，以使所述至少一个处理器能够执行权利要求7-12中任一项所述的方法。
25.一种存储有计算机指令的非瞬时计算机可读存储介质，其特征在于，所述计算机指令用于使所述计算机执行权利要求1-12中任一项所述的方法。
CN201911052348.4A 2019-10-31 2019-10-31 一种网页渲染方法、装置、电子设备及存储介质 Active CN110795195B (zh)

Priority Applications (4)

Application Number Priority Date Filing Date Title
CN201911052348.4A CN110795195B (zh) 2019-10-31 2019-10-31 一种网页渲染方法、装置、电子设备及存储介质
US16/875,575 US11144711B2 (en) 2019-10-31 2020-05-15 Webpage rendering method, device, electronic apparatus and storage medium
JP2020087106A JP6997253B2 (ja) 2019-10-31 2020-05-19 ウェブページレンダリング方法、装置、電子設備、記憶媒体及びプログラム
EP20175916.4A EP3816823A1 (en) 2019-10-31 2020-05-21 Webpage rendering method, device, electronic apparatus and storage medium

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201911052348.4A CN110795195B (zh) 2019-10-31 2019-10-31 一种网页渲染方法、装置、电子设备及存储介质

Publications (2)

Publication Number Publication Date
CN110795195A true CN110795195A (zh) 2020-02-14
CN110795195B CN110795195B (zh) 2023-09-26

Family

ID=69440609

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201911052348.4A Active CN110795195B (zh) 2019-10-31 2019-10-31 一种网页渲染方法、装置、电子设备及存储介质

Country Status (4)

Country Link
US (1) US11144711B2 (zh)
EP (1) EP3816823A1 (zh)
JP (1) JP6997253B2 (zh)
CN (1) CN110795195B (zh)

Cited By (12)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111339462A (zh) * 2020-02-18 2020-06-26 北京百度网讯科技有限公司 一种组件渲染方法、装置、服务器、终端和介质
CN111506844A (zh) * 2020-04-08 2020-08-07 聚好看科技股份有限公司 页面处理方法、设备及计算机存储介质
CN111506387A (zh) * 2020-03-02 2020-08-07 百度在线网络技术（北京）有限公司 页面预渲染方法、装置、电子设备及存储介质
CN111581233A (zh) * 2020-05-07 2020-08-25 广东电网有限责任公司电力调度控制中心 电网设备矢量图形数据的实时切片方法及存储介质
CN111581473A (zh) * 2020-04-01 2020-08-25 北京皮尔布莱尼软件有限公司 一种网页处理方法
CN111666585A (zh) * 2020-04-16 2020-09-15 北京百度网讯科技有限公司 子应用访问的方法、装置、电子设备以及可读存储介质
CN111708962A (zh) * 2020-06-23 2020-09-25 中国平安财产保险股份有限公司 骨架屏的渲染方法、装置、设备及存储介质
CN111831950A (zh) * 2020-06-08 2020-10-27 瑞数信息技术（上海）有限公司 网页元素的处理方法和装置
CN112214701A (zh) * 2020-10-14 2021-01-12 青岛海尔科技有限公司 页面的展示方法及系统、存储介质、电子装置
CN112667945A (zh) * 2020-12-25 2021-04-16 政和科技股份有限公司 一种基于前后端分离技术开发网站的seo优化方法
CN113872809A (zh) * 2021-09-28 2021-12-31 绿盟科技集团股份有限公司 访问方法、装置、电子设备和存储介质
CN114153547A (zh) * 2021-12-06 2022-03-08 珠海金山数字网络科技有限公司 管理页面显示方法及装置

Families Citing this family (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
JP7034041B2 (ja) * 2018-09-19 2022-03-11 三菱電機株式会社 半導体装置の検査装置および半導体装置の検査方法
CN113297522A (zh) * 2021-05-10 2021-08-24 广州虎牙科技有限公司 一种页面渲染方法、装置、电子设备及可读存储介质
CN113326043B (zh) * 2021-05-26 2022-05-03 上海哔哩哔哩科技有限公司 网页渲染方法、网页制作方法及网页渲染系统
CN113467855B (zh) * 2021-06-24 2024-03-19 北京达佳互联信息技术有限公司 网页请求处理方法、装置、电子设备及存储介质
CN113569177A (zh) * 2021-07-16 2021-10-29 上海淇玥信息技术有限公司 一种跳转网页优化的方法、装置及电子设备
CN113760285A (zh) * 2021-08-09 2021-12-07 上海数禾信息科技有限公司 页面配置方法、装置、计算机设备以及页面展示方法
CN113961286A (zh) * 2021-10-11 2022-01-21 支付宝(杭州)信息技术有限公司 一种应用程序的页面生成方法、装置及设备
CN114817816A (zh) * 2022-05-20 2022-07-29 盐城金堤科技有限公司 页面加载的方法、装置、存储介质以及电子设备
CN115221443B (zh) * 2022-09-15 2023-01-20 北京达佳互联信息技术有限公司 信息传输方法、装置、系统、电子设备及存储介质

Citations (14)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US8744988B1 (en) * 2011-07-15 2014-06-03 Google Inc. Predicting user navigation events in an internet browser
CN104182547A (zh) * 2014-09-10 2014-12-03 北京浩瀚深度信息技术股份有限公司 一种服务器优化页面渲染的方法及web cache服务器
CN104714982A (zh) * 2013-12-17 2015-06-17 阿里巴巴集团控股有限公司 一种网页的加载方法和系统
CN106339414A (zh) * 2016-08-12 2017-01-18 合网络技术（北京）有限公司 网页渲染方法及装置
CN106484383A (zh) * 2015-08-31 2017-03-08 阿里巴巴集团控股有限公司 页面渲染方法、装置及设备
CN107870920A (zh) * 2016-09-23 2018-04-03 腾讯科技（深圳）有限公司 浏览器资源预拉取方法及装置
CN107943478A (zh) * 2017-11-29 2018-04-20 厦门市美亚柏科信息股份有限公司 一种网页应用程序的开发及加载方法、装置、终端和介质
US10187319B1 (en) * 2013-09-10 2019-01-22 Instart Logic, Inc. Automatic configuration generation for a proxy optimization server for optimizing the delivery of content of a web publisher
CN109543128A (zh) * 2018-10-19 2019-03-29 深圳点猫科技有限公司 一种基于编程语言的前端框架项目实现方法及电子设备
CN109902248A (zh) * 2019-02-25 2019-06-18 百度在线网络技术（北京）有限公司 页面显示方法、装置、计算机设备和可读存储介质
CN109992736A (zh) * 2019-03-20 2019-07-09 腾讯科技（深圳）有限公司 网页动态加载效果实现方法、装置、终端和存储介质
CN110096659A (zh) * 2019-03-27 2019-08-06 北京三快在线科技有限公司 一种页面显示方法、装置、设备及可读存储介质
CN110362731A (zh) * 2019-07-15 2019-10-22 浙江大搜车软件技术有限公司 提升网站搜索排名的方法、装置、计算机设备和存储介质
CN110377285A (zh) * 2019-07-23 2019-10-25 腾讯科技（深圳）有限公司 一种生成页面骨架屏的方法、装置及计算机设备

Family Cites Families (14)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
EP1662405A1 (en) 2004-11-30 2006-05-31 Alcatel Method of displaying data on a client computer
US8706558B2 (en) * 2008-03-19 2014-04-22 Viewbix Inc. Video e-commerce
CN102902802B (zh) * 2012-10-12 2016-06-01 北京奇虎科技有限公司 一种网页转码方法和装置
US9591052B2 (en) * 2013-02-05 2017-03-07 Apple Inc. System and method for providing a content distribution network with data quality monitoring and management
US9838487B2 (en) * 2013-09-27 2017-12-05 Disney Enterprises, Inc. Method and system for mapping, tracking, and transporting of content data on a webpage
WO2015058546A1 (zh) * 2013-10-25 2015-04-30 优视科技有限公司 网页预加载方法及装置
JP6494165B2 (ja) * 2014-03-05 2019-04-03 セイムクリック株式会社 広告配信システム
US9753904B2 (en) 2014-07-25 2017-09-05 Qualcomm Incorporated Fast rendering of websites containing dynamic content and stale content
US9852759B2 (en) * 2014-10-25 2017-12-26 Yieldmo, Inc. Methods for serving interactive content to a user
US10291738B1 (en) * 2016-01-21 2019-05-14 Instart Logic, Inc. Speculative prefetch of resources across page loads
CN107526751A (zh) * 2016-06-22 2017-12-29 广州市动景计算机科技有限公司 网页的加载方法、客户端、网页服务器及可编程设备
WO2019157275A1 (en) * 2018-02-09 2019-08-15 Branch Metrics, Inc. Techniques for selecting additional links
US10938879B2 (en) * 2018-06-04 2021-03-02 Akamai Technologies, Inc. Third-party Ad acceleration
US10911793B2 (en) * 2018-11-14 2021-02-02 Sony Interactive Entertainment LLC Video start-time reduction employing reductive edging principles

Patent Citations (14)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US8744988B1 (en) * 2011-07-15 2014-06-03 Google Inc. Predicting user navigation events in an internet browser
US10187319B1 (en) * 2013-09-10 2019-01-22 Instart Logic, Inc. Automatic configuration generation for a proxy optimization server for optimizing the delivery of content of a web publisher
CN104714982A (zh) * 2013-12-17 2015-06-17 阿里巴巴集团控股有限公司 一种网页的加载方法和系统
CN104182547A (zh) * 2014-09-10 2014-12-03 北京浩瀚深度信息技术股份有限公司 一种服务器优化页面渲染的方法及web cache服务器
CN106484383A (zh) * 2015-08-31 2017-03-08 阿里巴巴集团控股有限公司 页面渲染方法、装置及设备
CN106339414A (zh) * 2016-08-12 2017-01-18 合网络技术（北京）有限公司 网页渲染方法及装置
CN107870920A (zh) * 2016-09-23 2018-04-03 腾讯科技（深圳）有限公司 浏览器资源预拉取方法及装置
CN107943478A (zh) * 2017-11-29 2018-04-20 厦门市美亚柏科信息股份有限公司 一种网页应用程序的开发及加载方法、装置、终端和介质
CN109543128A (zh) * 2018-10-19 2019-03-29 深圳点猫科技有限公司 一种基于编程语言的前端框架项目实现方法及电子设备
CN109902248A (zh) * 2019-02-25 2019-06-18 百度在线网络技术（北京）有限公司 页面显示方法、装置、计算机设备和可读存储介质
CN109992736A (zh) * 2019-03-20 2019-07-09 腾讯科技（深圳）有限公司 网页动态加载效果实现方法、装置、终端和存储介质
CN110096659A (zh) * 2019-03-27 2019-08-06 北京三快在线科技有限公司 一种页面显示方法、装置、设备及可读存储介质
CN110362731A (zh) * 2019-07-15 2019-10-22 浙江大搜车软件技术有限公司 提升网站搜索排名的方法、装置、计算机设备和存储介质
CN110377285A (zh) * 2019-07-23 2019-10-25 腾讯科技（深圳）有限公司 一种生成页面骨架屏的方法、装置及计算机设备

Non-Patent Citations (2)

* Cited by examiner, † Cited by third party
Title
蒋凌燕 等: ""基于HTML5的响应式Web页面重组适配技术研究"", 《计算机与现代化》, no. 2, pages 7 - 10 *
闫兴亚;潘治颖;黄姝琦;: "首屏数据并行式预加载方案的研究与应用", 计算机与数字工程, no. 05, pages 261 - 265 *

Cited By (21)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111339462A (zh) * 2020-02-18 2020-06-26 北京百度网讯科技有限公司 一种组件渲染方法、装置、服务器、终端和介质
WO2021174928A1 (zh) * 2020-03-02 2021-09-10 百度在线网络技术（北京）有限公司 页面预渲染方法、装置、电子设备及存储介质
CN111506387A (zh) * 2020-03-02 2020-08-07 百度在线网络技术（北京）有限公司 页面预渲染方法、装置、电子设备及存储介质
US11829436B2 (en) 2020-03-02 2023-11-28 Baidu Online Network Technology (Beijing) Co., Ltd. Method and apparatus of pre-rendering page, electronic device, and storage medium
CN111506387B (zh) * 2020-03-02 2023-09-22 百度在线网络技术（北京）有限公司 页面预渲染方法、装置、电子设备及存储介质
US20220308900A1 (en) 2020-03-02 2022-09-29 Baidu Online Network Technology (Beijing) Co., Ltd. Method and apparatus of pre-rendering page, electronic device, and storage medium
CN111581473B (zh) * 2020-04-01 2024-03-15 北京皮尔布莱尼软件有限公司 一种网页处理方法
CN111581473A (zh) * 2020-04-01 2020-08-25 北京皮尔布莱尼软件有限公司 一种网页处理方法
CN111506844A (zh) * 2020-04-08 2020-08-07 聚好看科技股份有限公司 页面处理方法、设备及计算机存储介质
CN111506844B (zh) * 2020-04-08 2023-07-14 聚好看科技股份有限公司 页面处理方法、设备及计算机存储介质
CN111666585A (zh) * 2020-04-16 2020-09-15 北京百度网讯科技有限公司 子应用访问的方法、装置、电子设备以及可读存储介质
CN111666585B (zh) * 2020-04-16 2023-08-18 北京百度网讯科技有限公司 子应用访问的方法、装置、电子设备以及可读存储介质
CN111581233B (zh) * 2020-05-07 2023-11-24 广东电网有限责任公司电力调度控制中心 电网设备矢量图形数据的实时切片方法及存储介质
CN111581233A (zh) * 2020-05-07 2020-08-25 广东电网有限责任公司电力调度控制中心 电网设备矢量图形数据的实时切片方法及存储介质
CN111831950A (zh) * 2020-06-08 2020-10-27 瑞数信息技术（上海）有限公司 网页元素的处理方法和装置
CN111708962A (zh) * 2020-06-23 2020-09-25 中国平安财产保险股份有限公司 骨架屏的渲染方法、装置、设备及存储介质
CN112214701A (zh) * 2020-10-14 2021-01-12 青岛海尔科技有限公司 页面的展示方法及系统、存储介质、电子装置
CN112667945A (zh) * 2020-12-25 2021-04-16 政和科技股份有限公司 一种基于前后端分离技术开发网站的seo优化方法
CN113872809A (zh) * 2021-09-28 2021-12-31 绿盟科技集团股份有限公司 访问方法、装置、电子设备和存储介质
CN114153547A (zh) * 2021-12-06 2022-03-08 珠海金山数字网络科技有限公司 管理页面显示方法及装置
CN114153547B (zh) * 2021-12-06 2023-11-17 珠海金山数字网络科技有限公司 管理页面显示方法及装置

Also Published As

Publication number Publication date
US11144711B2 (en) 2021-10-12
US20210133388A1 (en) 2021-05-06
EP3816823A1 (en) 2021-05-05
JP2021072089A (ja) 2021-05-06
CN110795195B (zh) 2023-09-26
JP6997253B2 (ja) 2022-01-17

Similar Documents

Publication Publication Date Title
CN110795195A (zh) 一种网页渲染方法、装置、电子设备及存储介质
KR102147714B1 (ko) 비-브라우저 애플리케이션들에서의 콘텐츠 통합
CN109313661A (zh) 针对原生移动应用中托管的网络应用的网页加速
CN110020388A (zh) 一种页面展示方法及系统
CN110704136A (zh) 小程序组件的渲染方法、客户端、电子设备及存储介质
CN113010827B (zh) 页面渲染方法、装置、电子设备以及存储介质
CN111338623B (zh) 一种开发用户界面的方法、装置、介质和电子设备
KR102136474B1 (ko) 가상 세션에서의 클라이언트 측 키보드 레이아웃과 서버 측 키보드 레이아웃의 동기화
US20140325349A1 (en) Real-time Representations of Edited Content
CN111897619A (zh) 浏览器页面的显示方法、装置、电子设备及存储介质
CN107247544A (zh) 使用交互图像优化软件应用用户界面性能
CN111240777A (zh) 动态壁纸生成方法、装置、存储介质及电子设备
JP2023537767A (ja) 画像処理方法及び装置、並びにコンピュータ可読記憶媒体
KR102040359B1 (ko) 상태 정보를 위한 동기화 지점
US10083156B2 (en) Mobile enablement of webpages
CN115510347A (zh) 演示文稿的转换方法、装置、电子设备及存储介质
US20160343041A1 (en) INTERFACING WITH SERVERS HAVING DIFFERENT APIs TO OBTAIN ADVERTISEMENT DATA
CN110618811B (zh) 信息呈现方法和装置
WO2023169193A1 (zh) 用于生成智能合约的方法和装置
CN112764746A (zh) 数据处理方法、装置、电子设备及存储介质
CN109905753B (zh) 角标的显示方法和装置、存储介质、电子装置
CN115617420A (zh) 应用程序的生成方法、装置、设备以及存储介质
CN106383705B (zh) 在应用瘦客户端中设置鼠标显示状态的方法及装置
US20160147741A1 (en) Techniques for providing a user interface incorporating sign language
CN111913711A (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