CN103279541B - 一种降低网页浏览器加载负载的方法及其装置 - Google Patents

一种降低网页浏览器加载负载的方法及其装置 Download PDF

Info

Publication number
CN103279541B
CN103279541B CN201310218933.3A CN201310218933A CN103279541B CN 103279541 B CN103279541 B CN 103279541B CN 201310218933 A CN201310218933 A CN 201310218933A CN 103279541 B CN103279541 B CN 103279541B
Authority
CN
China
Prior art keywords
label
page
load
assembly
shallow
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.)
Active
Application number
CN201310218933.3A
Other languages
English (en)
Other versions
CN103279541A (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.)
TIANJIN TIANAN YIHE INFORMATION TECHNOLOGY Co Ltd
Original Assignee
TIANJIN TIANAN YIHE INFORMATION 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 TIANJIN TIANAN YIHE INFORMATION TECHNOLOGY Co Ltd filed Critical TIANJIN TIANAN YIHE INFORMATION TECHNOLOGY Co Ltd
Priority to CN201310218933.3A priority Critical patent/CN103279541B/zh
Publication of CN103279541A publication Critical patent/CN103279541A/zh
Application granted granted Critical
Publication of CN103279541B publication Critical patent/CN103279541B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Landscapes

  • Information Transfer Between Computers (AREA)
  • Stored Programmes (AREA)

Abstract

本发明公开了一种降低网页浏览器加载负载的方法及其装置,包括:在主页面或者最先加载的标签中一次性统一加载第一框架与UI组件;通过工厂方法生成第二标签,并监听第二标签中加载页面完成的事件;当第二标签没有加载预设框架与界面组件时,构建与预设框架与UI组件相匹配的浅克隆对象;将浅克隆对象注入第二标签中的页面,获取第三标签,并修正第三标签中的页面;执行修正后第三标签加载页面的回调,生成浏览器中的页面。本发明减少了在新建<iframe>标签加载页面或者刷新页面时所需加载框架与UI组件的带宽及流量;减少这些对象的内存占用进而降低网页浏览器在加载JavaScript脚本及呈现前端动态效果时的负载。

Description

一种降低网页浏览器加载负载的方法及其装置
技术领域
本发明属于网络信息领域,涉及一种以网页浏览器为主要对象,致力于减少网站所耗带宽及流量、降低网页浏览器在加载JavaScript脚本及呈现前端动态效果时的负载,特别涉及一种降低网页浏览器加载负载的方法及其装置。
背景技术
随着互联网的普及以及用户体验的需要,越来越多的网站在建站过程中首先考虑的便是提供交互性更强的动态效果的同时满足大多数网页浏览器的兼容性;但是由于网页浏览器种类多样,版本纷繁复杂,所承载浏览器的设备不断更新,想要确保浏览器兼容性可谓难上加难。
网页动态交互效果的实现技术多种多样,而能给用户极佳体验的唯有JavaScript脚本一种,而JavaScript在不同浏览器之间的实现也不尽相同,加上网页设计师水平的参差不齐,就算使用JavaScript也不一定能达到预期的效果。为了解决这些问题,JavaScript框架与UI(界面组件,例如:按钮、下拉菜单、复选框、表格和窗口等)层出不穷,例如:JQuery、Dojo和ExtJs等等。
不论公众网站中还是在政务或办公自动化***中,<iframe>标签成为组织网页的一种重要形式,可以将整个网页拆解为多个部分,每个部分相互配合,交互,替换来实现一个网页应有的功能,简化网页设计以及提高重用性。
在这样一个用了大量JavaScript框架与UI组件的网站中每个<iframe>加载一次均要重新加载所需的JavaScript框架与UI组件,这带来了极高的网络开销及网页浏览器负载。
发明内容
本发明提供了一种降低网页浏览器加载负载的方法及其装置,本发明降低了网页浏览器的负载和网络开销,提高了使用效率,详见下文描述:
一种降低网页浏览器加载负载的方法,所述方法包括:
在主页面或者最先加载的标签中一次性统一加载第一JavaScript框架与UI组件;
通过工厂方法生成第二标签,并监听所述第二标签中加载页面完成的事件;
当所述第二标签没有加载预设JavaScript框架与界面组件时,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象;
将所述浅克隆对象注入所述第二标签中的页面,获取第三标签,并修正所述第三标签中的页面;
执行修正后第三标签加载页面的回调,生成浏览器中的页面。
所述当第二标签没有加载预设JavaScript框架与界面组件时,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象的过程具体为:
当所述第二标签加载页面完成后,判断所述第二标签是否已经加载了所述预设JavaScript框架与UI组件,如果是,流程结束,如果否,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象。
所述修正第三标签中的页面的过程具体为:修正与父页面中名称一样但是并不等同的对象或者类。
另,一种降低网页浏览器加载负载的方法,所述方法包括:
在主页面或者最先加载的标签中一次性统一加载第一JavaScript框架与UI组件;
通过工厂方法生成第二标签,并监听所述第二标签中加载页面完成的事件;
当所述第二标签没有加载预设JavaScript框架与界面组件时,修正第二标签中的页面,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象;
将所述浅克隆对象注入修正后第二标签中的页面,获取第三标签;
执行所述第三标签加载页面的回调,生成浏览器中的页面,流程结束。
所述当第二标签没有加载预设JavaScript框架与界面组件时,修正第二标签中的页面,构建与预设JavaScript框架与UI组件相匹配的浅克隆对象的过程具体为:
当所述第二标签加载页面完成后,判断所述第二标签是否已经加载了所述预设JavaScript框架与UI组件,如果是,流程结束,如果否,修正第二标签中的页面,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象。
所述修正第二标签中的页面的过程具体为:修正与父页面中名称一样但是并不等同的对象或者类。
另,一种降低网页浏览器加载负载的方法,所述方法包括:
在主页面或者最先加载的标签中一次性统一加载第一JavaScript框架与UI组件;
通过工厂方法生成第二标签,并监听所述第二标签中加载页面完成的事件;
当所述第二标签没有加载预设JavaScript框架与界面组件时,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象;修正第二标签中的页面;
将所述浅克隆对象注入修正后第二标签中的页面,获取第三标签;
执行所述第三标签加载页面的回调,生成浏览器中的页面,流程结束。
所述当第二标签没有加载预设JavaScript框架与界面组件时,构建与预设JavaScript框架与UI组件相匹配的浅克隆对象的过程具体为:
当所述第二标签加载页面完成后,判断所述第二标签是否已经加载了所述预设JavaScript框架与UI组件,如果是,流程结束,如果否,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象。
所述修正第二标签中的页面的过程具体为:修正与父页面中名称一样但是并不等同的对象或者类。
一种降低网页浏览器加载负载的装置,所述装置包括:
加载模块,用于在主页面或者最先加载的标签中一次性统一加载第一JavaScript框架与UI组件;
生成与监听模块,用于通过工厂方法生成第二标签,并监听所述第二标签中加载页面完成的事件;
构建与注入模块,用于当所述第二标签没有加载预设JavaScript框架与界面组件时,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象;将所述浅克隆对象注入所述第二标签中的页面;
修正和回调模块,执行修正后页面的回调,生成浏览器中的页面。
本发明提供的技术方案的有益效果是:本发明减少了在新建<iframe>标签加载页面或者刷新页面时所需加载JavaScript框架与UI组件的带宽及流量;减少这些对象的内存占用进而降低网页浏览器在加载JavaScript脚本及呈现前端动态效果时的负载;并且提供了统一的方式管理这些JavaScript框架与UI组件。
附图说明
图1为浅克隆对象和深克隆对象的示意图;
图2为降低网页浏览器加载负载的方法的第一流程图;
图3为降低网页浏览器加载负载的方法的第二流程图;
图4为降低网页浏览器加载负载的方法的第三流程图;
图5为降低网页浏览器加载负载的装置的第一结构示意图;
图6为降低网页浏览器加载负载的装置的第二结构示意图;
图7为降低网页浏览器加载负载的装置的第三结构示意图。
具体实施方式
为使本发明的目的、技术方案和优点更加清楚,下面对本发明实施方式作进一步地详细描述。
为了降低网页浏览器的负载和网络开销,提高使用效率,本发明实施例提供了一种降低网页浏览器加载负载的方法,本发明的主要工作就是在整个网页(网站)中确保每个JavaScript框架与UI组件在网页浏览器中只加载一次,并在其他<iframe>标签中均可互不干扰的使用这些组件,详见下文描述:
实施例1
101:在主页面或者最先加载的<iframe>标签中一次性统一加载第一JavaScript框架与UI组件;
即在主页面或者最先加载的<iframe>标签页面中统一加载所有用到的或者常用的JavaScript框架与UI组件,例如:Jquery和JQuery UI等,还可以为其他常用的或基本的框架和组件,本发明实施例对此不做限制。
其中,<iframe>标签元素可以作为文档中的文档,或浮动的框架,该标签为本领域技术人员所公知,本发明实施例对此不做赘述。
102:声明负责<iframe>标签生成的工厂方法,通过工厂方法生成第二<iframe>标签,并监听第二<iframe>标签中加载页面完成的(onload)事件;
在主页面或者最先加载的<iframe>标签中声明出构建<iframe>标签的工厂方法,网站中所有需要构建<iframe>标签的地方均调用该工厂方法构建,工厂方法为本领域技术人员所公知,本发明实施例对此具体工厂方法的选择不做限制,例如:
其中,工厂方法是定义一个创建产品对象的工厂接口,将实际创建工作推迟到子类当中,工厂方法是简单工厂模式的衍生,解决了许多简单工厂模式的问题。工厂方法是本领域的专业术语,本发明实施例对此不做赘述。
103:当第二<iframe>标签加载页面完成后,判断第二<iframe>标签是否已经加载了预设JavaScript框架与UI组件,如果是,流程结束,如果否,执行步骤104;
具体实现时,参见图2,该判断操作具体为:通过验证与预设JavaScript框架与UI组件所声明的对象(每个载入的框架或组件都会在页面中声明一个与之对应的对象,假设该页面需要某框架的对象A,若在<iframe>标签加载完成后发现该页面中还没有该对象A就说明需要注入)是否存在,若所声明的对象存在,表示已经加载了,不需要进行注入操作;相反,则表示没有加载,需要进行注入操作,即执行步骤104。
例如:预设JavaScript框架与UI组件为第一JavaScript框架与UI组件时,则不需要在进行注入操作,流程结束;否则,需要对第二<iframe>标签进行注入操作。
104:构建与预设JavaScript框架与UI组件相匹配的浅克隆对象;
参见图1,浅克隆对象相对于深克隆来说,属于简单的复制,构建浅克隆对象是为了最大限度的减少浏览器在存储对象时对内存的占用,浅克隆只构建与被克隆的本体一样的对象,而内部属性均引用自被克隆的本体,不需要消耗过多的内存,而深度克隆则会递归克隆该对象中所有的属性。浅克隆对象和深克隆对象为本领域技术人员所公知的技术术语,本发明实施例对此不做赘述。
具体实现时可以为:有选择的浅克隆JavaScript框架与UI组件及内部属性:为了确保框架间的隔离性,并不是所有的都需要克隆,这里需要根据不同的框架进行甄别,例如:根据JQuery的设计每个页面都会声明一个expando属性,该属性的值作为DOM(文档对象模型)元素的属性来保存DOM上注册的事件,该属性则不必克隆。
105:将浅克隆对象注入第二<iframe>标签中的页面,获取第三<iframe>标签;
其中,将浅克隆对象注入该第二<iframe>标签页面中使得所有JavaScript框架都会作为页面JavaScript的全局对象,而在浏览器中全局对象就是存在于window对象下的属性,所以可将浅克隆对象作为<iframe>标签加载的子页面中window对象的属性。
106:修正第三<iframe>标签中的页面,即修正与父页面中名称一样但是并不等同的对象或者类:
由于父页面与<iframe>标签中子页面存在隔离,父页面中的内建对象或者类(如:Date、Number、String、Array、Regexp类及undefined)上与<iframe>标签中子页面一致,但是判断相等性的时候会不等同,这里需要用父页面中的这些对象或者类替换掉<iframe>标签中子页面对应的对象或者类。例如:<iframe>加载页面中的Date(日期)、Number(数字)、String(字符串)、Array(数组)、Regexp(正则表达式)类及undefined(未定义)变量用主页面中对应的类及变量替换。
107:执行修正后第三<iframe>标签加载页面的回调,生成浏览器中的页面,流程结束。
由于父页面检测<iframe>标签中子页面加载完成的事件晚于子页面中原有回调机制中加载完成事件,在执行该事件时相应的框架及组件还没有注入,所以在完成注入后需要补充执行该事件所对应的回调。
其中,本发明实施例对步骤101和步骤102的执行顺序不做限制,即可以步骤101在前,也可以步骤102在前。
综上所述,通过上述7个步骤可以减少在新建<iframe>标签加载页面或者刷新页面时所需加载JavaScript框架与UI组件的带宽及流量;减少这些对象的内存占用进而降低网页浏览器在加载JavaScript脚本及呈现前端动态效果时的负载;并且提供了统一的方式管理这些JavaScript框架与UI组件。
实施例2
201:在主页面或者最先加载的<iframe>标签中一次性统一加载第一JavaScript框架与UI组件;
即在主页面或者最先加载的<iframe>标签页面中统一加载所有用到的或者常用的JavaScript框架与UI组件,例如:Jquery和JQuery UI等,还可以为其他常用的或基本的框架和组件,本发明实施例对此不做限制。
其中,<iframe>标签元素可以作为文档中的文档,或浮动的框架,该标签为本领域技术人员所公知,本发明实施例对此不做赘述。
202:声明负责<iframe>标签生成的工厂方法,通过工厂方法生成第二<iframe>标签,并监听第二<iframe>标签中加载页面完成的(onload)事件;
在主页面或者最先加载的<iframe>标签中声明出构建<iframe>标签的工厂方法,网站中所有需要构建<iframe>标签的地方均调用该工厂方法构建,该步骤的详细描述参见实施例1,本实施例对此不做赘述。
203:当第二<iframe>标签加载页面完成后,判断第二<iframe>标签是否已经加载了预设JavaScript框架与UI组件,如果是,流程结束,如果否,执行步骤204;
具体实现时,参见图3,该判断操作具体为:通过验证与预设JavaScript框架与UI组件所声明的对象(每个载入的框架或组件都会在页面中声明一个与之对应的对象,假设该页面需要某框架的对象A,若在<iframe>标签加载完成后发现该页面中还没有该对象A就说明需要注入)是否存在,若所声明的对象存在,表示已经加载了,不需要进行注入操作;相反,则表示没有加载,需要进行注入操作,即修正完第二<iframe>标签中的页面和构建浅克隆对象后,再执行步骤206。
例如:预设JavaScript框架与UI组件为第一JavaScript框架与UI组件时,则不需要在进行注入操作,流程结束;否则,需要对第二<iframe>标签进行注入操作。
204:修正第二<iframe>标签中的页面,即修正与父页面中名称一样但是并不等同的对象或者类:
由于父页面与<iframe>标签中子页面存在隔离,父页面中的内建对象或者类(如:Date、Number、String、Array、Regexp类及undefined)上与<iframe>标签中子页面一致,但是判断相等性的时候会不等同,这里需要用父页面中的这些对象或者类替换掉<iframe>标签中子页面对应的对象或者类。例如:<iframe>加载页面中的Date(日期)、Number(数字)、String(字符串)、Array(数组)、Regexp(正则表达式)类及undefined(未定义)变量用主页面中对应的类及变量替换。
205:构建与预设JavaScript框架与UI组件相匹配的浅克隆对象;
具体实现时可以为:有选择的浅克隆JavaScript框架与UI组件及内部属性:为了确保框架间的隔离性,并不是所有的都需要克隆,这里需要根据不同的框架进行甄别,例如:根据JQuery的设计每个页面都会声明一个expando属性,该属性的值作为DOM(文档对象模型)元素的属性来保存DOM上注册的事件,该属性则不必克隆。
206:将浅克隆对象注入修正后第二<iframe>标签中的页面,获取第三<iframe>标签;
其中,将浅克隆对象注入该第二<iframe>标签页面中使得所有JavaScript框架都会作为页面JavaScript的全局对象,而在浏览器中全局对象就是存在于window对象下的属性,所以可将浅克隆对象作为<iframe>标签加载的子页面中window对象的属性。
207:执行第三<iframe>标签加载页面的回调,生成浏览器中的页面,流程结束。
其中,实施例2中的执行步骤除特殊说明外,详细的操作步骤均和实施例1相同,请参考实施例1的操作步骤,本实施例对此不做赘述。
其中,本发明实施例对步骤201和步骤202的执行顺序不做限制,即可以步骤201在前,也可以步骤202在前。
综上所述,通过上述7个步骤可以减少在新建<iframe>标签加载页面或者刷新页面时所需加载JavaScript框架与UI组件的带宽及流量;减少这些对象的内存占用进而降低网页浏览器在加载JavaScript脚本及呈现前端动态效果时的负载;并且提供了统一的方式管理这些JavaScript框架与UI组件。
实施例3
301:在主页面或者最先加载的<iframe>标签中一次性统一加载第一JavaScript框架与UI组件;
即在主页面或者最先加载的<iframe>标签页面中统一加载所有用到的或者常用的JavaScript框架与UI组件,例如:Jquery和JQuery UI等,还可以为其他常用的或基本的框架和组件,本发明实施例对此不做限制。
其中,<iframe>标签元素可以作为文档中的文档,或浮动的框架,该标签为本领域技术人员所公知,本发明实施例对此不做赘述。
302:声明负责<iframe>标签生成的工厂方法,通过工厂方法生成第二<iframe>标签,并监听第二<iframe>标签中加载页面完成的(onload)事件;
在主页面或者最先加载的<iframe>标签中声明出构建<iframe>标签的工厂方法,网站中所有需要构建<iframe>标签的地方均调用该工厂方法构建,该步骤的详细描述参见实施例1,本实施例对此不做赘述。
303:当第二<iframe>标签加载页面完成后,判断第二<iframe>标签是否已经加载了预设JavaScript框架与UI组件,如果是,流程结束,如果否,执行步骤304;
具体实现时,参见图4,该判断操作具体为:通过验证与预设JavaScript框架与UI组件所声明的对象(每个载入的框架或组件都会在页面中声明一个与之对应的对象,假设该页面需要某框架的对象A,若在<iframe>标签加载完成后发现该页面中还没有该对象A就说明需要注入)是否存在,若所声明的对象存在,表示已经加载了,不需要进行注入操作;相反,则表示没有加载,需要进行注入操作,执行步骤304。
例如:预设JavaScript框架与UI组件为第一JavaScript框架与UI组件时,则不需要在进行注入操作,流程结束;否则,需要对第二<iframe>标签进行注入操作。
304:构建与预设JavaScript框架与UI组件相匹配的浅克隆对象;
具体实现时可以为:有选择的浅克隆JavaScript框架与UI组件及内部属性:为了确保框架间的隔离性,并不是所有的都需要克隆,这里需要根据不同的框架进行甄别,例如:根据JQuery的设计每个页面都会声明一个expando属性,该属性的值作为DOM(文档对象模型)元素的属性来保存DOM上注册的事件,该属性则不必克隆。
305:修正第二<iframe>标签中的页面,即修正与父页面中名称一样但是并不等同的对象或者类:
由于父页面与<iframe>标签中子页面存在隔离,父页面中的内建对象或者类(如:Date、Number、String、Array、Regexp类及undefined)上与<iframe>标签中子页面一致,但是判断相等性的时候会不等同,这里需要用父页面中的这些对象或者类替换掉<iframe>标签中子页面对应的对象或者类。例如:<iframe>加载页面中的Date(日期)、Number(数字)、String(字符串)、Array(数组)、Regexp(正则表达式)类及undefined(未定义)变量用主页面中对应的类及变量替换。
306:将浅克隆对象注入修正后第二<iframe>标签中的页面,获取第三<iframe>标签;
其中,将浅克隆对象注入修正后第二<iframe>标签页面中使得所有JavaScript框架都会作为页面JavaScript的全局对象,而在浏览器中全局对象就是存在于window对象下的属性,所以可将浅克隆对象作为<iframe>标签加载的子页面中window对象的属性。
307:执行第三<iframe>标签加载页面的回调,生成浏览器中的页面,流程结束。
其中,实施例3中的执行步骤除特殊说明外,详细的操作步骤均和实施例1相同,请参考实施例1的操作步骤,本实施例对此不做赘述。
其中,本发明实施例对步骤301和步骤302的执行顺序不做限制,即可以步骤301在前,也可以步骤302在前。
综上所述,通过上述7个步骤可以减少在新建<iframe>标签加载页面或者刷新页面时所需加载JavaScript框架与UI组件的带宽及流量;减少这些对象的内存占用进而降低网页浏览器在加载JavaScript脚本及呈现前端动态效果时的负载;并且提供了统一的方式管理这些JavaScript框架与UI组件。
实施例4
一种降低网页浏览器加载负载的装置,参见图5,该装置包括:
加载模块,用于在主页面或者最先加载的标签中一次性统一加载第一JavaScript框架与UI组件;
生成与监听模块,用于通过工厂方法生成第二标签,并监听第二标签中加载页面完成的事件;
构建与注入模块,用于当第二标签没有加载预设JavaScript框架与界面组件时,构建与预设JavaScript框架与UI组件相匹配的浅克隆对象;将浅克隆对象注入第二标签中的页面,获取第三标签;
修正和回调模块,执行修正后第三标签加载页面的回调,生成浏览器中的页面。
本实施例的降低网页浏览器加载负载的装置可以执行图2所示方法实施例的技术方案,其实现原理相类似,此处不再赘述。
综上所述,通过该装置可以减少在新建<iframe>标签加载页面或者刷新页面时所需加载JavaScript框架与UI组件的带宽及流量;减少这些对象的内存占用进而降低网页浏览器在加载JavaScript脚本及呈现前端动态效果时的负载;并且提供了统一的方式管理这些JavaScript框架与UI组件。
实施例5
一种降低网页浏览器加载负载的装置,参见图6,该装置包括:
加载模块,用于在主页面或者最先加载的标签中一次性统一加载第一JavaScript框架与UI组件;
生成与监听模块,用于通过工厂方法生成第二标签,并监听第二标签中加载页面完成的事件;
修正与构建模块,用于当第二标签没有加载预设JavaScript框架与界面组件时,修正第二标签中的页面,构建与预设JavaScript框架与UI组件相匹配的浅克隆对象;
注入模块,用于将浅克隆对象注入修正后第二标签中的页面,获取第三标签;
回调与生成模块,用于执行第三标签加载页面的回调,生成浏览器中的页面。
本实施例的降低网页浏览器加载负载的装置可以执行图3所示方法实施例的技术方案,其实现原理相类似,此处不再赘述。
综上所述,通过该装置可以减少在新建<iframe>标签加载页面或者刷新页面时所需加载JavaScript框架与UI组件的带宽及流量;减少这些对象的内存占用进而降低网页浏览器在加载JavaScript脚本及呈现前端动态效果时的负载;并且提供了统一的方式管理这些JavaScript框架与UI组件。
实施例6
一种降低网页浏览器加载负载的装置,参见图7,该装置包括:
加载模块,用于在主页面或者最先加载的标签中一次性统一加载第一JavaScript框架与UI组件;
生成与监听模块,用于通过工厂方法生成第二标签,并监听第二标签中加载页面完成的事件;
构建与修正模块,用于当第二标签没有加载预设JavaScript框架与界面组件时,构建与预设JavaScript框架与UI组件相匹配的浅克隆对象;修正第二标签中的页面;
注入模块,用于将浅克隆对象注入修正后第二标签中的页面,获取第三标签;
回调与生成模块,用于执行第三标签加载页面的回调,生成浏览器中的页面。
本实施例的降低网页浏览器加载负载的装置可以执行图4所示方法实施例的技术方案,其实现原理相类似,此处不再赘述。
综上所述,通过该装置可以减少在新建<iframe>标签加载页面或者刷新页面时所需加载JavaScript框架与UI组件的带宽及流量;减少这些对象的内存占用进而降低网页浏览器在加载JavaScript脚本及呈现前端动态效果时的负载;并且提供了统一的方式管理这些JavaScript框架与UI组件。
下面以Jquery及jQuery UI为例详细说明降低网页浏览器加载负载的方法及其装置的工作过程:
首先在主页面中加载Jquery及jQuery UI对应的jquery.js以及jquery-ui.js。
接下来通过Jquery的扩展机制替换其中生成<iframe>标签,在原有基础上为<iframe>标签增加监听。这样所有通过Jquery生成的<iframe>标签均有该监听。
在<iframe>标签加载页面完成后判断新加载的页面是否已经加载了需要的JavaScript框架与UI组件,若没有加载则执行注入操作,否则结束;
通过jQuery中jQuery.sub()函数可以克隆出一份jQuery;
将克隆出的jQuery对象分别设置为<iframe>标签中window对象的$及jQuery属性;
将<iframe>标签中的Date、Number、String、Array、Regexp类及undefined变量用主页面中对应的类及变量替换;
执行<iframe>标签中对应页面加载完成后回调的代码。
经过以上7个步骤后<iframe>标签中即呈现出使用jQuery及jQuery ui的效果。
本领域技术人员可以理解附图只是一个优选实施例的示意图,上述本发明实施例序号仅仅为了描述,不代表实施例的优劣。
以上所述仅为本发明的较佳实施例,并不用以限制本发明,凡在本发明的精神和原则之内,所作的任何修改、等同替换、改进等,均应包含在本发明的保护范围之内。

Claims (7)

1.一种降低网页浏览器加载负载的方法,其特征在于,所述方法包括:
在主页面或者最先加载的标签中一次性统一加载第一JavaScript框架与UI组件;
通过工厂方法生成第二标签,并监听所述第二标签中加载页面完成的事件;
当所述第二标签没有加载预设JavaScript框架与界面组件时,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象;
将所述浅克隆对象注入所述第二标签中的页面,获取第三标签,并修正所述第三标签中的页面;
执行修正后第三标签加载页面的回调,生成浏览器中的页面;
其中,最先加载的标签、第二标签和第三标签均指<iframe>标签;
所述修正所述第三标签中的页面的过程具体为:
修正与父页面中名称一样但是并不等同的对象或者类。
2.根据权利要求1所述的一种降低网页浏览器加载负载的方法,其特征在于,所述当第二标签没有加载预设JavaScript框架与界面组件时,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象的过程具体为:
当所述第二标签加载页面完成后,判断所述第二标签是否已经加载了所述预设JavaScript框架与UI组件,如果是,流程结束,如果否,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象。
3.一种降低网页浏览器加载负载的方法,其特征在于,所述方法包括:
在主页面或者最先加载的标签中一次性统一加载第一JavaScript框架与UI组件;
通过工厂方法生成第二标签,并监听所述第二标签中加载页面完成的事件;
当所述第二标签没有加载预设JavaScript框架与界面组件时,修正第二标签中的页面,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象;
将所述浅克隆对象注入修正后第二标签中的页面,获取第三标签;
执行所述第三标签加载页面的回调,生成浏览器中的页面,流程结束;
其中,最先加载的标签、第二标签和第三标签均指<iframe>标签;
所述修正第二标签中的页面的过程具体为:修正与父页面中名称一样但是并不等同的对象或者类。
4.根据权利要求3所述的一种降低网页浏览器加载负载的方法,其特征在于,所述当第二标签没有加载预设JavaScript框架与界面组件时,修正第二标签中的页面,构建与预设JavaScript框架与UI组件相匹配的浅克隆对象的过程具体为:
当所述第二标签加载页面完成后,判断所述第二标签是否已经加载了所述预设JavaScript框架与UI组件,如果是,流程结束,如果否,修正第二标签中的页面,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象。
5.一种降低网页浏览器加载负载的方法,其特征在于,所述方法包括:
在主页面或者最先加载的标签中一次性统一加载第一JavaScript框架与UI组件;
通过工厂方法生成第二标签,并监听所述第二标签中加载页面完成的事件;
当所述第二标签没有加载预设JavaScript框架与界面组件时,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象;修正第二标签中的页面;
将所述浅克隆对象注入修正后第二标签中的页面,获取第三标签;
执行所述第三标签加载页面的回调,生成浏览器中的页面,流程结束;
其中,最先加载的标签、第二标签和第三标签均指<iframe>标签;
所述修正第二标签中的页面的过程具体为:修正与父页面中名称一样但是并不等同的对象或者类。
6.根据权利要求5所述的一种降低网页浏览器加载负载的方法,其特征在于,所述当第二标签没有加载预设JavaScript框架与界面组件时,构建与预设JavaScript框架与UI组件相匹配的浅克隆对象的过程具体为:
当所述第二标签加载页面完成后,判断所述第二标签是否已经加载了所述预设JavaScript框架与UI组件,如果是,流程结束,如果否,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象。
7.一种降低网页浏览器加载负载的装置,其特征在于,所述装置包括:
加载模块,用于在主页面或者最先加载的标签中一次性统一加载第一JavaScript框架与UI组件;
生成与监听模块,用于通过工厂方法生成第二标签,并监听所述第二标签中加载页面完成的事件;
构建与注入模块,用于当所述第二标签没有加载预设JavaScript框架与界面组件时,构建与所述预设JavaScript框架与UI组件相匹配的浅克隆对象;将所述浅克隆对象注入所述第二标签中的页面;
修正和回调模块,执行修正后页面的回调,生成浏览器中的页面;
其中,最先加载的标签、第二标签均指<iframe>标签。
CN201310218933.3A 2013-06-04 2013-06-04 一种降低网页浏览器加载负载的方法及其装置 Active CN103279541B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201310218933.3A CN103279541B (zh) 2013-06-04 2013-06-04 一种降低网页浏览器加载负载的方法及其装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201310218933.3A CN103279541B (zh) 2013-06-04 2013-06-04 一种降低网页浏览器加载负载的方法及其装置

Publications (2)

Publication Number Publication Date
CN103279541A CN103279541A (zh) 2013-09-04
CN103279541B true CN103279541B (zh) 2016-08-31

Family

ID=49062060

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201310218933.3A Active CN103279541B (zh) 2013-06-04 2013-06-04 一种降低网页浏览器加载负载的方法及其装置

Country Status (1)

Country Link
CN (1) CN103279541B (zh)

Families Citing this family (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN104239407B (zh) * 2014-07-31 2018-06-08 小米科技有限责任公司 一种显示网页的方法和装置
CN104866347A (zh) * 2015-05-22 2015-08-26 国云科技股份有限公司 一种动态加载js和css文件的方法
CN105117234B (zh) * 2015-09-16 2019-04-09 北京金和网络股份有限公司 一种web控件组合方法
CN105930392A (zh) * 2016-04-15 2016-09-07 北京思特奇信息技术股份有限公司 一种基于消息传输的跨域iframe高度自适应方法及其***
CN108345507B (zh) * 2017-01-22 2022-01-07 腾讯科技(深圳)有限公司 一种JS模块与Java模块之间的通信方法及装置
CN109460253A (zh) * 2018-11-12 2019-03-12 郑州云海信息技术有限公司 基于iframe实现***文件版本控制的方法及装置
CN110597738B (zh) * 2019-09-19 2023-09-12 浪潮软件集团有限公司 一种内存释放方法、终端及计算机可读存储介质
CN112597408B (zh) * 2020-12-28 2023-08-04 恒生电子股份有限公司 一种***融合方法、装置、设备和存储介质

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN1609792A (zh) * 2003-10-24 2005-04-27 微软公司 计算机程序的编程接口
CN1987851A (zh) * 2005-12-22 2007-06-27 腾讯科技(深圳)有限公司 一种网页数据的更新显示方法
CN101706821A (zh) * 2009-12-10 2010-05-12 中兴通讯股份有限公司 基于标签的移动互联网页面设计***及方法
CN102915371A (zh) * 2012-11-02 2013-02-06 上海够快网络科技有限公司 在网页中动态引用文件的方法

Family Cites Families (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US8516360B2 (en) * 2011-08-24 2013-08-20 Qualcomm Innovation Center, Inc. Controlled parallel compilation and execution of JavaScripts

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN1609792A (zh) * 2003-10-24 2005-04-27 微软公司 计算机程序的编程接口
CN1987851A (zh) * 2005-12-22 2007-06-27 腾讯科技(深圳)有限公司 一种网页数据的更新显示方法
CN101706821A (zh) * 2009-12-10 2010-05-12 中兴通讯股份有限公司 基于标签的移动互联网页面设计***及方法
CN102915371A (zh) * 2012-11-02 2013-02-06 上海够快网络科技有限公司 在网页中动态引用文件的方法

Also Published As

Publication number Publication date
CN103279541A (zh) 2013-09-04

Similar Documents

Publication Publication Date Title
CN103279541B (zh) 一种降低网页浏览器加载负载的方法及其装置
US9785637B2 (en) System and method for computing, applying, and displaying document deltas
CN104410667B (zh) 一种xml报文到json报文的转换方法及***
CN108572819A (zh) 页面更新方法、装置、终端及计算机可读存储介质
CN105630902A (zh) 一种渲染和增量更新网页的方法
WO2018126023A1 (en) Methods and systems for server-side rendering of native content for presentation
CN105677654B (zh) 广告过滤方法及装置
EP2903241A1 (en) Compression of serialized data for communication from a client-side application
CN106293664A (zh) 代码生成方法及装置
CN103631578B (zh) 一种配电网自动化***中数据展示方法
CN103823796A (zh) 一种翻译***及翻译方法
CN112100550A (zh) 一种页面构建方法和装置
CN102831190B (zh) 一种在低端设备上浏览cml文件的方法
CN107122398B (zh) 一种数据展示图表生成方法及***
CN102236709A (zh) 一种基于Flex的监控页面显示方法及***
CN107908793A (zh) 网页弹窗的方法及***
CN111897619A (zh) 浏览器页面的显示方法、装置、电子设备及存储介质
CN104517307A (zh) 一种动画制作方法和装置
CN105975268A (zh) 一种用于pc端信息***网页界面的宽度自适应的方法
US10671801B2 (en) Markup code generator
CN105069092A (zh) 一种报表展示的方法、***及移动终端
CN106294760A (zh) 表单处理方法及服务器、客户端
CN113822033B (zh) 报表的生成方法、装置、设备以及存储介质
CN102314468A (zh) 一种同步浏览的方法
CN105279032B (zh) 一种同步接口报文与javaBean的方法及装置

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
C10 Entry into substantive examination
SE01 Entry into force of request for substantive examination
C14 Grant of patent or utility model
GR01 Patent grant