一种网页资源异步加载的方法及装置制造方法及图纸

技术编号:15118367 阅读:86 留言:0更新日期:2017-04-09 16:07
本发明专利技术公开了一种网页资源异步加载的方法及装置。其中,该方法包括:获取网页代码,网页代码包括网页框架信息和图片信息,图片信息中包含相应图片资源的地址;调用第一进程,根据网页框架信息加载网页框架,并确定网页框架中的图片显示位置;调用第二进程,根据图片信息确定图片资源的地址,根据图片资源的地址获取图片资源,并在确定网页框架中的图片显示位置之后,将图片资源加载于相应的图片显示位置处;第一进程和第二进程为异步处理的进程。该方法由两个异步处理的进程完成加载过程,即由异步处理逻辑的了另一个进程加载图片资源,从而可以提高网页加载速度,进而加快页面显示速度。

【技术实现步骤摘要】

本专利技术涉及网页加载
,尤其涉及一种网页资源异步加载的方法及装置
技术介绍
随着网络技术的快速发展,网络内容越来越丰富,网页中除了文字还会嵌入各种各样的图片。客户端的浏览器在访问网页时,除了加载网页中的文字,还需要加载网页中的图片。同时,在很多网页中,图片文件所占的比重也越来也大,且图片文件的尺寸通常都比较大,因此大量的图片文件会严重影响网页的加载速度。现有网页加载的方法是:网页加载和被刷新的时候,除了图片之外的内容(文字和布局等)和图片是一起加载,图片的地址放在HTML代码中,逐一去请求,完整加载之后,再整体显示。具体的,在网页的HTML代码中,在显示区域部分,按照传统方式,是写入图片的地址例如:*jpg,src:****,这样在加载页面时,必须去请求这些照片才能完整实现整个页面。如果某个图片无法加载,会出现网页加载不下去的情况;而且如果图片比较大,加载速度会比较慢。
技术实现思路
本专利技术实施例提供一种网页资源异步加载的方法及装置,用于解决现有网页加载方法速度慢的技术问题。本专利技术实施例提供的一种网页资源异步加载的方法,包括以下步骤:获取网页代码,网页本代码包括网页框架信息和图片信息,图片信息中包含相应图片资源的地址;调用第一进程,根据网页框架信息加载网页框架,并确定网页框架中的图片显示位置;调用第二进程,根据图片信息确定图片资源的地址,根据图片资源的地址获取图片资源,并在确定网页框架中的图片显示位置之后,将图片资源加载于相应的图片显示位置处;第一进程和第二进程为异步处理的进程。本专利技术实施例中,图片的地址隐藏在图片的属性中,由不同于第一进程的第二进程执行加载操作。即,第一进程和第二进程为异步处理的进程,两个进程为相互独立、异步处理网页加载的进程。具体的,第二进程用于根据图片资源的地址获取图片资源,同时根据第一进程确定的图片显示位置,将图片资源加载于相应的图片显示位置处。在上述技术方案中,在确定网页框架中的图片显示位置步骤之后,还包括:在图片显示位置处加载预先设置的本地资源;在根据图片资源的地址获取图片资源之后,将本地资源替换为图片资源。在上述技术方案中,根据图片资源的地址获取图片资源,包括:在包含多个图片资源时,分别根据图片资源的地址同时获取图片资源。在上述技术方案中,根据图片资源的地址获取图片资源,包括:根据图片资源在网页框架中的图片显示位置,分别确定图片资源的图片显示位置与网页框架顶端之间的距离值;按照距离值从小到大的顺序加载图片资源。在上述技术方案中,网页框架信息包括网页文字信息和网页布局信息。基于同样的专利技术构思,本专利技术实施例还提供一种网页资源异步加载的装置,包括:获取模块,用于获取网页代码,网页代码包括网页框架信息和图片信息,图片信息中包含相应图片资源的地址;第一加载模块,用于调用第一进程,根据网页框架信息加载网页框架,并确定网页框架中的图片显示位置;第二加载模块,用于调用第二进程,根据图片信息确定图片资源的地址,根据图片资源的地址获取图片资源,并在第一加载模块确定网页框架中的图片显示位置之后,将图片资源加载于相应的图片显示位置处。在上述技术方案中,还包括:第三加载模块,用于在第一加载模块确定网页框架中的图片显示位置之后,在图片显示位置处加载预先设置的本地资源;替换模块,用于在根据图片资源的地址获取图片资源之后,将本地资源替换为图片资源。在上述技术方案中,第二加载模块具体用于:在包含多个图片资源时,分别根据图片资源的地址同时获取图片资源。在上述技术方案中,第二加载模块包括:确定单元,用于根据图片资源在网页框架中的图片显示位置,分别确定图片资源的图片显示位置与网页框架顶端之间的距离值;加载单元,用于按照距离值从小到大的顺序加载图片资源。在上述技术方案中,网页框架信息包括网页文字信息和网页布局信息。本专利技术实施例提供的一种网页资源异步加载的方法及装置,图片的地址隐藏在图片的属性中,由不同于第一进程的第二进程执行加载操作。即,第一进程和第二进程为异步处理的进程,两个进程为相互独立、异步处理网页加载的进程。具体的,第二进程用于根据图片资源的地址获取图片资源,同时根据第一进程确定的图片显示位置,将图片资源加载于相应的图片显示位置处。通过在为获取到图片资源时,以本地资源暂时性代替显示,可以迅速将网页框架显示给用户。同时,根据图片资源的尺寸选取相匹配的本地资源,在该本地资源与图片资源的尺寸相同时,即使图片资源未加载完成,该网页框架的显示也不会发生变化,从而可以使得用户比较准确的定位到框架的某一位置。先加载网页最上端的图片,从而可以将网页最上端的图片向用户显示,符合用户浏览网页的习惯。本专利技术的其它特征和优点将在随后的说明书中阐述,并且,部分地从说明书中变得显而易见,或者通过实施本专利技术而了解。本专利技术的目的和其他优点可通过在所写的说明书、权利要求书、以及附图中所特别指出的结构来实现和获得。下面通过附图和实施例,对本专利技术的技术方案做进一步的详细描述。附图说明附图用来提供对本专利技术的进一步理解,并且构成说明书的一部分,与本发明的实施例一起用于解释本专利技术,并不构成对本专利技术的限制。在附图中:图1为本专利技术实施例中网页资源异步加载的方法流程图;图2为本专利技术实施例中加载本地资源的方法流程图;图3为本专利技术实施例中根据图片资源的地址获取图片资源的方法流程图;图4为本专利技术实施例一中网页资源异步加载的方法流程图;图5为本专利技术实施例二中网页资源异步加载的方法流程图;图6为本专利技术实施例中网页资源异步加载的装置的第一结构图;图7为本专利技术实施例中网页资源异步加载的装置的第二结构图;图8为本专利技术实施例中第二加载模块的结构图。具体实施方式以下结合附图对本专利技术的优选实施例进行说明,应当理解,此处所描述的优选实施例仅用于说明和解释本专利技术,并不用于限定本专利技术。参见图1,本专利技术实施例提供的一种网页资源异步加载的方法的流程如下,具体包括步骤101-103:步骤101:获取网页代码,网页代码包括网页框架信息和图片信息,图片信息中包含相应图片资源的地址。本专利技术实施例中,将网页代码分为框架和图片两部分,具体包括网页框架信息和图片信息;其中,该网页框架信息具体包括网页文字信息和网页布局信息。步骤102:调用第一进程,根据网页框架信息加载网页框架,并确定网页<本文档来自技高网...

