CN105278977A - Web parts loading method and apparatus - Google Patents
Web parts loading method and apparatus Download PDFInfo
- Publication number
- CN105278977A CN105278977A CN201410334015.1A CN201410334015A CN105278977A CN 105278977 A CN105278977 A CN 105278977A CN 201410334015 A CN201410334015 A CN 201410334015A CN 105278977 A CN105278977 A CN 105278977A
- Authority
- CN
- China
- Prior art keywords
- webpage
- event
- loading
- load
- web pages
- 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
Abstract
Embodiments of the application provide a web parts loading method and apparatus. The method comprises: when receiving a monitoring instruction for a webpage, judging whether a current user is an active user or not according to the monitoring instruction; if so, loading web parts in the webpage; and if not, loading the web parts in the webpage at a preset time point. According to the embodiments of the application, when the current user is the active user, the web parts are instantly loaded to ensure diversification and convenience of webpage functions and user experience of user groups with relatively high web part demands; and when the current user is not the active user, the web parts are loaded in a delay manner at the preset time point, so that more browser system resources and bandwidth resources are provided, a webpage main body is loaded, the scramble for resources for loading the web parts and the webpage main body is avoided, the loading speed of the webpage main body is increased, the loading time of the webpage main body is shortened, and the loading efficiency of the webpage is improved.
Description
Technical field
The application relates to the technical field of browser, particularly relates to a kind of loading method of web pages component and a kind of charger of web pages component.
Background technology
The fast development of Internet technology has brought people into the information society epoch, and create deep effect to people's life, people can get the information of magnanimity on internet in every way, with the demand of each side such as satisfied life, work, study.
Wherein, user can by the various information on browser rapidly and easily view Internet.Browser is the file in a display web page server or archives economy, and allows a kind of application program of user and this file interaction.The word in network, image and other information can be shown in a browser, and these words or image, can be the hyperlink connecting other network address.
Conveniently user carries out web page browsing, often can add the web pages component of expanded function in webpage.Such as, in certain webpage, this assembly can comprise toolbar, and this toolbar user can show user profile, the object of user's concern, information of server push etc.
But the web pages component of expanded function brings easily simultaneously to user, also brings the decline in performance to webpage.Such as, the size of above-mentioned toolbar is generally at about 200k, and the size of above-mentioned webpage itself is at about 400k, the time namely loading above-mentioned webpage and toolbar, than the time lengthening about 50% loading above-mentioned webpage, causes larger impact on webpage in representing of shielding of head.
In addition, the resource of web pages component own is larger, when webpage loads, the quantity of request resource is also a lot, and the parallel join number of browser is limited, and the network bandwidth is also limited, when user's request of loading webpage, be in the relation of vying each other between multiple request, ask more, need the resource of loading larger, compete with regard to Shaoxing opera strong between request, the loading velocity of final whole webpage can degradation.
Therefore, the technical matters needing those skilled in the art urgently to solve at present is exactly: the load mechanism how proposing a kind of web pages component, to ensure the loading of web pages component, improves the overall loading efficiency of webpage.
Summary of the invention
The embodiment of the present application technical matters to be solved is to provide a kind of loading method of web pages component, to ensure the loading of web pages component, improves the overall loading efficiency of webpage.
Accordingly, the embodiment of the present application additionally provides a kind of charger of web pages component, in order to ensure the implementation and application of said method.
In order to solve the problem, the embodiment of the present application discloses a kind of loading method of web pages component, comprising:
When receiving the monitoring instruction for webpage, judge whether active user is any active ues according to described monitoring instruction;
If so, the web pages component in described webpage is then loaded;
If not, then the web pages component in described webpage is loaded at the time point preset.
Preferably, described default time point comprises:
After detecting that webpage main body has loaded event, the time point of interval first Preset Time;
And/or,
After starting to load described webpage, the time point of interval second Preset Time.
Preferably, describedly monitor instruction judge that whether active user is that the step of any active ues comprises according to described:
Judge the Action Events of specifying whether detected in loaded described webpage;
If so, then judge that active user is as any active ues;
If not, then judge that active user is as inactive users.
Preferably, described Action Events of specifying comprises at least one in the mouse action event of specifying, the keyboard operation event of specifying and the touch-control event of specifying.
Preferably, described mouse action event comprises at least one in mouse moving event, mouse click event and mouse roller slip event;
Described keyboard operation event comprises at least one in keyboard letter key click event, keyboard digital key click event, keyboard symbol key click event and keyboard direction click event;
Described touch-control event of specifying comprises touch event.
Preferably, the step of the web pages component in the described webpage of described loading comprises:
When detecting that webpage main body has loaded event, start to load the web pages component in described webpage.
The embodiment of the present application also discloses a kind of charger of web pages component, comprising:
According to described monitoring instruction, judge module, for when receiving the monitoring instruction for webpage, judges whether active user is any active ues; If so, the first load-on module is then called; If not, then the second load-on module is called;
First load-on module, for loading the web pages component in described webpage;
Second load-on module, for loading the web pages component in described webpage at the time point preset.
Preferably, described default time point comprises:
After detecting that webpage main body has loaded event, the time point of interval first Preset Time;
And/or,
After starting to load described webpage, the time point of interval second Preset Time.
Preferably, described judge module comprises:
Running time judges submodule, for judging the Action Events of specifying whether detected in loaded described webpage; If so, the first judgement submodule is then called; If not, then the second judgement submodule is called;
First judges submodule, for judging that active user is any active ues;
Second judges submodule, for judging that active user is inactive users.
Preferably, described Action Events of specifying comprises at least one in the mouse action event of specifying, the keyboard operation event of specifying and the touch-control event of specifying.
Preferably, described mouse action event comprises at least one in mouse moving event, mouse click event and mouse roller slip event;
Described keyboard operation event comprises at least one in keyboard letter key click event, keyboard digital key click event, keyboard symbol key click event and keyboard direction click event;
Described touch-control event of specifying comprises touch-control click event.
Preferably, described first load-on module comprises:
Sequence loads submodule, for when detecting that webpage main body has loaded event, starts to load the web pages component in described webpage.
Compared with background technology, the embodiment of the present application comprises following advantage:
The embodiment of the present application when receiving the load request of webpage, by the Loading opportunity of the condition selecting web pages component of active user.On the one hand, when active user is any active ues, then Web page loading assembly immediately, to ensure variation, the facilitation of webpage function, ensures the Consumer's Experience of the user group that web pages component demand is stronger; On the other hand, when active user is inactive users, the time point then preset, time delay Web page loading assembly, to provide more browser resource, bandwidth resources, for Web page loading main body, avoid the resource of Web page loading assembly and Web page loading main body to fight for, accelerate the loading velocity of webpage main body, decrease the load time of webpage main body, improve the loading efficiency of webpage, the impact that the loading decreasing web pages component loads webpage main body.
The embodiment of the present application is after webpage main body has loaded event, the time point Web page loading assembly of interval first Preset Time, to provide more browser resource, bandwidth resources, for the treatment of asynchronous interface, avoid the resource of Web page loading assembly and process asynchronous interface to fight for, accelerate the loading velocity of asynchronous interface, decrease the load time of asynchronous interface, further increase the loading efficiency of webpage, ensure that the operation of webpage normal function.
The embodiment of the present application is after starting to load described webpage, the time point Web page loading assembly of interval second Preset Time, make to load at web page resources to run into failure or time-out or some other abnormal situation, cannot trigger web pages main body when having loaded event, Web page loading assembly within the acceptable time, ensure that the operation of webpage normal function.
Accompanying drawing explanation
Fig. 1 is the flow chart of steps of the loading method embodiment of a kind of web pages component of the application;
Fig. 2 is the structured flowchart of the charger embodiment of a kind of web pages component of the application.
Embodiment
For enabling above-mentioned purpose, the feature and advantage of the application more become apparent, below in conjunction with the drawings and specific embodiments, the application is described in further detail.
When webpage loads, usually can adopt lazy load mode, namely when user's roll screen browses webpage, when web page element (such as, word, picture etc.) appears in the visible range of user time, carry out the loading of web page element.Web pages component (such as, above-mentioned toolbar) shield loading at head, and traditional lazy load mode is only suitable for the loading for web page element outside non-head screen, therefore, lazy load mode is just inapplicable in this scene belonged in first screen of web pages component (such as, toolbar).
And general time delay load mode, such as, webpage loaded 5 seconds after Web page loading assembly (such as toolbar), but, a lot of user will leave current web page in 5 seconds, caused user just to can't see web pages component (such as, toolbar) at all.
Therefore, one of core idea of the embodiment of the present application is proposed, by obtaining the state of the operation judges of user in loaded webpage, then according to the opportunity that the state of user selects web pages component to load.
With reference to Fig. 1, it illustrates the flow chart of steps of the loading method embodiment of a kind of web pages component of the application, specifically can comprise the steps:
According to described monitoring instruction, step 101, when receiving the monitoring instruction for webpage, judges whether active user is any active ues; If so, then step 102 is performed; If not, then step 103 is performed;
In specific implementation, monitoring instruction can for monitoring the instruction of the middle allocate event of webpage.
In a preferred embodiment of the present application, this monitoring instruction can be the load request of webpage, when namely receiving the load request of webpage, is equivalent to the monitoring received for webpage and indicates.
The load request of webpage can refer to the instruction of certain webpage of loading that user sends.Such as, user can load a webpage by clicking certain linking request, or carrys out request of loading webpage etc. in address field input network address.When user clicks certain link, be just equivalent to the load request that have received user's Web page loading; Equally, when inputting certain network address at address field and clicking confirming button or press enter key, be also equivalent to the load request that have received user's Web page loading.
Wherein, the content of load request can comprise the mark of the webpage of user's request of loading and/or the feature of webpage.Banner can be the information that can represent a well-determined webpage, such as Uniform Resource Identifier (UniformResourceIdentifier, URI), Uniform Resource Identifier specifically can comprise URL(uniform resource locator) (UniformResourceLocator again, URL), or uniform resource name (UniformResourceName, URN) etc.
In a preferred embodiment of the present application, this monitoring indicates the instruction that can send for webpage.Namely can detect the operation of user by the decision when of webpage own, judge whether active user is any active ues.
Such as, in certain webpage, affect to not allow the such web pages component of such as toolbar and such as buy representing of other web pages component such as control, after can being disposed such as buying other web pages component such as control in the web page, start the operation detecting user again, judge whether active user is any active ues, thus ensure the preferential also rapid loading of important content.
In a preferred embodiment of the present application, step 101 can comprise following sub-step:
Sub-step S11, judges the Action Events of specifying whether detected in loaded described webpage; If so, then sub-step S12 is performed; If not, then sub-step S13 is performed;
After receiving the load request of webpage in a browser, browser can pass through DNS (DomainNameSystem, domain name analysis system) resolve IP (InternetProtocol, the agreement interconnected between the network) address of searching the domain name (DomainName) in this webpage URL and mapping.After the success of acquisition IP address, browser can connect to the server request at this place, IP address.After the server successfully connecting this place, IP address, browser end can by request header information by the request of HTTP (Hypertexttransferprotocol, HTTP) agreement to the server initiation webpage loading at this place, IP address.This server receive this request after etc. pending, the most backward browser end returns response.
Now, under http protocol, browser can receive the document of HTML (HypertextMarkupLanguage, HTML (Hypertext Markup Language)) type from server.Browser can resolve html document, generates the object of tree structure, i.e. DOM (DocumentObjectModel, document dbject model), each node to liking on DOM, and these objects can represent the web page resources such as word, picture.Browser can start to show this html document, and obtains the address of wherein embedded web page resources, and then browser is initiated request to server again and obtained these web page resources, and shows in the html document of browser.
In the embodiment of the present application, the state of the operation judges obtaining user in loaded webpage can be passed through, then according to the opportunity that the state of user selects web pages component to load.
It should be noted that, in the webpage loaded when needing to obtain focus listen to the operation of user, can judge it is effective, otherwise, can judge it is invalid.
Such as, some browser is provided with the function of Shipping Options Page, when namely opening the webpage with web pages component by current web page click, carries out loading the webpage with web pages component on new labels page backstage.And the still current web page of browser display, be not the webpage with web pages component, and now user can carry out mouse, keyboard operation at current web page, now can listen to mouse, keyboard operation.But, can think that mouse, keyboard operation are invalid, the opportunity namely web pages component will being selected to load according to this mouse, keyboard operation.
In a kind of preferred exemplary of the embodiment of the present application, described Action Events of specifying can comprise at least one in the mouse action event of specifying, the keyboard operation event of specifying and the touch-control event of specifying.
Mouse (Mouse) is a kind of input equipment for carrying out input operation in the electronic device, mouse can position the vernier on current electronic device screen, and by button (generally can comprise left button and right button) and pair of rollers vernier the screen elements through position operate.
When user adopts mouse to operate, mouse action event can be there is.
Keyboard is also a kind of input equipment for carrying out input operation in the electronic device, the keyswitch that keyboard can be assembled together by array way by one group forms, often be just equivalent to connect corresponding on-off circuit by next button, the code of this button is transferred in electronic equipment by interface circuit.
When user adopts keyboard to operate, keyboard operation event can be there is.
It should be noted that to have the equipment of Touch Screen, such as, mobile phone, panel computer, personal digital assistant etc., although use is dummy keyboard, can trigger keyboard operation event equally.
When user operates Touch Screen, the touch-control event that can specify.Wherein, described mouse action event can comprise at least one in mouse moving event, mouse click event and mouse roller slip event;
When user's rolling mouse, mouse moving event can be there is; When the button that user clicks the mouse, mouse click event can be there is; When the roller of user's roll mouse, mouse roller slip event can be there is.
Described keyboard operation event can comprise at least one in keyboard letter key click event, keyboard digital key click event, keyboard symbol key click event and keyboard direction click event.
When user puts letter key (such as, A-Z is totally 26 letter keys) of beating keyboard, keyboard letter key click event can be there is; When user puts numerical key (such as, 0-9 is totally 10 letter keys) of beating keyboard, keyboard digital key click event can be there is; When user puts symbolic key (such as, pause mark ", ", comma, " etc.) of beating keyboard, keyboard symbol key click event can be there is; When user puts directionkeys (such as, upwarding key " ↑ ", left key " ← ", right key " → ", down Arrow " ↓ ") of beating keyboard, keyboard direction click event can be there is.
Described touch-control event of specifying can comprise touch event.
Similar with the click of mouse, when Touch Screen is clicked, corresponding touching (touch) event can be there is.
The Basic API (ApplicationProgrammingInterface, application programming interface) that the Action Events that detection is specified can be provided by browser realizes.Specifically, can when webpage start to load, the Basic API that calling browser provides carrys out the operation of monitoring users.
Such as, import into as minor function realizes the detection of mouse moving event in the Basic API that can provide at browser:
Document.body.addEventListener (' mousemove ', function () { ' user has clicking operation ' })
When user's rolling mouse time, will trigger above-mentioned function, this function can detect and there occurs mouse moving event.
Certainly, just exemplarily, when implementing the embodiment of the present application, can arrange other Action Events of specifying according to actual conditions, the embodiment of the present application is not limited this above-mentioned Action Events of specifying.In addition, except above-mentioned Action Events of specifying, the Action Events that those skilled in the art can also adopt other to specify according to actual needs, the embodiment of the present application is not also limited this.
In addition, those skilled in the art can also adopt different functions to detect according to different Action Events, the embodiment of the present application does not describe in detail one by one at this.
In the embodiment of the present application, user can be divided at least two classes, a class is any active ues, is namely in the user of active state, and the operation of this user to webpage is many.Another kind of is inactive users, is namely in the user of an inactive state, and the operation of this user to webpage is fewer.
For making those skilled in the art understand the embodiment of the present application better, in this manual, be described for the webpage of certain ecommerce (ElectronicCommerce, EC) website.User enters the webpage of this e-commerce website, and three operations that implementation rate is the highest are search commercial articles respectively, the commodity checking to have bought and roll screen browse webpage.
For this operation of search commercial articles, in the ordinary course of things, user needs to click search box, and after this search box obtains focus, in this search box, occur cursor, now user can input text information search in the search box.In this case, can mouse action be triggered at the beginning, mouse action event occur, i.e. mouse click event.
In another kind of situation, this search box obtains focus when loading, and user can directly be searched for by input through keyboard text message.In this case, user can trigger keyboard operation at the beginning, there is keyboard operation event, and the text message of user's input can be word, letter, numeral or symbol etc., accordingly, keyboard operation event occurs can keyboard letter key click event, keyboard digital key click event, keyboard symbol key click event etc.
For checking this operation of commodity bought, the webpage of this e-commerce website can provide a function button, user by mouse-over (hover) on this function button, trigger this function button and show different options, and one of them option can the commodity bought of indicating user, user clicks this option and can jump to other webpages and view the commodity bought.In this case, user can trigger mouse action at the beginning, mouse action event occurs, i.e. mouse moving event.
This operation of webpage is browsed for roll screen, rolling event (scroll) can be there is in browser, may be undertaken operating by the roller of mouse, may be after rolling mouse rolls bar to webpage, then the left button of mouse is pinned, what drag this webpage rolls that bar realizes, and also may be undertaken operating by the key up and down of keyboard (directionkeys wherein a kind of).In this case, user may trigger mouse action at the beginning, mouse action event occurs, i.e. mouse roller event or mouse moving event.User also may trigger keyboard operation at the beginning, and keyboard operation event occurs, and namely keyboard direction click event (keydown/keyup, downwards/upwards) realizes.
It should be noted that, can there be different major functions different websites, and user can have different, that implementation rate is the highest one or more operations in different websites.Those skilled in the art can monitor the different Action Events of specifying according to the actual conditions of website, and to judge that whether active user is for any active ues, the embodiment of the present application does not describe in detail one by one at this.
Sub-step S12, judges that active user is as any active ues;
If the Action Events of specifying is triggered, can represent that active user employs the major function of this webpage after Web page loading, then can think that this user is in active state, be any active ues.
Sub-step S13, judges that active user is as inactive users.
If the operation of specifying is not triggered, can represent the function that active user does not use this webpage main after Web page loading, then can think that this user is in an inactive state, be inactive users.
Step 102, loads the web pages component in described webpage;
Web pages component can be the code collection of the certain function of complete independently, and web pages component independent of initial html document, but can still belong to a part for webpage main body, and it generally carries function important in website, and the importance degree in website is higher.
Such as, in the webpage of above-mentioned e-commerce website, web pages component can comprise toolbar, this toolbar may be used for showing the assets information of user, the brand, action message, shopping history etc. of user's concern, facilitates user can view the important information relevant to oneself at any one webpage of this e-commerce website.
In the angle of consumer, this toolbar can provide personalized shopping guide path for consumer, promotes consumer's purchase experiences and shopping efficiency.
In the angle of platform, this toolbar can widen the shopping guide path of commodity, the concatenation ability of strengthening and consumer, lifting platform shunting efficiency.
In the angle of businessman, this toolbar can do more directed recommendation according to consumer attributes (size, Brang Preference etc.), promotes the degree of depth of user's access and the conversion ratio of commodity purchasing.
In the angle of business, this toolbar can realize the expression of personalized recommendation in commodity shopping guide path.Such as, user can see in advertising campaign period at toolbar, obtains how many reward vouchers and red packet, and provides the entrance of correlated activation, promotes flow intercommunication.
Any active ues needs stronger to the web pages component of website, therefore for any active ues, can load this web pages component immediately, to ensure variation, the facilitation of webpage function, ensures Consumer's Experience.
In the process of Web page loading assembly, one section of JavaScript (a kind of literal translation formula script can be loaded, be commonly used to add dynamic function to html web page, such as respond the various operations of user) file, CSS (the CascadingStyleSheets that web pages component relies on is maintained in this JavaScript file, cascading style list, the accurate control of Pixel-level can be carried out to the position typesetting of the object in webpage) file and html document fragment, and other assemblies that may rely on.Then these contents are inserted in webpage html document, after having inserted, perform initialization logic, finally show user.
Web pages component is normally made up of html document fragment, CSS file and JavaScript file, because web pages component is can the certain function of complete independently, so be all separate with webpage main body to load usually, but finally still can be inserted in the <body> label of webpage html document.
In a preferred embodiment of the present application, step 102 can comprise following sub-step:
Sub-step S21, when listening to webpage main body and having loaded event, starts to load the web pages component in described webpage.
Webpage main body can, for specifying the content that will load and show in webpage html document, can be the web page resources in webpage html document in <body> label usually.<body> label can define the main body of html document, can comprise the visible main contents of user (such as text, hyperlink, image, form and list etc.) in html document in <body> label.
Browser can provide webpage main body to load event, i.e. window.load event, represents whether the web page resources on webpage html document has loaded.
Window.load event triggers resource all loadeds that can represent in webpage html document, but webpage itself still constantly can ask extra resource (as web pages component).
Such as, a flash video is inserted in webpage, a flash assembly can be called.This flash assembly can continuous foradownloaded video playing, and the download of this part does not just belong in the scope of window.load event, but the resource downloading of assembly inside itself.
For the webpage of above-mentioned e-commerce website, because under normal circumstances, the picture in webpage is downloaded the most slowly, most holding time, so window.load event can trigger after the picture of webpage has loaded.
Be below the triggering example of window.load event:
Wherein, window.load event can the web page resources in the <body> label of webpage html document loaded after trigger.
In actual applications, after monitoring users operation, webpage body content has started to load, in order to ensure loading sequence, ensure resource reasonable distribution, in the embodiment of the present application, after listening to the Action Events of specifying, the request of web pages component can be carried out postpositive disposal.
Step 103, loads the web pages component in described webpage at the time point preset.
And the web pages component of inactive users to website needs more weak, therefore for inactive users, the time point that can presetting, time delay loads this web pages component, to provide more browser resource, bandwidth resources, for Web page loading main body, resource is caused to fight for avoid Web page loading assembly and Web page loading main body, accelerate the loading velocity of webpage main body, reduce the load time of webpage main body, improve the loading efficiency of webpage, impact webpage main body loaded with the loading reducing web pages component.
In a preferred embodiment of the present application, after described default time point can be included in and detect that webpage main body has loaded event, the time point of interval first Preset Time;
When window.load event triggers, represent that the web page resources on webpage html document has loaded.So, after window.load event triggers, Web page loading assembly then can not have influence on the loading of webpage main body.
In the embodiment of the present application, rear Web page loading assembly at once can not be triggered in window.load event, but after webpage main body has loaded event, the time point Web page loading assembly of interval first Preset Time.
Further, the first Preset Time can for processing the time needed for asynchronous interface.
In a kind of preferred exemplary of the embodiment of the present application, this first Preset Time can be 4 seconds.
On the one hand, load at the first Preset Time, webpage has the state loaded can to avoid allowing user see, user is thought and improves Consumer's Experience from visual effect by webpage loaded.
On the other hand, some webpage, outside html document, also can ask some asynchronous interfaces, this asynchronous interface can for webpage html document load outside, the interface of request msg.By obtaining data from asynchronous interface, can realize not refreshing overall webpage, and completing the renewal of the specific web pages component data of webpage.
In actual applications, in the webpage of such as above-mentioned e-commerce website, a lot of web pages component has all carried out the relevant process of user individual.Particularly, JavaScript file in webpage can send the asynchronous interface of user profile to service end, service end calculates commodity or the shop of the most applicable user according to user profile, and return data is to JavaScript file, and JavaScript file is illustrated on webpage after taking these data.
After triggering window.load event, because server does not also return the data of request, the request of these asynchronous interfaces also in processes, namely asks the time of this asynchronous interface to be can not count in the time needed for triggering window.load event.Therefore, more reserved times are needed to carry out the process of asynchronous interface.
Such as, in the webpage of above-mentioned e-commerce website, asynchronous interface time-out time is traditionally arranged to be 3 seconds, then can reserve the data processing time of 1 second.So, 4 second time can be selected as the surge time of Web Page Processing, 4 seconds after window.load event triggers, start Web page loading assembly.Wherein, the asynchronous interface of web-page requests service end, service end does not calculate result within a period of time, so directly will disconnect request, and the time needed for this process is exactly time-out time.Service end may run into various mistake, can not because of these mistakes, and allow request keep always, take browse request number, therefore need to disconnect request.
The embodiment of the present application is after webpage main body has loaded event, the time point Web page loading assembly of interval first Preset Time, to provide more browser resource, bandwidth resources, for the treatment of asynchronous interface, avoid the resource of Web page loading assembly and process asynchronous interface to fight for, accelerate the loading velocity of asynchronous interface, decrease the load time of asynchronous interface, further increase the loading efficiency of webpage, ensure that the operation of webpage normal function.
In another preferred embodiment of the present application, after described default time point can be included in and start to load described webpage, the time point of interval second Preset Time.
In web page loading process, web page resources loads may run into failure or time-out, or some other abnormal situation, and window.load event possibly cannot be triggered.
Therefore, in the embodiment of the present application, in order to ensure that web pages component can load out within the acceptable time, can after starting to load described webpage, the time point Web page loading assembly of interval second Preset Time.
Further, the second Preset Time can be load time and the process asynchronous interface required time sum of webpage main body.
In a kind of preferred exemplary of the embodiment of the present application, this first Preset Time can be 8 seconds.
Such as, in the webpage of above-mentioned e-commerce website, the webpage main body load time generally within 4 seconds and 4 seconds, 4 seconds that add request asynchronous interface institute time delay, namely can after starting to load described webpage 8 seconds Web page loading assemblies.
The embodiment of the present application is after starting to load described webpage, the time point Web page loading assembly of interval second Preset Time, make to load at web page resources to run into failure or time-out or some other abnormal situation, cannot trigger web pages main body when having loaded event, Web page loading assembly within the acceptable time, ensure that the operation of webpage normal function.
Application the embodiment of the present application, the webpage of above-mentioned e-commerce website, load time entirety decreases half.
The embodiment of the present application when receiving the load request of webpage, by the Loading opportunity of the condition selecting web pages component of active user.On the one hand, when active user is any active ues, then Web page loading assembly immediately, to ensure variation, the facilitation of webpage function, ensures the Consumer's Experience of the user group that web pages component demand is stronger; On the other hand, when active user is inactive users, the time point then preset, time delay Web page loading assembly, to provide more browser resource, bandwidth resources, for Web page loading main body, avoid the resource of Web page loading assembly and Web page loading main body to fight for, accelerate the loading velocity of webpage main body, decrease the load time of webpage main body, improve the loading efficiency of webpage, the impact that the loading decreasing web pages component loads webpage main body.
It should be noted that, for embodiment of the method, in order to simple description, therefore it is all expressed as a series of combination of actions, but those skilled in the art should know, the embodiment of the present application is not by the restriction of described sequence of movement, because according to the embodiment of the present application, some step can adopt other orders or carry out simultaneously.Secondly, those skilled in the art also should know, the embodiment described in instructions all belongs to preferred embodiment, and involved action might not be that the embodiment of the present application is necessary.
For making those skilled in the art understand the embodiment of the present application better, the loading method of web pages component in the embodiment of the present application is described below by way of concrete example.
The webpage of the above-mentioned e-commerce website of user's request of loading, this webpage comprises a toolbar (one of web pages component), and the size of this toolbar is generally at about 200k, and the size of above-mentioned webpage main body is at about 400k.
General webpage load mode, the data of request of loading toolbar, webpage main body and asynchronous port while of meeting, mutually fight for resource before multiple request, all cannot load fast, make the loading velocity of overall webpage compare Web page loading body extending about 50%.
General lazy load mode, and be not suitable for the toolbar shielding displaying at head.
General time delay load mode, just starts loading tool hurdle after webpage has loaded 5 seconds, but a lot of user will leave current web page in 5 seconds, caused user just to can't see toolbar at all.
Application the embodiment of the present application, if user is at netpage search commodity, triggers mouse click event, then can think that active user is any active ues, needs the loading ensureing toolbar.But through user operation detection, webpage main body has started to load, therefore, can after webpage main body have loaded, loading tool hurdle, ensures the succession that webpage main body and toolbar load to ensure the reasonable distribution of resource, can rapid loading both making.
If user does not operate in webpage, namely do not trigger the Action Events of specifying, then can think that active user is inactive users, need the loading ensureing webpage main body.
After listening to windows.load event, represent that webpage main body has loaded, 4 seconds, interval, to allow the data of browser process asynchronous interface, now, can loading tool hurdle.
When not hearing windows.load event, 8 seconds, interval, for general Web page loading main body and process asynchronous interface data needed for time, now, can loading tool hurdle.
By time delay loading tool hurdle, to provide more browser resource, bandwidth resources, for Web page loading main body, the resource of Web page loading assembly and Web page loading main body is avoided to fight for, accelerate the loading velocity of webpage main body, improve the loading efficiency of webpage, the impact that the loading decreasing toolbar loads webpage main body.
With reference to Fig. 2, show the structured flowchart of the charger embodiment of a kind of web pages component of the application, specifically can comprise as lower module:
According to described monitoring instruction, judge module 201, for when receiving the monitoring instruction for webpage, judges whether active user is any active ues; If so, the first load-on module 202 is then called; If not, then the second load-on module 203 is called;
First load-on module 202, for loading the web pages component in described webpage;
Second load-on module 203, for loading the web pages component in described webpage at the time point preset.
In a preferred embodiment of the present application, described default time point can comprise:
After detecting that webpage main body has loaded event, the time point of interval first Preset Time;
And/or,
After starting to load described webpage, the time point of interval second Preset Time.
In a preferred embodiment of the present application, described judge module 201 can comprise following submodule:
Running time judges submodule, for judging the Action Events of specifying whether detected in loaded described webpage; If so, the first judgement submodule is then called; If not, then the second judgement submodule is called;
First judges submodule, for judging that active user is any active ues;
Second judges submodule, for judging that active user is inactive users.
In a kind of preferred exemplary of the embodiment of the present application, described Action Events of specifying can comprise at least one in the mouse action event of specifying, the keyboard operation event of specifying and the touch-control event of specifying.
In a kind of preferred exemplary of the embodiment of the present application, described mouse action event can comprise at least one in mouse moving event, mouse click event and mouse roller slip event;
Described keyboard operation event can comprise in keyboard letter key click event, keyboard digital key click event, keyboard symbol key click event and keyboard direction click event at least one each and every one;
Described touch-control event of specifying comprises touch event.
In a preferred embodiment of the present application, described first load-on module 202 can comprise following submodule:
Sequence loads submodule, for when detecting that webpage main body has loaded event, starts to load the web pages component in described webpage.
The embodiment of the present application when receiving the load request of webpage, by the Loading opportunity of the condition selecting web pages component of active user.On the one hand, when active user is any active ues, then Web page loading assembly immediately, to ensure variation, the facilitation of webpage function, ensures the Consumer's Experience of the user group that web pages component demand is stronger; On the other hand, when active user is inactive users, the time point then preset, time delay Web page loading assembly, to provide more browser resource, bandwidth resources, for Web page loading main body, avoid the resource of Web page loading assembly and Web page loading main body to fight for, accelerate the loading velocity of webpage main body, decrease the load time of webpage main body, improve the loading efficiency of webpage, the impact that the loading decreasing web pages component loads webpage main body.
The embodiment of the present application is after webpage main body has loaded event, the time point Web page loading assembly of interval first Preset Time, to provide more browser resource, bandwidth resources, for the treatment of asynchronous interface, avoid the resource of Web page loading assembly and process asynchronous interface to fight for, accelerate the loading velocity of asynchronous interface, decrease the load time of asynchronous interface, further increase the loading efficiency of webpage, ensure that the operation of webpage normal function.
The embodiment of the present application is after starting to load described webpage, the time point Web page loading assembly of interval second Preset Time, make to load at web page resources to run into failure or time-out or some other abnormal situation, cannot trigger web pages main body when having loaded event, Web page loading assembly within the acceptable time, ensure that the operation of webpage normal function.
For device embodiment, due to itself and embodiment of the method basic simlarity, so description is fairly simple, relevant part illustrates see the part of embodiment of the method.
Each embodiment in this instructions all adopts the mode of going forward one by one to describe, and what each embodiment stressed is the difference with other embodiments, between each embodiment identical similar part mutually see.
Those skilled in the art should understand, the embodiment of the embodiment of the present application can be provided as method, device or computer program.Therefore, the embodiment of the present application can adopt the form of complete hardware embodiment, completely software implementation or the embodiment in conjunction with software and hardware aspect.And the embodiment of the present application can adopt in one or more form wherein including the upper computer program implemented of computer-usable storage medium (including but not limited to magnetic disk memory, CD-ROM, optical memory etc.) of computer usable program code.
In one typically configuration, described computer equipment comprises one or more processor (CPU), input/output interface, network interface and internal memory.Internal memory may comprise the volatile memory in computer-readable medium, and the forms such as random access memory (RAM) and/or Nonvolatile memory, as ROM (read-only memory) (ROM) or flash memory (flashRAM).Internal memory is the example of computer-readable medium.Computer-readable medium comprises permanent and impermanency, removable and non-removable media can be stored to realize information by any method or technology.Information can be computer-readable instruction, data structure, the module of program or other data.The example of the storage medium of computing machine comprises, but be not limited to phase transition internal memory (PRAM), static RAM (SRAM), dynamic RAM (DRAM), the random access memory (RAM) of other types, ROM (read-only memory) (ROM), Electrically Erasable Read Only Memory (EEPROM), fast flash memory bank or other memory techniques, read-only optical disc ROM (read-only memory) (CD-ROM), digital versatile disc (DVD) or other optical memory, magnetic magnetic tape cassette, tape magnetic rigid disk stores or other magnetic storage apparatus or any other non-transmitting medium, can be used for storing the information can accessed by computing equipment.According to defining herein, computer-readable medium does not comprise the computer readable media (transitorymedia) of non-standing, as data-signal and the carrier wave of modulation.
The embodiment of the present application describes with reference to according to the process flow diagram of the method for the embodiment of the present application, terminal device (system) and computer program and/or block scheme.Should understand can by the combination of the flow process in each flow process in computer program instructions realization flow figure and/or block scheme and/or square frame and process flow diagram and/or block scheme and/or square frame.These computer program instructions can being provided to the processor of multi-purpose computer, special purpose computer, Embedded Processor or other programmable data processing terminal equipment to produce a machine, making the instruction performed by the processor of computing machine or other programmable data processing terminal equipment produce device for realizing the function of specifying in process flow diagram flow process or multiple flow process and/or block scheme square frame or multiple square frame.
These computer program instructions also can be stored in can in the computer-readable memory that works in a specific way of vectoring computer or other programmable data processing terminal equipment, the instruction making to be stored in this computer-readable memory produces the manufacture comprising command device, and this command device realizes the function of specifying in process flow diagram flow process or multiple flow process and/or block scheme square frame or multiple square frame.
These computer program instructions also can be loaded on computing machine or other programmable data processing terminal equipment, make to perform sequence of operations step to produce computer implemented process on computing machine or other programmable terminal equipment, thus the instruction performed on computing machine or other programmable terminal equipment is provided for the step realizing the function of specifying in process flow diagram flow process or multiple flow process and/or block scheme square frame or multiple square frame.
Although described the preferred embodiment of the embodiment of the present application, those skilled in the art once obtain the basic creative concept of cicada, then can make other change and amendment to these embodiments.So claims are intended to be interpreted as comprising preferred embodiment and falling into all changes and the amendment of the embodiment of the present application scope.
Finally, also it should be noted that, in this article, the such as relational terms of first and second grades and so on is only used for an entity or operation to separate with another entity or operational zone, and not necessarily requires or imply the relation that there is any this reality between these entities or operation or sequentially.And, term " comprises ", " comprising " or its any other variant are intended to contain comprising of nonexcludability, thus make to comprise the process of a series of key element, method, article or terminal device and not only comprise those key elements, but also comprise other key elements clearly do not listed, or also comprise by the intrinsic key element of this process, method, article or terminal device.When not more restrictions, the key element limited by statement " comprising ... ", and be not precluded within process, method, article or the terminal device comprising described key element and also there is other identical element.
Above to the method for a kind of web pages component that the application provides and a kind of charger of web pages component, be described in detail, apply specific case herein to set forth the principle of the application and embodiment, the explanation of above embodiment is just for helping method and the core concept thereof of understanding the application; Meanwhile, for one of ordinary skill in the art, according to the thought of the application, all will change in specific embodiments and applications, in sum, this description should not be construed as the restriction to the application.
Claims (12)
1. a loading method for web pages component, is characterized in that, comprising:
When receiving the monitoring instruction for webpage, judge whether active user is any active ues according to described monitoring instruction;
If so, the web pages component in described webpage is then loaded;
If not, then the web pages component in described webpage is loaded at the time point preset.
2. method according to claim 1, is characterized in that, described default time point comprises:
After detecting that webpage main body has loaded event, the time point of interval first Preset Time;
And/or,
After starting to load described webpage, the time point of interval second Preset Time.
3. method according to claim 1 and 2, is characterized in that, describedly monitors instruction judge that whether active user is that the step of any active ues comprises according to described:
Judge the Action Events of specifying whether detected in loaded described webpage;
If so, then judge that active user is as any active ues;
If not, then judge that active user is as inactive users.
4. method according to claim 3, is characterized in that, described Action Events of specifying comprises at least one in the mouse action event of specifying, the keyboard operation event of specifying and the touch-control event of specifying.
5. method according to claim 4, is characterized in that, described mouse action event comprises at least one in mouse moving event, mouse click event and mouse roller slip event;
Described keyboard operation event comprises at least one in keyboard letter key click event, keyboard digital key click event, keyboard symbol key click event and keyboard direction click event;
Described touch-control event of specifying comprises touch event.
6. the method according to claim 1 or 2 or 4 or 5, it is characterized in that, the step of the web pages component in the described webpage of described loading comprises:
When detecting that webpage main body has loaded event, start to load the web pages component in described webpage.
7. a charger for web pages component, is characterized in that, comprising:
According to described monitoring instruction, judge module, for when receiving the monitoring instruction for webpage, judges whether active user is any active ues; If so, the first load-on module is then called; If not, then the second load-on module is called;
First load-on module, for loading the web pages component in described webpage;
Second load-on module, for loading the web pages component in described webpage at the time point preset.
8. device according to claim 7, is characterized in that, described default time point comprises:
After detecting that webpage main body has loaded event, the time point of interval first Preset Time;
And/or,
After starting to load described webpage, the time point of interval second Preset Time.
9. the device according to claim 7 or 8, is characterized in that, described judge module comprises:
Running time judges submodule, for judging the Action Events of specifying whether detected in loaded described webpage; If so, the first judgement submodule is then called; If not, then the second judgement submodule is called;
First judges submodule, for judging that active user is any active ues;
Second judges submodule, for judging that active user is inactive users.
10. device according to claim 9, is characterized in that, described Action Events of specifying comprises at least one in the mouse action event of specifying, the keyboard operation event of specifying and the touch-control event of specifying.
11. devices according to claim 10, is characterized in that, described mouse action event comprises at least one in mouse moving event, mouse click event and mouse roller slip event;
Described keyboard operation event comprises at least one in keyboard letter key click event, keyboard digital key click event, keyboard symbol key click event and keyboard direction click event;
Described touch-control event of specifying comprises touch-control click event.
12. devices according to claim 7 or 8 or 10 or 11, it is characterized in that, described first load-on module comprises:
Sequence loads submodule, for when detecting that webpage main body has loaded event, starts to load the web pages component in described webpage.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201410334015.1A CN105278977B (en) | 2014-07-14 | 2014-07-14 | A kind of loading method and device of web pages component |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201410334015.1A CN105278977B (en) | 2014-07-14 | 2014-07-14 | A kind of loading method and device of web pages component |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN105278977A true CN105278977A (en) | 2016-01-27 |
| CN105278977B CN105278977B (en) | 2019-05-21 |
Family
ID=55148033
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201410334015.1A Active CN105278977B (en) | 2014-07-14 | 2014-07-14 | A kind of loading method and device of web pages component |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN105278977B (en) |
Cited By (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107390992A (en) * | 2017-07-21 | 2017-11-24 | 北京三快在线科技有限公司 | Webpage manipulation exchange method, device and Website server |
| CN109857473A (en) * | 2017-11-29 | 2019-06-07 | 北京京东尚科信息技术有限公司 | A kind of loading method and device of page data |
| CN110598141A (en) * | 2019-08-16 | 2019-12-20 | 平安科技（深圳）有限公司 | Information query method, electronic device and computer readable storage medium |
| CN111259284A (en) * | 2018-11-30 | 2020-06-09 | 阿里巴巴集团控股有限公司 | Page lazy loading method and device, storage medium and processor |
| CN112925573A (en) * | 2019-11-20 | 2021-06-08 | 北京沃东天骏信息技术有限公司 | Webpage loading method, device, equipment and computer readable medium |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| WO2003034345A1 (en) * | 2001-10-11 | 2003-04-24 | Yappa Corporation | Web 3d image display system |
| CN102760133A (en) * | 2011-04-28 | 2012-10-31 | 腾讯科技（深圳）有限公司 | Webpage loading method, webpage loading system, browser, terminal and server |
| CN103218425A (en) * | 2013-04-03 | 2013-07-24 | 北京奇虎科技有限公司 | Method and device for processing browser extension items |
| CN103677823A (en) * | 2013-12-06 | 2014-03-26 | 北京奇虎科技有限公司 | Method and device for managing browser plug-ins |
-
2014
- 2014-07-14 CN CN201410334015.1A patent/CN105278977B/en active Active
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| WO2003034345A1 (en) * | 2001-10-11 | 2003-04-24 | Yappa Corporation | Web 3d image display system |
| CN102760133A (en) * | 2011-04-28 | 2012-10-31 | 腾讯科技（深圳）有限公司 | Webpage loading method, webpage loading system, browser, terminal and server |
| CN103218425A (en) * | 2013-04-03 | 2013-07-24 | 北京奇虎科技有限公司 | Method and device for processing browser extension items |
| CN103677823A (en) * | 2013-12-06 | 2014-03-26 | 北京奇虎科技有限公司 | Method and device for managing browser plug-ins |
Cited By (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107390992A (en) * | 2017-07-21 | 2017-11-24 | 北京三快在线科技有限公司 | Webpage manipulation exchange method, device and Website server |
| CN107390992B (en) * | 2017-07-21 | 2020-12-04 | 北京三快在线科技有限公司 | Webpage manipulation interaction method and device and website server |
| CN109857473A (en) * | 2017-11-29 | 2019-06-07 | 北京京东尚科信息技术有限公司 | A kind of loading method and device of page data |
| CN111259284A (en) * | 2018-11-30 | 2020-06-09 | 阿里巴巴集团控股有限公司 | Page lazy loading method and device, storage medium and processor |
| CN111259284B (en) * | 2018-11-30 | 2023-05-02 | 阿里巴巴集团控股有限公司 | Method and device for lazy loading of page, storage medium and processor |
| CN110598141A (en) * | 2019-08-16 | 2019-12-20 | 平安科技（深圳）有限公司 | Information query method, electronic device and computer readable storage medium |
| CN110598141B (en) * | 2019-08-16 | 2023-10-13 | 平安科技（深圳）有限公司 | Information query method, electronic device and computer readable storage medium |
| CN112925573A (en) * | 2019-11-20 | 2021-06-08 | 北京沃东天骏信息技术有限公司 | Webpage loading method, device, equipment and computer readable medium |
| CN112925573B (en) * | 2019-11-20 | 2023-09-26 | 北京沃东天骏信息技术有限公司 | Method, device, equipment and computer readable medium for loading web page |
Also Published As
| Publication number | Publication date |
|---|---|
| CN105278977B (en) | 2019-05-21 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US11444856B2 (en) | Systems and methods for configuring a resource for network traffic analysis | |
| US10217139B2 (en) | On-page configuration of page analytics and campaign creation | |
| US10026103B2 (en) | Time-triggered advertisement replacement | |
| EP2847688B1 (en) | A method and system for monitoring and tracking browsing activity on handheld devices | |
| CN103064863B (en) | A kind of method and apparatus that recommendation information is provided | |
| US20180367625A1 (en) | Method and System for Tracking Web Link Usage | |
| CN106503134A (en) | Browser jumps to the method for data synchronization and device of application program | |
| US10007645B2 (en) | Modifying the presentation of a content item | |
| CN105278977B (en) | A kind of loading method and device of web pages component | |
| US9836766B1 (en) | Customized landing pages | |
| KR20120088736A (en) | Correlating web page visits and conversions with external references | |
| CN104035753A (en) | Double-WebView customized page display method and system | |
| US20130173431A1 (en) | Product comparison | |
| EP2339526A1 (en) | System and method for monitoring visits to a target site | |
| WO2017206739A1 (en) | Screenshot method and device | |
| CN105868290B (en) | Method and device for displaying search results | |
| CN107679214B (en) | Link positioning method, device, terminal and computer readable storage medium | |
| CN105574142A (en) | Method and system for recommending content to user | |
| WO2014204571A1 (en) | Universal tag for page analytics and campaign creation | |
| US8782538B1 (en) | Displaying a suggested query completion within a web browser window | |
| CN104025083A (en) | Method and apparatus for providing web pages | |
| US8140508B2 (en) | System and method for contextual commands in a search results page | |
| CN104699789A (en) | Method and system for embedding webpage | |
| CN104731817B (en) | A kind of webpage exhibiting method and device | |
| US9183314B2 (en) | Providing browsing history on client for dynamic webpage |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| C10 | Entry into substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |