CN106484383B - Page rendering method, device and equipment - Google Patents
Page rendering method, device and equipment Download PDFInfo
- Publication number
- CN106484383B CN106484383B CN201510549439.4A CN201510549439A CN106484383B CN 106484383 B CN106484383 B CN 106484383B CN 201510549439 A CN201510549439 A CN 201510549439A CN 106484383 B CN106484383 B CN 106484383B
- Authority
- CN
- China
- Prior art keywords
- html
- target
- module
- resource
- page
- 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
Links
Classifications
-
- 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
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Information Transfer Between Computers (AREA)
Abstract
This application discloses page rendering method, device and equipments, and the method application is on a client device, comprising: when accessing html page by browser, traverses the DOM node of each HTML module of the html page；When traversing the target DOM node of current target HTML module, according to attribute information defined in the target DOM node, to multiple target resources of target HTML module described in server parallel requests；The target HTML module is rendered according to the relationship between the multiple target resource.The embodiment of the present application is when rendering each HTML module of html page, pass through all resources of the attribute information parallel requests of the DOM node predetermined HTML module, therefore resource acquisition fast speed, and these resources can be loaded automatically after getting all resources, therefore the resource load time is saved, to improve the rendering speed of html page on the whole.
Description
Technical field
This application involves network communication technology field more particularly to page rendering method, device and equipments.
Background technique
Page rendering is exactly client browser by HTML (Hyper Text Markup Language, hypertext markup
Language) code is shown in the process in browser window according to predefined rule.Client browser when rendering html page,
It needs to obtain the various resources for carrying out page rendering from server, by loading the resource got to realize HTML page
Face rendering.In the related technology, html document frame can be divided into multiple HTML modules according to different function, it is any rendering
When the corresponding html page part of HTML module, client browser successively requests each HTML mould to server in a serial fashion
The different types of resource of block, and after having requested every class resource, by calling JavaScript to carry out these resources manually
Load, to complete the rendering of html page part.
But above-mentioned page rendering process needs serially request the resource of each HTML module, therefore resource obtains
Take speed slower, and due to increasing resource and adding using calling JavaScript mode to complete the load of resource manually
The time is carried, the above bulk velocity for causing html page to render is slower.
Summary of the invention
The application provides page rendering method, device and equipment, slower with the bulk velocity for solving existing page rendering
Problem.
According to the embodiment of the present application in a first aspect, providing a kind of page rendering method, the method is applied in client
In equipment, comprising:
When accessing html page by browser, the file object mould of each HTML module of the html page is traversed
Type DOM node；
When traversing the target DOM node of current target HTML module, according to defined in the target DOM node
Attribute information, to multiple target resources of target HTML module described in server parallel requests；
The target HTML module is rendered according to the relationship between the multiple target resource.
According to the second aspect of the embodiment of the present application, a kind of page rendering device is provided, described device is applied in client
In equipment, described device includes:
Traversal Unit, for traversing each HTML mould of the html page when accessing html page by browser
The document dbject model DOM node of block；
Request unit, for when traversing the target DOM node of current target HTML module, according to the target
Attribute information defined in DOM node, to multiple target resources of target HTML module described in server parallel requests；
Rendering unit, for rendering the target HTML module according to the relationship between the multiple target resource.
According to the third aspect of the embodiment of the present application, a kind of client device is provided, comprising:
Processor；For storing the memory of the processor-executable instruction；
Wherein, the processor is configured to:
When accessing html page by browser, the file object mould of each HTML module of the html page is traversed
Type DOM node；
When traversing the target DOM node of current target HTML module, according to defined in the target DOM node
Attribute information, to multiple target resources of target HTML module described in server parallel requests；
The target HTML module is rendered according to the relationship between the multiple target resource.
When accessing html page using the embodiment of the present application, when the mesh for the either objective HTML module for traversing html page
Mark DOM node when, can the attribute information according to defined in target DOM node, to server parallel requests target HTML mould
Multiple target resources of block, and target HTML module is rendered according to the relationship between multiple target resources.Due to the application reality
Example is applied when rendering each HTML module, passes through the attribute information parallel requests of the DOM node predetermined HTML modules
All resources, therefore resource acquisition fast speed, and these resources can be loaded automatically after getting all resources, therefore
The resource load time is saved, to improve the rendering speed of html page on the whole.
It should be understood that above general description and following detailed description be only it is exemplary and explanatory, not
The application can be limited.
Detailed description of the invention
The drawings herein are incorporated into the specification and forms part of this specification, and shows the implementation for meeting the application
Example, and together with specification it is used to explain the principle of the application.
Fig. 1 is one embodiment flow chart of the application page rendering method；
Fig. 2 is the schematic diagram of a scenario that page rendering is carried out using the embodiment of the present application；
Fig. 3 is another embodiment flow chart of the application page rendering method；
Fig. 4 is a kind of hardware structure diagram of client device where the application page rendering device；
Fig. 5 is one embodiment block diagram of the application page rendering device；
Fig. 6 is another embodiment block diagram of the application page rendering device.
Specific embodiment
It is only to be not intended to be limiting the application merely for for the purpose of describing particular embodiments in term used in this application.
It is also intended in the application and the "an" of singular used in the attached claims, " described " and "the" including majority
Form, unless the context clearly indicates other meaning.It is also understood that term "and/or" used herein refers to and wraps
It may be combined containing one or more associated any or all of project listed.
It will be appreciated that though various information, but this may be described using term first, second, third, etc. in the application
A little information should not necessarily be limited by these terms.These terms are only used to for same type of information being distinguished from each other out.For example, not departing from
In the case where the application range, the first information can also be referred to as the second information, and similarly, the second information can also be referred to as
One information.Depending on context, word as used in this " if " can be construed to " ... when " or " when ...
When " or " in response to determination ".
It is one embodiment flow chart of the application page rendering method referring to Fig. 1, which can apply in client
End equipment includes the following steps:
Step 101: when accessing html page by browser, traversing the DOM section of each HTML module of html page
Point.
In the present embodiment, when user starts browser on a client device, and html page is accessed by browser
When, the html page first can be divided into multiple HTML modules, for example, html page can be divided into according to different function
Father's HTML module further for any father HTML module, can also be divided into multiple sub- HTML by multiple father HTML modules
Module.Wherein, it when dividing the HTML module of html page, can be divided based on the different function of html page, for example,
Picture display area, video display area and text display area on html page can be respectively divided into different HTML
Module, further, can also by text display area content of text fixed area and content of text region of variation be divided into
Different HTML modules.
For each HTML module divided, can by the DOM node of the WEB primary layout definition HTML module,
DOM node can add attribute letter for marking region of the corresponding HTML module in html page on DOM node
Breath, the resource path of multiple resources in the attribute information comprising HTML module, such as on server the address of storage resource or
Person port etc..
Based on the division to html page, each html page contains multiple HTML modules, and client device is opened at this time
The DOM node for each HTML module of traversal that begins executes identical operation for each DOM node client device traversed.
Therefore for convenience, the HTML module currently traversed is known as target HTML module, by the DOM of target HTML module
Node is known as target DOM node.
Step 102: when traversing the target DOM node of current target HTML module, according to fixed in target DOM node
The attribute information of justice, to multiple target resources of server parallel requests target HTML module.
In this step, when traversing the target DOM node of current target HTML module, target DOM section can be read
The attribute information of point, obtains the resource path of multiple target resources of target HTML module, then according to each target resource
Resource path, by calling JavaScript to be used to obtain the resource requests of these target resources to server transmitted in parallel.
Wherein resource may include: html file, CSS (Cascading Style Sheets, Cascading Style Sheet) file, JS
(JavaScript) file, JSON (JavaScript Object Notation, JS object tag) data etc..
Step 103: according to the relationship post-processing object HTML module between multiple target resources.
It can be every after requesting multiple target resources, in this step to the multiple resource requests of server transmitted in parallel
Solicited status is arranged in a resource request, and the solicited status is for marking whether to have got corresponding target resource.When basis is set
It, can be according to the dependence between these target resources when the solicited status determination set has got all target resources
After successively loading these target resources, target HTML module is synthesized, the HTML module after synthesis is finally added to its target DOM
In node, to complete the rendering of target HTML module.It follows that when the DOM node for having traversed all HTML modules, and
After completing to the rendering of all HTML modules, the rendering to entire html page can be completed.
Wherein, the loading procedure when successively loading target resource according to the dependence between target resource and existing skill
It is consistent in art, for example, when target resource includes html file, CSS file, JS file, when JSON data, then first according to HTML text
Part loads out html document frame, then by the JS file modification HEML document frame, finally by CSS file and JSON number
It is further modified according to html document frame, to render the corresponding html page part of target HTML module.
As seen from the above-described embodiment, pass through DOM node predetermined when rendering each HTML module in the embodiment
The attribute information parallel requests HTML modules all resources, therefore resource acquisition fast speed, and all getting
These resources can be loaded after resource automatically, therefore save the resource load time, to improve html page on the whole
Rendering speed.
Referring to fig. 2, a schematic diagram of a scenario of page rendering is realized for application the embodiment of the present application, Fig. 2 is to render OPOA
It is described for the html page of (One Page One Application, single-page application):
Include the client device side for loading html page in Fig. 2, can usually refer to the hand for being configured with browser
Machine, tablet computer, PC etc.；And server side for loading the various resources of html page is provided, which can be with
Distributed server is disposed, for example, CDN (Content Delivery Network, content distributing network) server.
In the present embodiment, OPOA refers to that a WEB page is exactly an application, when OPOA is loaded for the first time, all html documents
It can be transferred to web browser, when user accesses an independent html page in OPOA, which can be in current WEB
It is loaded in page.In Fig. 2, it is assumed that an OPOA includes n html page, then the render process of each html page can answer
It is realized with scheme provided by the embodiments of the present application.By taking html page 2 shown in Figure 2 as an example, which is divided into m
HTML module, the resource of each HTML module are stored in server side, and the render process of each HTML module is consistent, with
For HTML module 2, obtain HTML module 2 resource when, client device to server transmitted in parallel resource request, and
After getting all resources including html file, JS file, CSS file and JSON data, using between these resources according to
The relationship of relying renders away the corresponding portion of the corresponding html page 2 of HTML module 2.Below in conjunction with Fig. 2 shows scene signal
Figure, is described in detail the application page rendering process by the embodiment shown in Fig. 3.
It is another embodiment flow chart of the application page rendering method referring to Fig. 3, which can apply in visitor
Family end equipment, comprising the following steps:
Step 301: when accessing html page by browser, which being divided into multiple HTML modules.
In the embodiment of the present application, when user starts browser on a client device, and HTML is accessed by browser
When the page, the html page first can be divided into multiple HTML modules, for example, html page can be drawn according to different function
It is divided into multiple father HTML modules, further, for any father HTML module, which can also be divided into multiple sons
HTML module.As shown in connection with fig. 2, html page 2 is divided into m HTML module, this m HTML module may include father HTML
Module and/or sub- HTML module.
In the present embodiment, when dividing the HTML module of html page, it can be carried out based on the different function of html page
It divides, for example, picture display area, video display area and the text display area on html page can be respectively divided into
Different HTML modules further can also be by the content of text fixed area and content of text variation in text display area
Region division is different HTML module；In addition, different html pages may include part phase for OPOA shown in Figure 2
Same content of pages, for example, dividing html page 1 for several HTML modules when rendering html page 1, if will
The content of pages of some HTML module divided in some HTML module and html page 1 that html page 2 is divided is identical,
Then when rendering html page 2, other HTML modules in addition to the HTML module can be rendered, only so as to further save
The render time and rendering resources of html page 2, are not limited this embodiment of the present application.
Step 302: passing through the attribute information of the DOM node of each HTML module of the primary layout definition of WEB.
Primary (Native) exploitation generally refers to be developed with primary development language, and primary development language is exactly the entire system of exploitation
The programming language used when system；DOM is a kind of with data and structure on the document model and the page of object-oriented way description
Tree represenation mode, DOM define expression and modification document required for object, the behavior of object and attribute and object
Between relationship.
In the present embodiment, after html page to be divided into multiple HTML modules, for each HTML module, it can pass through
The DOM node of the WEB primary layout definition HTML module, DOM node is for marking corresponding HTML module in html page
Region, and attribute information can be added on DOM node, the money of multiple resources in the attribute information comprising HTML module
The address or port etc. of storage resource on source path, such as server；Further, HTML can also be defined on DOM node
The other informations such as the title of module.It, can be for the HTML module 2 in conjunction with Fig. 2 it is found that HTML module 2 for html page 2
Attribute information is added in the DOM node of definition, includes html file, the JS file, CSS of HTML module 2 in the attribute information
The resource path that file and JSON data are stored in server side.
Step 303: the DOM node of each HTML module of traversal HTML module.
Based on the division to html page, each html page contains multiple HTML modules, and client device is opened at this time
The DOM node for each HTML module of traversal that begins executes identical operation for each DOM node client device traversed.
Therefore for convenience, the subsequent HTML module that will currently traverse is known as target HTML module, by target HTML module
DOM node be known as target DOM node.
Step 304: when traversing the target DOM node of current target HTML module, reading the category of target DOM node
Property information, obtain target HTML module multiple target resources resource path.
By taking the HTML module 2 in Fig. 2 is target HTML module as an example, it is assumed that currently traverse the DOM section of HTML module 2
Point, then can with the attribute information of DOM node defined in read step 302, obtain the html file of HTML module 2, JS file,
The resource path of CSS file and JSON data.
Step 305: according to the resource path of each target resource, by calling JavaScript to server transmitted in parallel
For obtaining the resource request of target resource.
It can use the High level Script Language that operation can be directly explained by browser in the present embodiment, in a browser wash with watercolours
When contaminating html page, for example, High level Script Language can be JavaScript, JavaScript is a kind of based on object and event
Drive and have the client-side scripting language of relative safety.
In conjunction with the description in step 304, in html file, JS file, CSS file and the JSON for getting HTML module 2
After the resource path of data, client device can resource request according to above-mentioned resource path transmitted in parallel html file, JS
The resource request of the resource request of file, the resource request of CSS file and JSON data.
Step 306: solicited status being set for each resource request, the solicited status is for marking whether to have got correspondence
Target resource.
It can be every after requesting multiple target resources, in this step to the multiple resource requests of server transmitted in parallel
Solicited status is arranged in a resource request, and the solicited status is for marking whether to have got corresponding target resource, for example, when also
Some target resource has not been obtained, then the solicited status of the target resource is " waiting ", when having got some target resource, then
The solicited status of the target resource is " completion ".
Step 307: when getting all target resources according to the solicited status of setting is determining, according between target resource
Dependence successively load target resource after, synthesize target HTML module.
Still resource request, the resource of JS file by taking the HTML module 2 in Fig. 2 as an example, when set html file
The state of the resource request of request, the resource request of CSS file and JSON data is " when completion " that can determine acquisition
To all resources of HTML module 2.
In this step, according to the dependence load HTML module 2 between resource process with it is consistent in the prior art, can
To include: the html document frame for first loading out HTML module 2 according to html file, then pass through JS file modification HEML text
Shelves frame, further modifies html document frame finally by CSS file and JSON data, to render target
The corresponding html page part of HTML module.
Step 308: target HTML module being added in target DOM node, the rendering of target HTML module is completed.
Step 309: judging whether to have traversed the DOM node of all HTML modules, if so, thening follow the steps 310；Otherwise,
Return step 303.
Step 310: determining the rendering for completing html page, terminate current process.
The DOM node of all HTML modules has been traversed to step 309 executing abovementioned steps 303 by circulation, and has been completed
After the renderings of all HTML modules, complete html page can be loaded out on a web browser.
As seen from the above-described embodiment, pass through DOM node predetermined when rendering each HTML module in the embodiment
The attribute information parallel requests HTML modules all resources, therefore resource acquisition fast speed, and all getting
These resources can be loaded after resource automatically, therefore save the resource load time, to improve html page on the whole
Rendering speed.
Corresponding with the embodiment of the application page rendering method, present invention also provides page rendering device and clients
The embodiment of equipment.
The embodiment of the application page rendering device can be applied on the various client devices for being equipped with browser, example
Such as, which may include mobile phone, tablet computer, PC etc..Wherein, Installation practice can by software realization,
It can be realized by way of hardware or software and hardware combining.Taking software implementation as an example, as the device on a logical meaning,
It is in being read computer program instructions corresponding in nonvolatile memory by the processor of client device where it
Deposit what middle operation was formed.For hardware view, as shown in figure 4, the client device where the application page rendering device
A kind of hardware structure diagram is implemented other than processor shown in Fig. 4, memory, network interface and nonvolatile memory
Client device in example where device can also include other hardware generally according to the actual functional capability of the equipment, in Fig. 4 no longer
It shows one by one.
It is one embodiment block diagram of the application page rendering device referring to Fig. 5:
The device includes: Traversal Unit 510, request unit 520 and rendering unit 530.
Wherein, Traversal Unit 510, for traversing the every of the html page when accessing html page by browser
The document dbject model DOM node of a HTML module；
Request unit 520, for when traversing the target DOM node of current target HTML module, according to the mesh
Attribute information defined in DOM node is marked, to multiple target resources of target HTML module described in server parallel requests；
Rendering unit 530, for rendering the target HTML module according to the relationship between the multiple target resource.
It is another embodiment block diagram of the application page rendering device referring to Fig. 6:
The device includes: division unit 610, definition unit 620, Traversal Unit 630, request unit 640, rendering unit
650 and judging unit 660 and determination unit 670.
Wherein, division unit 610, for the html page to be divided into multiple HTML modules；
Definition unit 620, for the attribute information of the DOM node by each HTML module of the primary layout definition of WEB, institute
DOM node is stated for marking region of the HTML module in the html page, includes HTML module in the attribute information
The resource path of multiple resources；
Traversal Unit 630, for traversing each HTML of the html page when accessing html page by browser
The document dbject model DOM node of module；
Request unit 640, for when traversing the target DOM node of current target HTML module, according to the mesh
Attribute information defined in DOM node is marked, to multiple target resources of target HTML module described in server parallel requests；
Rendering unit 650, for rendering the target HTML module according to the relationship between the multiple target resource；
Judging unit 660, for judging whether to have traversed the DOM node of all HTML modules；
Determination unit 670, if the DOM node for having traversed all HTML modules, it is determined that complete the html page
Rendering.
In an optional implementation, the request unit 640 may include (being not shown in Fig. 6):
Information reading sub-unit obtains the target HTML module for reading the attribute information of the target DOM node
Multiple target resources resource path；
Transmission sub-unit is requested, for the resource path according to each target resource, by calling JavaScript to clothes
Business device transmitted in parallel is used to obtain the resource request of the target resource.
In another optional implementation, the rendering unit 650 may include (being not shown in Fig. 6):
Subelement is arranged in state, and for solicited status to be arranged for each resource request, the solicited status is for marking
It is no to have got corresponding target resource；
Module synthesizing subunit, for when according to the solicited status of setting determine get all target resources when, according to
After dependence between the target resource successively loads the target resource, the target HTML module is synthesized；
Module adding unit completes the target for the HTML module to be added in the target DOM node
The rendering of HTML module.
In another optional implementation, each HTML module of the html page, comprising:
Multiple father HTML modules that the html page is divided；And/or
Multiple sub- HTML modules that any father HTML module is divided.
The function of each unit and the realization process of effect are specifically detailed in the above method and correspond to step in above-mentioned apparatus
Realization process, details are not described herein.
For device embodiment, since it corresponds essentially to embodiment of the method, so related place is referring to method reality
Apply the part explanation of example.The apparatus embodiments described above are merely exemplary, wherein described be used as separation unit
The unit of explanation may or may not be physically separated, and component shown as a unit can be or can also be with
It is not physical unit, it can it is in one place, or may be distributed over multiple network units.It can be according to actual
The purpose for needing to select some or all of the modules therein to realize application scheme.Those of ordinary skill in the art are not paying
Out in the case where creative work, it can understand and implement.
As seen from the above-described embodiment, when application the embodiment of the present application renders each HTML module, by predetermined
All resources of the attribute information parallel requests of the DOM node HTML module, therefore resource acquisition fast speed, and obtaining
These resources can be loaded after to all resources automatically, therefore save the resource load time, to improve on the whole
The rendering speed of html page.
Those skilled in the art after considering the specification and implementing the invention disclosed here, will readily occur to its of the application
Its embodiment.This application is intended to cover any variations, uses, or adaptations of the application, these modifications, purposes or
Person's adaptive change follows the general principle of the application and including the undocumented common knowledge in the art of the application
Or conventional techniques.The description and examples are only to be considered as illustrative, and the true scope and spirit of the application are by following
Claim is pointed out.
It should be understood that the application is not limited to the precise structure that has been described above and shown in the drawings, and
And various modifications and changes may be made without departing from the scope thereof.Scope of the present application is only limited by the accompanying claims.
Claims (14)
1. a kind of page rendering method, which is characterized in that the method application is on a client device, comprising:
When accessing hypertext markup language html page by browser, each HTML module of the html page is traversed
Document dbject model DOM node；
When traversing the target DOM node of current target HTML module, according to attribute defined in the target DOM node
Information, to multiple target resources of target HTML module described in server parallel requests；The attribute information includes target HTML
The resource path of multiple target resources of module；
The target HTML module is rendered according to the relationship between the multiple target resource.
2. the method according to claim 1, wherein each HTML module of the traversal html page
Before DOM node, the method also includes:
The html page is divided into multiple HTML modules；
By the attribute information of the DOM node of each HTML module of the primary layout definition of WEB, the DOM node is for marking
Region of the HTML module in the html page, the resource road of multiple resources in the attribute information comprising HTML module
Diameter.
3. according to the method described in claim 2, it is characterized in that, the attribute according to defined in the target DOM node
Information, to multiple target resources of target HTML module described in server parallel requests, comprising:
The attribute information for reading the target DOM node obtains the resource road of multiple target resources of the target HTML module
Diameter；
According to the resource path of each target resource, by calling JavaScript described for obtaining to server transmitted in parallel
The resource request of target resource.
4. according to the method described in claim 3, it is characterized in that, the relationship wash with watercolours according between the multiple target resource
Contaminate the target HTML module, comprising:
Solicited status is set for each resource request, the solicited status has got corresponding target money for marking whether
Source；
When getting all target resources according to the solicited status of setting is determining, closed according to the dependence between the target resource
After system successively loads the target resource, the target HTML module is synthesized；
The target HTML module is added in the target DOM node, the rendering of the target HTML module is completed.
5. the method according to claim 1, wherein the method also includes:
Judge whether to have traversed the DOM node of all HTML modules；
If having traversed the DOM node of all HTML modules, it is determined that complete the rendering of the html page.
6. method according to any one of claims 1 to 5, which is characterized in that each HTML module of the html page, packet
It includes:
Multiple father HTML modules that the html page is divided；And/or
Multiple sub- HTML modules that any father HTML module is divided.
7. method according to any one of claims 1 to 5, which is characterized in that the resource of HTML module includes: html file,
Cascading Style Sheet CSS file, JS file, object tag JSON data.
8. a kind of page rendering device, which is characterized in that on a client device, described device includes: for described device application
Traversal Unit, for traversing each HTML module of the html page when accessing html page by browser
Document dbject model DOM node；
Request unit, for being saved according to the target DOM when traversing the target DOM node of current target HTML module
Attribute information defined in point, to multiple target resources of target HTML module described in server parallel requests；The attribute letter
The resource path of multiple target resources of the breath comprising target HTML module；
Rendering unit, for rendering the target HTML module according to the relationship between the multiple target resource.
9. device according to claim 8, which is characterized in that described device further include:
Division unit, for the html page to be divided into multiple HTML modules；
Definition unit, for the attribute information of the DOM node by each HTML module of the primary layout definition of WEB, the DOM section
Point is for marking region of the HTML module in the html page, multiple resources comprising HTML module in the attribute information
Resource path.
10. device according to claim 9, which is characterized in that the request unit, comprising:
Information reading sub-unit obtains the more of the target HTML module for reading the attribute information of the target DOM node
The resource path of a target resource；
Transmission sub-unit is requested, for the resource path according to each target resource, by calling JavaScript to server
Transmitted in parallel is used to obtain the resource request of the target resource.
11. device according to claim 10, which is characterized in that the rendering unit, comprising:
Subelement is arranged in state, and for solicited status to be arranged for each resource request, the solicited status is for marking whether
Get corresponding target resource；
Module synthesizing subunit, for when according to the solicited status of setting determine get all target resources when, according to described
After dependence between target resource successively loads the target resource, the target HTML module is synthesized；
Module adding unit completes the target for the target HTML module to be added in the target DOM node
The rendering of HTML module.
12. device according to claim 8, which is characterized in that described device further include:
Judging unit, for judging whether to have traversed the DOM node of all HTML modules；
Determination unit, if the DOM node for having traversed all HTML modules, it is determined that complete the rendering of the html page.
13. according to any device of claim 8 to 12, which is characterized in that each HTML module of the html page,
Include:
Multiple father HTML modules that the html page is divided；And/or
Multiple sub- HTML modules that any father HTML module is divided.
14. a kind of client device characterized by comprising
Processor；For storing the memory of the processor-executable instruction；
Wherein, the processor is configured to:
When accessing html page by browser, the document dbject model of each HTML module of the html page is traversed
DOM node；
When traversing the target DOM node of current target HTML module, according to attribute defined in the target DOM node
Information, to multiple target resources of target HTML module described in server parallel requests；The attribute information includes target HTML
The resource path of multiple target resources of module；
The target HTML module is rendered according to the relationship between the multiple target resource.
Priority Applications (2)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201510549439.4A CN106484383B (en) | 2015-08-31 | 2015-08-31 | Page rendering method, device and equipment |
| PCT/CN2016/095857 WO2017036309A1 (en) | 2015-08-31 | 2016-08-18 | Page rendering method, device and apparatus |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201510549439.4A CN106484383B (en) | 2015-08-31 | 2015-08-31 | Page rendering method, device and equipment |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN106484383A CN106484383A (en) | 2017-03-08 |
| CN106484383B true CN106484383B (en) | 2019-08-23 |
Family
ID=58186685
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201510549439.4A Active CN106484383B (en) | 2015-08-31 | 2015-08-31 | Page rendering method, device and equipment |
Country Status (2)
| Country | Link |
|---|---|
| CN (1) | CN106484383B (en) |
| WO (1) | WO2017036309A1 (en) |
Families Citing this family (42)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107169007B (en) * | 2017-03-31 | 2021-04-16 | 北京奇艺世纪科技有限公司 | Display interface setting method and device of mobile terminal |
| CN107105336B (en) * | 2017-04-19 | 2021-01-08 | 腾讯科技（深圳）有限公司 | Data processing method and data processing device |
| CN107066430B (en) * | 2017-04-21 | 2021-02-26 | 阿里巴巴（中国）有限公司 | Picture processing method and device, server and client |
| CN107622106A (en) * | 2017-09-13 | 2018-01-23 | 五八有限公司 | Reminding method and device when a kind of page can not render |
| CN109558186B (en) * | 2017-09-27 | 2022-06-28 | 阿里巴巴集团控股有限公司 | Page display method and device |
| WO2019071406A1 (en) * | 2017-10-10 | 2019-04-18 | 深圳中兴力维技术有限公司 | Front-end page internationalization processing method, application server and computer readable storage medium |
| CN109697266A (en) * | 2017-10-24 | 2019-04-30 | 中国电信股份有限公司 | Page rendering system, page rendering method and page rendering device |
| CN108595457A (en) * | 2017-12-29 | 2018-09-28 | 北京奇虎科技有限公司 | A kind of rendering intent and device of the waterfall stream page |
| CN108322359A (en) * | 2018-01-08 | 2018-07-24 | 阿里巴巴集团控股有限公司 | A kind of acquisition methods and device of page initial screen time |
| CN108595652A (en) * | 2018-04-27 | 2018-09-28 | 平安科技（深圳）有限公司 | Load method, apparatus, computer equipment and the storage medium of DOM node data |
| CN109002282B (en) * | 2018-07-26 | 2020-11-03 | 京东数字科技控股有限公司 | Method and device for realizing animation effect in web page development |
| CN111258877B (en) * | 2018-11-30 | 2023-05-02 | 阿里巴巴集团控股有限公司 | Method and device for detecting visible time of first screen page and electronic equipment |
| CN111339548B (en) * | 2018-12-18 | 2023-11-03 | 北京京东尚科信息技术有限公司 | Data processing method and device for anticreep, computer equipment and storage medium |
| CN109865292B (en) * | 2019-01-10 | 2023-03-14 | 珠海金山数字网络科技有限公司 | Game resource construction method and device based on game engine |
| CN109902247B (en) * | 2019-02-14 | 2021-04-16 | 北京奇艺世纪科技有限公司 | Page rendering method and device and electronic equipment |
| CN110322284A (en) * | 2019-06-14 | 2019-10-11 | 广州汇量信息科技有限公司 | The methods of exhibiting and system of advertisement page view |
| CN110795195B (en) * | 2019-10-31 | 2023-09-26 | 百度在线网络技术（北京）有限公司 | Webpage rendering method and device, electronic equipment and storage medium |
| CN112948011B (en) * | 2019-11-26 | 2023-08-08 | 上海哔哩哔哩科技有限公司 | Method and device for loading secondary page |
| CN111045655B (en) * | 2019-12-18 | 2023-04-14 | 广州市百果园信息技术有限公司 | Page rendering method and device, rendering server and storage medium |
| CN111143732A (en) * | 2019-12-20 | 2020-05-12 | 贝壳技术有限公司 | Webpage rendering method and device |
| CN113051874B (en) * | 2019-12-26 | 2023-12-26 | 阿里巴巴集团控股有限公司 | User behavior data rendering method and device |
| CN111221530B (en) * | 2020-01-08 | 2023-11-14 | 北京市科学技术情报研究所 | Mobile terminal Web application interface construction method, web application interface and operation method thereof |
| CN111310088B (en) * | 2020-02-12 | 2023-07-04 | 北京字节跳动网络技术有限公司 | Page rendering method and device |
| CN111443921A (en) * | 2020-03-27 | 2020-07-24 | 中国平安财产保险股份有限公司 | Method, system and computer equipment for subpackage deployment of web front-end projects |
| CN111562918A (en) * | 2020-05-06 | 2020-08-21 | 中国银行股份有限公司 | Page dynamic generation method and device |
| CN113760557A (en) * | 2020-05-29 | 2021-12-07 | 北京沃东天骏信息技术有限公司 | Page data sending method and device, electronic equipment and storage medium |
| CN111880790A (en) * | 2020-06-12 | 2020-11-03 | 北京三快在线科技有限公司 | Page rendering method, page rendering system, and computer-readable storage medium |
| CN111880788A (en) * | 2020-06-12 | 2020-11-03 | 北京三快在线科技有限公司 | Page rendering method, device, client and computer readable storage medium |
| CN111562919A (en) * | 2020-07-14 | 2020-08-21 | 成都市映潮科技股份有限公司 | Method, system and storage medium for generating front-end webpage code based on PSD file |
| CN113760269A (en) * | 2020-07-17 | 2021-12-07 | 北京沃东天骏信息技术有限公司 | Configuration method and device, and component rendering method, device and system |
| CN111880860A (en) * | 2020-07-28 | 2020-11-03 | 北京浪潮数据技术有限公司 | Service processing method, device and related equipment |
| CN113761412B (en) * | 2020-09-17 | 2024-08-16 | 北京沃东天骏信息技术有限公司 | Application page display method and device, electronic equipment, medium and application system |
| CN113760149A (en) * | 2021-01-28 | 2021-12-07 | 北京沃东天骏信息技术有限公司 | Page split screen system, method and device |
| CN113315982B (en) * | 2021-05-07 | 2023-06-27 | 广州虎牙科技有限公司 | Live broadcast method, computer storage medium and equipment |
| CN113220366A (en) * | 2021-05-11 | 2021-08-06 | 北京达佳互联信息技术有限公司 | Sub-application starting method and device, terminal and server |
| CN113262469A (en) * | 2021-06-08 | 2021-08-17 | 网易（杭州）网络有限公司 | Resource template generation method and device and scene element rendering method and device in game |
| CN113392350B (en) * | 2021-06-11 | 2023-07-04 | 中国联合网络通信集团有限公司 | Page routing processing method, device, equipment and storage medium |
| CN114237600B (en) * | 2021-12-20 | 2023-08-11 | 抖音视界有限公司 | Method, device, equipment and storage medium for generating code of front page |
| CN114911555A (en) * | 2022-04-19 | 2022-08-16 | 北京三快在线科技有限公司 | Page display method and device, electronic equipment and storage medium |
| CN115665480B (en) * | 2022-10-25 | 2024-06-07 | 广州至真信息科技有限公司 | Data rendering method and device, computer equipment and storage medium |
| CN116795405B (en) * | 2023-08-25 | 2023-11-21 | 苏州盈天地资讯科技有限公司 | Quick rendering method for front-end pages of thousand-person thousand-face scene, server and front-end equipment |
| CN116880901B (en) * | 2023-09-05 | 2023-11-24 | 国网思极网安科技（北京）有限公司 | Application page analysis method, device, electronic equipment and computer readable medium |
Citations (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102915375A (en) * | 2012-11-08 | 2013-02-06 | 山东大学 | Webpage loading method based on layout zoning |
| CN104050190A (en) * | 2013-03-14 | 2014-09-17 | 腾讯科技（上海）有限公司 | Method and system for processing link data, and client |
Family Cites Families (7)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US8875032B2 (en) * | 2008-05-08 | 2014-10-28 | Dialogic Corporation | System and method for dynamic configuration of components of web interfaces |
| CN102760139A (en) * | 2011-04-29 | 2012-10-31 | 国际商业机器公司 | Webpage processing method and webpage processing system |
| CN103049439A (en) * | 2011-10-11 | 2013-04-17 | 腾讯科技（深圳）有限公司 | Processing method for markup language documents, browser and network operating system |
| US9898445B2 (en) * | 2012-08-16 | 2018-02-20 | Qualcomm Incorporated | Resource prefetching via sandboxed execution |
| CN103679487B (en) * | 2012-09-05 | 2017-07-07 | 阿里巴巴集团控股有限公司 | The monitoring method and equipment of advertising display |
| CN103593414A (en) * | 2013-10-29 | 2014-02-19 | 北京奇虎科技有限公司 | Showing method and device of webpages in browser |
| CN104239441A (en) * | 2014-09-01 | 2014-12-24 | 可牛网络技术（北京）有限公司 | Web page loading control method and device |
-
2015
- 2015-08-31 CN CN201510549439.4A patent/CN106484383B/en active Active
-
2016
- 2016-08-18 WO PCT/CN2016/095857 patent/WO2017036309A1/en active Application Filing
Patent Citations (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102915375A (en) * | 2012-11-08 | 2013-02-06 | 山东大学 | Webpage loading method based on layout zoning |
| CN104050190A (en) * | 2013-03-14 | 2014-09-17 | 腾讯科技（上海）有限公司 | Method and system for processing link data, and client |
Also Published As
| Publication number | Publication date |
|---|---|
| WO2017036309A1 (en) | 2017-03-09 |
| CN106484383A (en) | 2017-03-08 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN106484383B (en) | Page rendering method, device and equipment | |
| CN104866383B (en) | Interface calling method and device and terminal | |
| WO2020151333A1 (en) | Page loading method, apparatus, computer device and storage medium | |
| CN109684575A (en) | Processing method and processing device, storage medium, the computer equipment of web data | |
| US20120011430A1 (en) | Infinite Scrolling | |
| EP3267325B1 (en) | Page phase time | |
| JP2016504694A (en) | Resource calls for hybrid applications | |
| TW201723897A (en) | Method, device, and system for displaying information associated with a web page | |
| CN103258058B (en) | Page display method and system and browser | |
| US10158691B2 (en) | Method and apparatus for providing network resources at intermediary server | |
| US10402462B2 (en) | Robust filters for social networking environments | |
| CN108228816A (en) | A kind of loading method and device of waterfall flow graph piece | |
| US20150149888A1 (en) | Systems and methods for executing aspects of a document | |
| CN111079048A (en) | Page loading method and device | |
| CN109740081A (en) | Page loading method and device | |
| CN106886547A (en) | A kind of scenario generation method and device | |
| CN108241689A (en) | Page resource acquisition methods, device and client device | |
| CN109800370A (en) | Display methods, device, computer equipment and the storage medium of Webpage | |
| CN109936605A (en) | A kind of method and apparatus of loading interface data | |
| CN107203470A (en) | Page adjustment method and device | |
| CN109495553A (en) | A kind of webpage display control method, system and Reverse Proxy | |
| CN105786476A (en) | Data processing method and system based on mobile client and server | |
| CN107203536A (en) | Online browse method, device and the equipment of content | |
| WO2015058614A1 (en) | Bookmark storage method and device, and method and device for determining bookmark to be browsed | |
| CN105739717B (en) | Data inputting method and device |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | 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 |