当前位置: 首页 > 专利查询>崔红保专利>正文

加速页面渲染的方法及装置制造方法及图纸

技术编号:18732081 阅读:29 留言:0更新日期:2018-08-22 02:56
本申请提供了加速页面渲染的方法及装置,其中,该加速页面渲染方法包括:响应于页面请求,触发所述页面上添加的原生视图控件渲染预设页面内容,以及,向服务器请求下载所述页面的文档;响应于所述服务器返回所述页面的文档,从所述文档中解析得到所述页面的全部内容;将所述页面的内容进行展示。采用本申请实施例,因为下载页面的文档以及从文档中解析得到页面的全部内容需要一定的时间,而原生视图控件渲染的预设页面内容就能提前被用户看到,从而缩短用户看到页面内容的时间,提升用户浏览网页的体验。

Method and device for accelerating page rendering

The present application provides a method and apparatus for accelerating page rendering, wherein the accelerated page rendering method includes: triggering a native view control added on the page to render a preset page content in response to a page request, and requesting a download of a document of the page from a server; and returning the page in response to the server A comprehensive document is parsed from the document to obtain the full content of the page; the content of the page is displayed. With the present embodiment, since it takes a certain amount of time to download the document of the page and parse the entire content of the page from the document, the preset page content rendered by the native view control can be seen by the user in advance, thus shortening the time for the user to see the page content and enhancing the user's experience of browsing the page.

【技术实现步骤摘要】
加速页面渲染的方法及装置
本申请涉及互联网数据处理
,特别涉及一种加速页面渲染的方法及装置,以及,一种计算机可读介质。
技术介绍
Web页面是基于浏览器可访问的网站页面。用户通常可以使用浏览器等客户端浏览网页,一般情况下,在用户加载网页的时候,服务器会先将页面的Document(文档)发送至客户端,由客户端对该文档进行解析,从而得到网页的内容,并加载在浏览器上展示给用户。但是采用这种浏览网页的方法,加载页面的内容的速度较慢,会导致用户体验较差。例如,假设用户触发了商品详情的页面,由于下载和解析文档还需要一定的时间,就会导致用户在浏览网页的时候,网页上可能出现白屏状态。
技术实现思路
专利技术人在研究过程中发现,现有技术中因为web页面需要等待服务器端的Document完全下载完成后,才能启动对Document的解析和渲染,所以无法实现分区域渲染。此外,在web页面包括有图片资源的情况下web页面在下载Document后,还需要根据Document中的<img>标签的src属性去异步加载图片资源,故在web页面中一般会先看到文字,然后再逐渐看到图片。并且,若web页面内容不是服务器端渲染的,是前后端分离的,则需要先下载Document文档对象,解析Document文档并获得封装业务逻辑的js文件地址,请求下载js文件,js文件下载完毕后再由js发起业务请求,故用户看到页面内容的时间更晚。因此,可以采用在web页面中添加原生视图控件的方式。首先,原生视图控件可以利用本地资源提前绘制部分内容,无需等待网络请求;浏览器等客户端软件可以预先获取并存储(或预置)原生视图控件配置资源,在用户触发打开web页面的新窗口时,使用本地存储的原生视图配置资源渲染原生视图控件上的部分页面内容,让用户提前看到这部分页面内容,避免整体白屏的现象。并且,原生视图控件无需等待页面Document的下载即可直接加载图片资源,故原生视图控件的图片显示会早于web页面上的图片显示。此外,原生视图控件上需展现的动态页面内容,可以预先获取业务逻辑实现代码并存储(或预置)在客户端本地,无需等待Document文档对象下载及业务逻辑js文件下载,可以比浏览器等客户端更早地发起动态页面内容的请求。基于此,本申请提供了一种加速页面渲染的方法,用以采用在web上可以预先添加原生视图控件的方式,在用户请求页面的内容之后,触发原生视图控件先渲染预设页面内容,同时向服务器请求下载页面的文档,因为下载页面的文档以及从文档中解析得到页面的全部内容需要一定的时间,而原生视图控件渲染的预设页面内容就能提前被用户看到,从而提升用户浏览网页的体验。本申请还提供了一种加速页面渲染的装置,用以保证上述方法在实际中的实现及应用。为了解决上述问题,本申请公开了一种加速页面渲染的方法,该方法包括:响应于页面请求,触发所述页面上添加的原生视图控件渲染预设页面内容,以及,向服务器请求下载所述页面的文档;响应于所述服务器返回所述页面的文档,从所述文档中解析得到所述页面的全部内容;将所述页面的内容进行展示。其中,所述预设页面内容为静态页面内容,所述触发所述页面上添加的原生视图控件渲染预设页面内容,包括:触发所述原生视图控件确定在屏幕上的显示位置;触发所述原生视图控件在所述显示位置上绘制所述静态页面内容。其中,所述预设页面内容为动态页面内容,所述触发所述页面上添加的原生视图控件渲染预设页面内容,包括:触发所述原生视图控件确定在屏幕上的显示位置,以及,向服务器发送动态页面内容的请求;响应于所述服务器返回所述动态页面内容,触发所述原生视图控件在所述显示位置上绘制所述动态页面内容。其中,该方法还包括:响应于接收到所述页面的全部内容加载完毕的通知事件,或者,响应于在所述页面上触发的用户操作,在页面上删除所述原生视图控件;其中,所述用户操作包括:点击、滑动、触摸和/或滚动操作。其中,该方法还包括:响应于用户触发所述页面的内容滚动的操作,触发所述原生视图控件随着所述内容滚动而滚动,或者,所述原生视图控件在屏幕上的位置保持不变。其中,同一个页面上的原生视图控件的个数为一个或多个。本申请实施例还公开了一种加速页面渲染的装置,包括:触发模块,用于响应于页面请求,触发所述页面上添加的原生视图控件渲染预设页面内容;下载模块,用于向服务器请求下载所述页面的文档;解析模块,用于响应于所述服务器返回所述页面的文档,从所述文档中解析得到所述页面的全部内容;展示模块,用于将所述页面的内容进行展示。其中,所述预设页面内容为静态页面内容,所述触发模块包括:第一触发子模块,用于触发所述原生视图控件确定在屏幕上的显示位置;第二触发子模块,用于触发所述原生视图控件在所述显示位置上绘制所述静态页面内容。其中,所述预设页面内容为动态页面内容,所述触发模块包括:第三触发子模块,用于触发所述原生视图控件确定在屏幕上的显示位置;发送子模块,用于向服务器发送动态页面内容的请求;第四触发子模块,用于响应于所述服务器返回所述动态页面内容,触发所述原生视图控件在所述显示位置上绘制所述动态页面内容。其中,该装置还包括:删除模块,用于响应于接收到所述页面的全部内容加载完毕的通知事件,或者,响应于在所述页面上触发的用户操作,在页面上删除所述原生视图控件;其中,所述用户操作包括:点击、滑动、触摸和/或滚动操作。其中,该装置还包括:响应于用户触发所述页面的内容滚动的操作,触发所述原生视图控件随着所述内容滚动而滚动,或者,所述原生视图控件在屏幕上的位置保持不变。本申请实施例还公开了一种计算机可读介质,其上存储有指令,当由一个或多个处理器执行时,使得装置执行如前所述的加速页面渲染的方法。与现有技术相比,本申请实施例包括以下优点:在本申请实施例中,在web上可以预先添加原生视图控件,在用户请求页面的内容之后,触发原生视图控件先渲染预设页面内容,同时向服务器请求下载页面的文档,因为下载页面的文档以及从文档中解析得到页面的全部内容需要一定的时间,而原生视图控件渲染的预设页面内容就能提前被用户看到,从而缩短用户看到页面内容的时间,提升用户浏览网页的体验。并且原生视图控件可以设置一个或多个,其上渲染的预设页面内容可以是静态页面内容,也可以是实时请求的动态页面内容,从而使得提前展示给用户的预设页面内容更贴合用户的需求。当然,实施本申请的任一产品并不一定需要同时达到以上所述的所有优点。附图说明为了更清楚地说明本申请实施例中的技术方案,下面将对实施例描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本申请的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动性的前提下,还可以根据这些附图获得其他的附图。图1是本申请的加速页面渲染的方法实施例的示例性流程图;图2是本申请的方法实施例中添加原生view控件的示意图;图3是本申请的方法实施例中静态页面内容的示例性示意图;图4是本申请的加速页面渲染的装置实施例的结构框图。具体实施方式下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有本文档来自技高网...