【技术保护点】
一种网页资源异步加载的方法,其特征在于,包括以下步骤:获取网页代码,所述网页代码包括网页框架信息和图片信息,所述图片信息中包含相应图片资源的地址;调用第一进程,根据所述网页框架信息加载网页框架,并确定网页框架中的图片显示位置;调用第二进程,根据所述图片信息确定图片资源的地址,根据所述图片资源的地址获取所述图片资源,并在确定网页框架中的图片显示位置之后,将所述图片资源加载于相应的图片显示位置处;所述第一进程和所述第二进程为异步处理的进程。

【技术特征摘要】
1.一种网页资源异步加载的方法,其特征在于,包括以下步骤:
获取网页代码,所述网页代码包括网页框架信息和图片信息,所述图片信
息中包含相应图片资源的地址;
调用第一进程,根据所述网页框架信息加载网页框架,并确定网页框架中
的图片显示位置;
调用第二进程,根据所述图片信息确定图片资源的地址,根据所述图片资
源的地址获取所述图片资源,并在确定网页框架中的图片显示位置之后,将所
述图片资源加载于相应的图片显示位置处;所述第一进程和所述第二进程为异
步处理的进程。
2.根据权利要求1所述的方法,其特征在于,在确定网页框架中的图片
显示位置步骤之后,还包括:
在所述图片显示位置处加载预先设置的本地资源;
在根据所述图片资源的地址获取所述图片资源之后,将所述本地资源替换
为所述图片资源。
3.根据权利要求1所述的方法,其特征在于,所述根据所述图片资源的
地址获取所述图片资源,包括:
在包含多个图片资源时,分别根据图片资源的地址同时获取图片资源。
4.根据权利要求1或2所述的方法,其特征在于,所述根据所述图片资
源的地址获取所述图片资源,包括:
根据图片资源在网页框架中的图片显示位置,分别确定图片资源的图片显
示位置与网页框架顶端之间的距离值;
按照所述距离值从小到大的顺序加载图片资源。
5.根据权利要求1-3任一所述的方法,其特征在于,所述网页框架信息
包括网页文字信息和网页布局信息。
6.一种网页资源...

【专利技术属性】
技术研发人员:黄镇李磊杨井杨财智殳亚军杨翠花
申请(专利权)人:无锡天脉聚源传媒科技有限公司
类型:发明
国别省市:江苏;32

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

1