【技术保护点】
1.一种加速页面渲染的方法,其特征在于,该方法包括:响应于页面请求,触发所述页面上添加的原生视图控件渲染预设页面内容,以及,向服务器请求下载所述页面的文档;响应于所述服务器返回所述页面的文档,从所述文档中解析得到所述页面的全部内容;将所述页面的内容进行展示。

【技术特征摘要】
1.一种加速页面渲染的方法,其特征在于,该方法包括:响应于页面请求,触发所述页面上添加的原生视图控件渲染预设页面内容,以及,向服务器请求下载所述页面的文档;响应于所述服务器返回所述页面的文档,从所述文档中解析得到所述页面的全部内容;将所述页面的内容进行展示。2.根据权利要求1所述的方法,其特征在于,所述预设页面内容为静态页面内容,所述触发所述页面上添加的原生视图控件渲染预设页面内容,包括:触发所述原生视图控件确定在屏幕上的显示位置;触发所述原生视图控件在所述显示位置上绘制所述静态页面内容。3.根据权利要求1所述的方法,其特征在于,所述预设页面内容为动态页面内容,所述触发所述页面上添加的原生视图控件渲染预设页面内容,包括:触发所述原生视图控件确定在屏幕上的显示位置,以及,向服务器发送动态页面内容的请求;响应于所述服务器返回所述动态页面内容,触发所述原生视图控件在所述显示位置上绘制所述动态页面内容。4.根据权利要求1所述的方法,其特征在于,还包括:响应于接收到所述页面的内容加载完毕的通知事件,或者,响应于在所述页面上触发的用户操作,在页面上删除所述原生视图控件;其中,所述用户操作包括:点击、滑动、触摸和/或滚动操作。5.根据权利要求1所述的方法,其特征在于,还包括:响应于用户触发所述页面的内容滚动的操作,触发所述原生视图控件随着所述内容滚动而滚动,或者,所述原生视图控件在屏幕上的位置保持不变。6.根据权利要求1所述的方法,其特征在于,同一个页面上的原生视图控件的个数为一个或多个。7.一种加速页面渲染的装置,其特征在于,包括:触发模块,用...

【专利技术属性】
技术研发人员:崔红保
申请(专利权)人:崔红保
类型:发明
国别省市:北京,11

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1