CN109508434A - Block generation method, webpage rendering method and device - Google Patents
Block generation method, webpage rendering method and device Download PDFInfo
- Publication number
- CN109508434A CN109508434A CN201811242839.0A CN201811242839A CN109508434A CN 109508434 A CN109508434 A CN 109508434A CN 201811242839 A CN201811242839 A CN 201811242839A CN 109508434 A CN109508434 A CN 109508434A
- Authority
- CN
- China
- Prior art keywords
- block
- webpage
- rendering
- render mode
- asynchronous
- 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
The present invention relates to block generation method, webpage rendering method and devices, in block generation method, obtain the block arrangement information of user's input, the block arrangement information includes HTML node identification, node content, asynchronous attribute and SEO close friend's attribute；Preset block generating function is called, according to the block arrangement information, generates block.In webpage rendering method, the webpage of webpage load request and webpage load request institute request of loading is obtained；The render mode of the block for including in the webpage and each block for including in the webpage is obtained, the render mode is determined according to the block arrangement information, and including synchronous render mode and asynchronous render mode；According to the render mode, each block for including in the webpage is rendered and loaded respectively, the block loading velocity of main browsing content can be improved.
Description
Technical field
The present invention relates to Internet technical field more particularly to a kind of block generation methods, webpage rendering method and device.
Background technique
With the development of network technology, more and more users pass through network acquisition information.User obtains the network information
A kind of relatively conventional mode is obtained by web page browsing mode.
When user browses webpage, webpage shows various information by opening web page element, and webpage is opened web page element and opened up
Showing the process of information can be described as being the process of webpage rendering.When webpage renders at present, need all to render whole web page elements
Completion can just show information.However, user only may need to browse the partial information in webpage, current rendering mode causes
The partial information content loading velocity that user needs to browse is slow, influences user experience.
Summary of the invention
The embodiment of the present invention provides a kind of block generation method, webpage rendering method and device, with improve user need it is clear
The loading velocity for the partial information content look at.
On the one hand the embodiment of the present invention provides a kind of block generation method, this method comprises: obtaining the area of user's input
Block configuration information, the block arrangement information include HTML node identification, node content, asynchronous attribute and SEO close friend's attribute；It adjusts
Block is generated, the block generating function is according to according to the block arrangement information with preset block generating function
What block arrangement information determined.
On the other hand the embodiment of the present invention provides a kind of webpage rendering method, ask this method comprises: obtaining webpage load
It asks and the webpage of webpage load request institute request of loading；The block for including in the webpage is obtained, the block is pre-
First web page element is divided, and including block arrangement information, the block arrangement information includes HTML node mark
Knowledge, node classification, node content, block controller, block pattern, asynchronous attribute and SEO close friend's attribute；It obtains in the webpage
Including each block render mode, the render mode is determined according to the block arrangement information, and renders mould including synchronous
Formula and asynchronous render mode；According to the render mode, renders respectively and load each block for including in the webpage.
Another further aspect of the embodiment of the present invention provides a kind of block generating means, and described device includes acquiring unit and generation
Unit, the acquiring unit are used to obtain the block arrangement information of user's input, and the block arrangement information includes HTML node
Mark, node content, asynchronous attribute and SEO close friend's attribute；The generation unit is for calling preset block generating function, root
According to the block arrangement information that the acquiring unit obtains, block is generated, the block generating function is according to the block arrangement
What information determined.
The another aspect of the embodiment of the present invention additionally provides a kind of webpage rendering device, and described device includes acquiring unit and wash with watercolours
Loading unit is contaminated, the acquiring unit is used to obtain webpage load request and webpage load request institute request of loading
Webpage, and obtain the render mode of the block for including in the webpage and each block for including in the webpage, the block
In advance web page element is divided to obtain, and including block arrangement information, the block arrangement information includes HTML section
Point identification, node classification, node content, block controller, block pattern, asynchronous attribute and SEO close friend's attribute, the rendering mould
Formula is determining according to the block arrangement information, and including synchronous render mode and asynchronous render mode；Loading unit is rendered, is used for
According to the render mode that the acquiring unit obtains, renders respectively and load each block for including in the webpage.
Block generation method, webpage rendering method and device provided in an embodiment of the present invention are obtained when carrying out webpage rendering
The block for including in the webpage of institute's request of loading is taken, and determines the render mode of each block, render mode includes synchronous rendering mould
Formula and asynchronous render mode render respectively according to the render mode of each block and load each block for including in webpage.Due to being
The rendering load of webpage is carried out as unit of block, therefore the setting of block can be carried out according to the main browsing content demand of user,
Rendering load is carried out using synchronous rendering method to the block for including main browsing content, improves the area including main browsing content
Block loading velocity.
Detailed description of the invention
Fig. 1 is block generation method implementation flow chart provided in an embodiment of the present invention；
Fig. 2 is another block generation method implementation flow chart provided in an embodiment of the present invention；
Fig. 3 is the method implementation flow chart of determining block render mode provided in an embodiment of the present invention；
Fig. 4 is a kind of webpage rendering method implementation flow chart provided in an embodiment of the present invention；
Fig. 5 is the asynchronous load implementation flow chart of block provided in an embodiment of the present invention；
Fig. 6 is another webpage rendering method implementation flow chart provided in an embodiment of the present invention；
Fig. 7 is the method implementation flow chart provided in an embodiment of the present invention for updating each block HTML content；
Fig. 8 is a kind of block generating means structural schematic diagram provided in an embodiment of the present invention；
Fig. 9 is another block generating means structural schematic diagram provided in an embodiment of the present invention；
Figure 10 is a kind of webpage rendering device structural schematic diagram provided in an embodiment of the present invention；
Figure 11 is another webpage rendering device structural schematic diagram provided in an embodiment of the present invention.
Specific embodiment
The principle and spirit of the invention are described below with reference to several illustrative embodiments.It should be appreciated that providing this
A little embodiments are used for the purpose of making those skilled in the art can better understand that realizing the present invention in turn, and be not with any
Mode limits the scope of the invention.
The embodiment of the present invention provides a kind of block generation method, in the block generation method, the configuration of user input area block
Information, the block arrangement information include super HTML node identification, node content, asynchronous attribute and SEO close friend's attribute, obtain and use
The block arrangement information of family input, and call preset block generating function according to the block arrangement information, generate block.
It, can be according to block arrangement information, really for the block generated according to block arrangement information in the embodiment of the present invention
Determine the render mode of block, which includes synchronous render mode and asynchronous render mode.It, can when carrying out block rendering
To render and load block according to the render mode of block.
The embodiment of the present invention provides a kind of webpage rendering method, in the webpage rendering method, includes in acquisition webpage
The render mode of the render mode of block and block, block includes synchronous render mode and asynchronous render mode, according to block
Render mode, render and load block.
In the embodiment of the present invention, user can carry out block arrangement information according to the main browsing content demand of webpage visitor
Setting, and generate corresponding block, the decoupling between Web page area may be implemented.When carrying out block rendering, using synchronous wash with watercolours
Dye and asynchronous rendering, can be improved the rendering loading velocity of page entirety.
Fig. 1 show a kind of block generation method implementation flow chart provided in an embodiment of the present invention, and this method can be by area
Block generating means execute, which can be the entity that can be interacted with front end (such as browser), certainly
The embodiment of the present invention and without limitation.As shown in fig.1, the block generation method includes step S101 to S102.
S101: the block arrangement information of user's input is obtained.
User (webpage design personnel), can be according to module each in webpage when designing webpage in the embodiment of the present invention
Correlation, determine and need the module that divides, and divided the module needed to web page element, the mould which obtains
Block can be understood as the present embodiments relate to block (pagelet).User is according to (html-DOM) webpage of structuring
In HTML node can position corresponding block.
After user has determined block, the setting of block arrangement information can be carried out, and the block arrangement information of the setting is defeated
Enter into block generating means.
The block arrangement information that user inputs in the embodiment of the present invention may include: node content (content), block control
Device (controller) processed, asynchronous attribute (async) and search engine optimization (Search Engine Optimization,
SEO) friendly attribute (seo_friendly) etc..The block arrangement information that user inputs in the embodiment of the present invention can also include super
Text mark up language (Hyper Text Mark-up Language, HTML node identification (id), node classification (class), area
Block pattern (style) etc..
For example, block arrangement information are as follows:
{ id=" xxx " content=" xxx " controller=" xxx " style=" xxx " async=" true/
False " seo_friendly=" true/false " }
Wherein,
Id: corresponding to render the HTML node identification come.
Class: it is corresponding to render the html node class come, indicate the pattern of block.
Content: opposite rear end Pagelet block rendering data content.It wherein, can be rendering parameter in content
(params) it is combined with rendering interface (Application Programming Interface, api), or data
(data) and the combination of template (template).When Content is params and api interface, when carrying out webpage rendering,
Params is passed to api as parameter, and api called data simultaneously renders html content.Content is the group of data and template
When conjunction, when carrying out webpage rendering, html content directly is exported with data rendering template.
Controller: corresponding front end Pagelet block controller script, controller are mainly responsible for the interaction side of block
There is map in formula, such as a block, the display amplification factor of map can be set in controller, and mouse also can be set and exist
The interactive operation etc. checked is dragged on map.
Style: corresponding front end Pagelet block style sheet.
Async: when value is true, indicating asynchronous rendering, when value is false, indicates synchronous rendering.
Seo_friendly: it when value is true, indicates when value is false, to indicate not friendly to SEO SEO close friend
It is good.
S102: calling preset block generating function, according to the block arrangement information of acquisition, generates block.
Block generating function can be preset according to block arrangement information in the embodiment of the present invention, it can by the block generating function
Block is generated, such as block generating function may is that
{ pagelet content=" xxx " async=" xxx " controller=" xxx " style=" xxx " }.
After block generating means get the block arrangement information of user's input, it can be called according to the block arrangement information
Preset function generates block.
After block generating means generate block in the embodiment of the present invention, also block can be determined according to block arrangement information
Render mode.
Fig. 2 show another block generation method implementation flow chart provided in an embodiment of the present invention, side shown in Fig. 2
Method further includes following steps on the basis of method shown in Fig. 1:
S103: the render mode for determining block is synchronous render mode or asynchronous render mode.
The render mode of block can be determined in the embodiment of the present invention according to the block arrangement information for including in block.One kind can
The embodiment of energy is as shown in Figure 3.
S1031: judging whether visitor is search engine, if visitor be search engine, then follow the steps S1034 according to
The asynchronous attribute for including in block, determines render mode.If visitor is non-search engine, it is generic browser, then executes
S1032。
S1032: according to the SEO close friend's attribute for including in block, render mode is determined.If SEO close friend's attribute characterization is to SEO
Close friend then executes S1033.If SEO close friend's attribute characterization is unfriendly to SEO, thening follow the steps S1034 according in block includes
Asynchronous attribute determines render mode.
S1033: if SEO close friend's attribute characterization is to SEO close friend, it is determined that render mode is synchronous render mode.
When Seo close friend can be understood as the content searched in a search engine comprising needs, user's search key
There is the content for needing to search for, is not in search for less than or occur other content.When a content of pages is entirely
Asynchronous load, search engine can not be by crawler capturing current page particular contents, will can not be by webpage when including
It associates with the keyword in content, that user searches for the keyword for needing occur in the content searched for, in the results list just
Be not in the content for needing to search for, occur as soon as the disagreeableness phenomenon of SEO in this way, therefore in the embodiment of the present invention, it determines to SEO friend
Good block is rendered using synchronous render mode, is relatively good selection, web page contents can be enabled to be searched engine
Index.
S1034: according to the asynchronous attribute for including in block, render mode is determined.If asynchronous attribute characterization is asynchronous, it is determined that
Render mode is asynchronous render mode.If asynchronous attribute characterization is non-asynchronous, it is determined that render mode is synchronous render mode.
Judge in the embodiment of the present invention by parameter settings such as block arrangement information to block and to visitor, determines
The render mode of block is synchronous render mode, and synchronism output when search engine collecting may be implemented, and search is avoided to draw
The phenomenon that can not grabbing Asynchronous content appearance is held up, block loading velocity is improved.
When the page carries out rendering load, all the elements for needing each module of the page to include have been executed in respective service logic
At later, it is uniformly output to browser, this process serially executes, and the waiting time is more long, and each module rendering load speed
Degree influences each other, and one is slow all slow, and one is bad all bad.And in the embodiment of the present invention, the render mode of block includes synchronous render mode
With asynchronous render mode, loaded using the rendering that synchronous render mode and asynchronous render mode carry out block, tradition is independent relatively
Block is loaded using asynchronous rendering mode, can not be led by crawler capturing current page particular content to avoid search engine
Crucial word association in webpage and page particular content can not be caused disagreeableness search result to occur by cause when including.And
Block is rendered using asynchronous render mode, the strong solution coupling between page module may be implemented, will all be separated between module, mutually
It no longer influences, improves the rendering loading velocity of page entirety.
The block generation method being related to based on the above embodiment, the embodiment of the present invention provide a kind of webpage rendering method.
Fig. 4 show webpage rendering method implementation flow chart provided in an embodiment of the present invention, and this method can be by webpage
The executing subject of load rendering executes, which can be browser, be also possible to other execution that corresponding function may be implemented
Main body, such as interface gateway etc., the embodiment of the present invention is it is not limited here.As shown in fig.4, this method comprises:
S201: the webpage of webpage load request and webpage load request institute request of loading is obtained.
Webpage load request can be the website information etc. inputted on a web browser in the embodiment of the present invention, pass through the webpage
Load request is available to the webpage for needing to load on a web browser.
S202: the render mode of the block and block that include in webpage is obtained.
It include the multiple blocks divided in advance to web page element in webpage involved in the embodiment of the present invention.?
It, can be from the render mode for obtaining the block and block that include in webpage from block generating means when needing to carry out webpage load.
It include block arrangement information, block arrangement information in the block that block generating means generate in the embodiment of the present invention
Including HTML node identification, node classification, node content, block controller, block pattern, asynchronous attribute and SEO close friend's attribute
Deng.The render mode of block is determined according to block arrangement information.Block generating means generate block in the embodiment of the present invention
Process, and determine the process of the render mode of the block generated, see the description of above-described embodiment, it is no longer superfluous herein
It states.
S203: according to render mode, each block for including in webpage is rendered respectively.
In the embodiment of the present invention, if the render mode of block is synchronous render mode, executes S203a and render the block
Complete HTML content.If the render mode of block is asynchronous render mode, the asynchronous loading zone that S203b renders the block is executed
Block message.Wherein, asynchronous load block information includes HTML node identification, node classification, node content, block controller, area
Block pattern etc..
In the embodiment of the present invention under asynchronous render mode, rendering includes the asynchronous load block letter of basic block arrangement information
Breath, rather than complete HTML content is rendered, so that the rendering of the block under asynchronous render mode does not influence under synchronous render mode
The rendering of block, so that the block of synchronous render mode loads completion faster.
S204: according to render mode, each block for including in webpage is loaded respectively.
In the embodiment of the present invention, in carrying out block loading procedure, different sides can be used according to the render mode of block
Formula.Wherein, if the render mode of block is synchronous render mode, the complete HTML content of the synchronous load block, and utilize
The block controller initializes the block.If the render mode of block be the block controller of asynchronous render mode and the block not
It is initialised, then according to the node content for including in the block, the asynchronous complete HTML content for loading the block, and utilizes block
Controller initializes the block.
Specifically, Fig. 5 show it is provided in an embodiment of the present invention according to the node content for including in the block, asynchronous load
A kind of possible embodiment flow chart of the complete HTML content of the block.As shown in fig.5, including:
S2041: rendering result acquisition request is sent to the public rendering interface of block, includes in the rendering result acquisition request
Params the and api interface message for including in the Content of the block.
In general, when block is asynchronous render mode, it can be in the case where determining that the block is not initialised, rear end block
Public rendering interface sends rendering result acquisition request, includes in carrying Content in the rendering result acquisition request
Params and api interface message.Wherein, block public rendering interface in rear end can be understood as the place of an asynchronous rendering of processing
Device is managed, it is a http interface, receives the request of browser rendering asynchronous module, then calls specific asynchronous module api raw
At html.The public rendering interface rendering result acquisition request of block, and include according in rendering result acquisition request
Params and api interface message, calls block itself to render api, and rendering exports the HTML content of the block.
S2042: public rendering interface is received according to params the and api interface message for including in rendering result acquisition request
The HTML content of rendering.
S2043: the HTML content received is filled into block.
In general, when will receive HTML content and fill to block, using js code, the html content that interface is returned,
It is inserted into block dom node.
In the embodiment of the present invention, in the HTML content that receives it is possible to that js and css can be attached to, subsidiary js and css are
It is inserted respectively on the page, can all run immediately, incidentally change behavior and the pattern of the page.
In the embodiment of the present invention, HTML content is filled to block, is initialized using the block controller of the block
The block.
Further, rendered in the embodiment of the present invention and load include in the webpage each block after, it may include such as
Lower step:
S205: the HTML content of each block is updated.
Implementation flow chart including updating each block HTML content is as shown in Figure 6.
Specifically, the synchronous method of block itself can be called directly when updating the HTML content of each block, update in HTML
Hold.
Fig. 7 show a kind of possible method implementation flow chart for updating each block HTML content, as shown in fig.7, packet
It includes:
S2051: rendering is sent to the public rendering interface of block and updates request, the rendering, which updates in request, includes
The api interface message for including in Content and preset params.
The params of current block can be set in the embodiment of the present invention in js script.And by the same of js script triggering block
One step process sends rendering to the public rendering interface of block and updates request, and updating in request in the rendering includes wrapping in Content
The api interface message included and preset params.The public rendering interface rendering of block updates request, and according to rendering
Params the and api interface message for including in request is updated, block itself is called to render api, rendering exports the HTML of the block
Content.
S2052: public rendering interface is received according to the api interface message and preset params for including in Content
The HTML of rendering more new content.
S2053: the HTML received is updated into fills into block, more new block.
Based on identical inventive concept, the embodiment of the invention provides a kind of block generating means.
Fig. 8 show a kind of structural schematic diagram of block generating means provided in an embodiment of the present invention, as shown in fig.8,
Block generating means include acquiring unit 101 and generation unit 102.Wherein, acquiring unit 101, for obtaining user's input
Block arrangement information, block arrangement information include node content, block controller, asynchronous attribute and SEO close friend's attribute.It generates single
Member 102, according to the block arrangement information that acquiring unit 101 obtains, generates block for calling preset block generating function,
Block generating function is determined according to block arrangement information.
Wherein, block arrangement information may also include that HTML node identification, node classification and block pattern.
In a kind of possible embodiment, the present embodiments relate to block generating means may also include determining that unit
103, as shown in Figure 9.Determination unit 103 is used for: in generation unit 103 according to block arrangement information, after generating block, according to
Block arrangement information determines that the render mode of block, render mode include synchronous render mode and asynchronous render mode.
Wherein it is determined that unit 103 determines the render mode of block in the following way according to block arrangement information:
If visitor determines render mode according to the asynchronous attribute for including in block arrangement information for generic browser；
If visitor determines render mode according to the SEO close friend's attribute for including in block arrangement information for search engine.
In possible embodiment, determination unit 103 in the following way according to the SEO close friend's attribute for including in block,
Determine render mode: if SEO close friend's attribute characterization is to SEO close friend, it is determined that render mode is synchronous render mode；If SEO is friendly
Good attribute characterization is unfriendly to SEO, then according to the asynchronous attribute for including in block arrangement information, determines render mode.
Specifically, determination unit 103 determines wash with watercolours in the following way according to the asynchronous attribute for including in block arrangement information
Dye mode:
If asynchronous attribute characterization is asynchronous, it is determined that render mode is asynchronous render mode；If asynchronous attribute characterization is non-asynchronous,
Then determine that render mode is synchronous render mode.
It is understood that the modules unit in block generating means involved in the embodiment of the present invention was realized
Function is corresponding with the step in above-described block generation method, specific implementation and technical effect refer to above for
The description of method and step, details are not described herein.
It will be further understood that the above-mentioned block generating means being related to of the embodiment of the present invention structure (including it is each
Title, the connection relationship of modular unit) be only to be schematically illustrated, should based on the present embodiments relate to block generation
The structure of block generating means provided by the identical inventive concept of method is not limited to Fig. 8 and structure shown in Fig. 9, also not office
It is limited to include the above-mentioned modular unit being related to, it is also possible to can including other modular units or the above-mentioned modular unit being related to
Further progress subdivision.
Based on identical inventive concept, the embodiment of the invention also provides a kind of webpage rendering devices.
Figure 10 show a kind of structural schematic diagram of webpage rendering device provided in an embodiment of the present invention.0 institute refering to fig. 1
Show, the present embodiments relate to webpage rendering device include acquiring unit 201 and rendering loading unit 202.Wherein, it obtains single
Member 201, for obtaining the webpage of webpage load request and webpage load request institute request of loading, and obtains in webpage and includes
Block and webpage in include each block render mode.The block for including in webpage is to draw in advance to web page element
Get, and including block arrangement information, block arrangement information includes HTML node identification, node classification, node content, area
Block controller, block pattern, asynchronous attribute and SEO close friend's attribute.The render mode of block is determining according to block arrangement information, and
Including synchronous render mode and asynchronous render mode.Render loading unit 202, the rendering for obtaining according to acquiring unit 201
Mode renders respectively and loads each block for including in webpage.
Specifically, rendering loading unit 202 renders each area for including in webpage in the following way according to render mode
Block:
If the render mode of block is synchronous render mode, the complete HTML content of the block is rendered；If the wash with watercolours of block
Dye mode is asynchronous render mode, then renders the asynchronous load block information of the block, asynchronous load block information includes HTML
Node identification, node classification, node content, block controller, block pattern.
Wherein, rendering loading unit 202 loads each block for including in webpage in the following way according to render mode:
If the render mode of block is synchronous render mode, the complete HTML content of the synchronous load block, and controlled using block
Device initializes the block；
If the render mode of block is not initialised for the block controller of asynchronous render mode and the block, basis should
The node content for including in block, the asynchronous complete HTML content for loading the block, and the area is initialized using block controller
Block.
Wherein, rendering loading unit 202 is in the following way according to the node content for including in block, asynchronous load block
Complete HTML content: send rendering result acquisition request to the public rendering interface of block, include in rendering result acquisition request
The rendering parameter and rendering interface message for including in node content；Public rendering interface is received according to rendering parameter and rendering interface
The HTML content of information rendering；The HTML content received is filled into block.
In a kind of possible embodiment, webpage rendering device provided in an embodiment of the present invention may also include updating unit
203, as shown in figure 11.Wherein, updating unit 203 is used for: rendering and load include in webpage each in rendering loading unit 202
After block, rendering is sent to the public rendering interface of block and updates request, render the wash with watercolours updated include in request in node content
Contaminate interface message and default rendering parameter；Public rendering interface is received according to default rendering parameter and rendering interface message wash with watercolours
The HTML of dye more new content；The HTML received is updated into fills into block, more new block.
It is understood that the modules unit in webpage rendering device involved in the embodiment of the present invention was realized
Function is corresponding with the step in above-described webpage rendering method, specific implementation and technical effect refer to above for
The description of method and step, details are not described herein.
It will be further understood that the above-mentioned webpage rendering device being related to of the embodiment of the present invention structure (including it is each
Title, the connection relationship of modular unit) be only to be schematically illustrated, should based on the present embodiments relate to webpage rendering
The structure of webpage rendering device provided by the identical inventive concept of method is not limited to structure shown in Figure 10 and Figure 11, also not
It is confined to include the above-mentioned modular unit being related to, it is also possible to including other modular units or the above-mentioned modular unit being related to
It can further progress subdivision.
In some embodiments, the embodiment of the present invention also provides a kind of server, wherein the server includes memory
And processor.Memory is configured to store instruction.Processor is configured to call instruction and executes block life described above
At method or webpage rendering method.
In some embodiments, the embodiment of the present invention also provides a kind of computer readable storage medium, which can
It reads storage medium and is stored with computer executable instructions.Computer executable instructions when executed by the processor, execute institute above
The block generation method or webpage rendering method stated.
It is understood that although description operation in a particular order in the accompanying drawings in the embodiment of the present invention, is not answered
It is understood as requiring particular order or serial order shown in execute these operations, or requires to execute whole institutes
The operation shown is to obtain desired result.In specific environment, multitask and parallel processing may be advantageous.
The present embodiments relate to method and apparatus can be completed using standard programming technology, utilization is rule-based
Logic or other logics realize various method and steps.It should also be noted that herein and used in claims
Word " device " and " module " are intended to include using the realization of a line or multirow software code and/or hardware realization and/or use
In the equipment for receiving input.
In some embodiments, the embodiment of the invention also provides following technical schemes:
A kind of block generation method of scheme 1., wherein include:
Obtain the block arrangement information of user's input, the block arrangement information includes node content, block controller, different
Walk attribute and SEO close friend's attribute；
Preset block generating function is called, according to the block arrangement information, generates block, the block generating function
It is to be determined according to the block arrangement information.
2. the method for claim 1 of scheme, wherein the block arrangement information further include: hypertext markup language
HTML node identification, node classification and block pattern.
The method according to scheme 1 or scheme 2 of scheme 3., wherein according to the block arrangement information, generate block it
Afterwards, the method also includes:
According to the block arrangement information, determine that the render mode of the block, the render mode include synchronous rendering
Mode and asynchronous render mode.
4. the method for claim 3 of scheme, wherein according to the block arrangement information, determine the wash with watercolours of the block
Dye mode, comprising:
If visitor determines render mode according to the asynchronous attribute for including in block arrangement information for generic browser；
If visitor is search engine, according to the SEO close friend's attribute for including in block arrangement information, rendering mould is determined
Formula.
5. the method for claim 4 of scheme, wherein it is described according to the SEO close friend's attribute for including in block, determine wash with watercolours
Dye mode, comprising:
If SEO close friend's attribute characterization is to SEO close friend, it is determined that render mode is synchronous render mode；
If SEO close friend's attribute characterization is unfriendly to SEO, according to the asynchronous attribute for including in block arrangement information, determine
Render mode.
The method according to scheme 4 or scheme 5 of scheme 6., wherein according to the asynchronous category for including in block arrangement information
Property, determine render mode, comprising:
If asynchronous attribute characterization is asynchronous, it is determined that render mode is asynchronous render mode；
If asynchronous attribute characterization is non-asynchronous, it is determined that render mode is synchronous render mode.
A kind of webpage rendering method of scheme 7., wherein include:
Obtain the webpage of webpage load request and webpage load request institute request of loading；
The block for including in the webpage is obtained, the block is divided to obtain to web page element in advance, and is wrapped
Include block arrangement information, the block arrangement information includes hypertext markup language HTML node identification, node classification, in node
Appearance, block controller, block pattern, asynchronous attribute and search engine optimization SEO close friend's attribute；
The render mode for each block for including in the webpage is obtained, the render mode is according to the block arrangement information
It determines, and including synchronous render mode and asynchronous render mode；
According to the render mode, renders respectively and load each block for including in the webpage.
8. the method for claim 7 of scheme, wherein it is described according to the render mode, it renders and is wrapped in the webpage
Each block included, comprising:
If the render mode of the block is synchronous render mode, the complete HTML content of the block is rendered；
If the render mode of the block is asynchronous render mode, the asynchronous load block information of the block, institute are rendered
Stating asynchronous load block information includes HTML node identification, node classification, node content, block controller, block pattern.
The method according to scheme 7 or scheme 8 of scheme 9., wherein it is described according to the render mode, load the net
Each block for including in page, comprising:
If the render mode of the block is synchronous render mode, the complete HTML content of the synchronous load block, and
The block is initialized using block controller；
If the render mode of the block is not initialised for the block controller of asynchronous render mode and the block, root
According to the node content for including in the block, the asynchronous complete HTML content for loading the block, and initialized using block controller
The block.
10. the method for claim 9 of scheme, wherein according to the node content for including in block, asynchronous load block
Complete HTML content, comprising:
Rendering result acquisition request is sent to the public rendering interface of block, includes described in the rendering result acquisition request
The rendering parameter and rendering interface message for including in node content；
The public rendering interface is received according to the HTML content of the rendering parameter and the rendering interface message rendering；
The HTML content received is filled into block.
The method according to Scheme 7 of scheme 11., wherein render and load each block for including in the webpage
Later, the method also includes:
Rendering is sent to the public rendering interface of block and updates request, and it includes in node content that the rendering, which updates in request,
Render interface message and default rendering parameter；
The public rendering interface is received according to the HTML of the default rendering parameter and the rendering interface message rendering
More new content；
The HTML received is updated into fills into block, more new block.
A kind of block generating means of scheme 12., wherein include:
Acquiring unit, for obtain user input block arrangement information, the block arrangement information include node content,
Block controller, asynchronous attribute and search engine optimization SEO close friend's attribute；
Generation unit is believed for calling preset block generating function according to the block arrangement that the acquiring unit obtains
Breath generates block, and the block generating function is determined according to the block arrangement information.
The device according to scheme 12 of scheme 13., wherein the block arrangement information further include: hypertext markup language
Say HTML node identification, node classification and block pattern.
The device according to scheme 12 or scheme 13 of scheme 14., wherein described device further includes determination unit, described
Determination unit is used for:
In the generation unit according to the block arrangement information, after generating block, according to the block arrangement information,
Determine that the render mode of the block, the render mode include synchronous render mode and asynchronous render mode.
The device according to scheme 14 of scheme 15., wherein the determination unit is in the following way according to the block
Configuration information determines the render mode of the block:
If visitor determines render mode according to the asynchronous attribute for including in block arrangement information for generic browser；
If visitor is search engine, according to the SEO close friend's attribute for including in block arrangement information, rendering mould is determined
Formula.
The device according to scheme 15 of scheme 16., wherein the determination unit is wrapped according in block in the following way
The SEO close friend's attribute included, determines render mode:
If SEO close friend's attribute characterization is to SEO close friend, it is determined that render mode is synchronous render mode；
If SEO close friend's attribute characterization is unfriendly to SEO, according to the asynchronous attribute for including in block arrangement information, determine
Render mode.
The device according to scheme 15 or scheme 16 of scheme 17., wherein determination unit basis in the following way
The asynchronous attribute for including in block arrangement information, determines render mode:
If asynchronous attribute characterization is asynchronous, it is determined that render mode is asynchronous render mode；
If asynchronous attribute characterization is non-asynchronous, it is determined that render mode is synchronous render mode.
A kind of webpage rendering device of scheme 18., wherein include:
Acquiring unit, for obtaining the webpage of webpage load request and webpage load request institute request of loading, and
Obtain the render mode of the block for including in the webpage and each block for including in the webpage, the block
In advance web page element is divided to obtain, and including block arrangement information, the block arrangement information includes hypertext
Markup language HTML node identification, node classification, node content, block controller, block pattern, asynchronous attribute and search engine
Optimize SEO close friend's attribute, the render mode is determined according to the block arrangement information, and including synchronous render mode and asynchronous
Render mode；
Loading unit is rendered, the render mode for obtaining according to the acquiring unit renders respectively and loads the net
Each block for including in page.
The device according to scheme 18 of scheme 19., wherein the rendering loading unit is in the following way according to
Render mode renders each block for including in the webpage:
If the render mode of the block is synchronous render mode, the complete HTML content of the block is rendered；
If the render mode of the block is asynchronous render mode, the asynchronous load block information of the block, institute are rendered
Stating asynchronous load block information includes HTML node identification, node classification, node content, block controller, block pattern.
The device according to scheme 18 or scheme 19 of scheme 20., wherein the rendering loading unit is in the following way
According to the render mode, each block for including in the webpage is loaded:
If the render mode of the block is synchronous render mode, the complete HTML content of the synchronous load block, and
The block is initialized using block controller；
If the render mode of the block is not initialised for the block controller of asynchronous render mode and the block, root
According to the node content for including in the block, the asynchronous complete HTML content for loading the block, and initialized using block controller
The block.
The device according to scheme 20 of scheme 21., wherein the rendering loading unit is in the following way according to block
In include node content, it is asynchronous load block complete HTML content:
Rendering result acquisition request is sent to the public rendering interface of block, includes described in the rendering result acquisition request
The rendering parameter and rendering interface message for including in node content；
The public rendering interface is received according to the HTML content of the rendering parameter and the rendering interface message rendering；
The HTML content received is filled into block.
The device according to scheme 18 of scheme 22., wherein described device further includes updating unit, the updating unit
For:
It is described rendering loading unit render and load include in the webpage each block after, to the public rendering of block
Interface sends rendering and updates request, described to render the rendering interface message updated include in request in node content and default
Rendering parameter；
The public rendering interface is received according to the HTML of the default rendering parameter and the rendering interface message rendering
More new content；
The HTML received is updated into fills into block, more new block.
A kind of server of scheme 23., wherein the server includes:
Memory is configured to store instruction；And
Processor is configured to that described instruction is called to carry into execution a plan block generation method described in any one of 1- scheme 6.
A kind of server of scheme 24., wherein the server includes:
Memory is configured to store instruction；And
Processor is configured to that described instruction is called to carry into execution a plan webpage rendering side described in any one of 7- scheme 11
Method.
A kind of computer readable storage medium of scheme 25., wherein the computer-readable recording medium storage has computer
Executable instruction, the computer executable instructions when executed by the processor, carry into execution a plan described in any one of 1- scheme 6
Block generation method.
A kind of computer readable storage medium of scheme 26., wherein the computer-readable recording medium storage has computer
Executable instruction, the computer executable instructions when executed by the processor, carry into execution a plan described in any one of 7- scheme 11
Webpage rendering method.
One or more combined individually or with other equipment can be used in any step, operation or program described herein
A hardware or software module are executed or are realized.In one embodiment, software module use includes comprising computer program
The computer program product of the computer-readable medium of code is realized, can be executed by computer processor any for executing
Or whole described step, operation or programs.
For the purpose of example and description, the preceding description that the present invention is implemented is had been presented for.Preceding description is not poor
Also not the really wanting of act property limits the invention to exact form disclosed, according to the above instruction there is likely to be various modifications and
Modification, or various changes and modifications may be obtained from the practice of the present invention.Select and describe these embodiments and be in order to
Illustrate the principle of the present invention and its practical application, so that those skilled in the art can be to be suitable for the special-purpose conceived
Come in a variety of embodiments with various modifications and utilize the present invention.
Claims (17)
1. a kind of block generation method, wherein include:
The block arrangement information of user's input is obtained, the block arrangement information includes node content, block controller, asynchronous category
Property and search engine optimization SEO close friend's attribute；
Preset block generating function is called, according to the block arrangement information, generates block, the block generating function is root
It is determined according to the block arrangement information.
2. according to the method described in claim 1, wherein, the block arrangement information further include: hypertext markup language HTML
Node identification, node classification and block pattern.
3. method according to claim 1 or 2, wherein described after generating block according to the block arrangement information
Method further include:
According to the block arrangement information, determine that the render mode of the block, the render mode include synchronous render mode
With asynchronous render mode.
4. according to the method described in claim 3, wherein, according to the block arrangement information, determining the rendering mould of the block
Formula, comprising:
If visitor determines render mode according to the asynchronous attribute for including in block arrangement information for generic browser；
If visitor determines render mode according to the SEO close friend's attribute for including in block arrangement information for search engine.
5. according to the method described in claim 4, wherein, described according to the SEO close friend's attribute for including in block, determination renders mould
Formula, comprising:
If SEO close friend's attribute characterization is to SEO close friend, it is determined that render mode is synchronous render mode；
If SEO close friend's attribute characterization is unfriendly to SEO, according to the asynchronous attribute for including in block arrangement information, rendering is determined
Mode.
6. method according to claim 4 or 5, wherein according to the asynchronous attribute for including in block arrangement information, determine wash with watercolours
Dye mode, comprising:
If asynchronous attribute characterization is asynchronous, it is determined that render mode is asynchronous render mode；
If asynchronous attribute characterization is non-asynchronous, it is determined that render mode is synchronous render mode.
7. a kind of webpage rendering method, wherein include:
Obtain the webpage of webpage load request and webpage load request institute request of loading；
The block for including in the webpage is obtained, the block is divided to obtain to web page element in advance, and including area
Block configuration information, the block arrangement information include hypertext markup language HTML node identification, node classification, node content,
Block controller, block pattern, asynchronous attribute and search engine optimization SEO close friend's attribute；
The render mode for each block for including in the webpage is obtained, the render mode is true according to the block arrangement information
It is fixed, and including synchronous render mode and asynchronous render mode；
According to the render mode, renders respectively and load each block for including in the webpage.
8. described according to the render mode according to the method described in claim 7, wherein, render in the webpage and include
Each block, comprising:
If the render mode of the block is synchronous render mode, the complete HTML content of the block is rendered；
If the render mode of the block is asynchronous render mode, the asynchronous load block information of the block is rendered, it is described different
Step load block information includes HTML node identification, node classification, node content, block controller, block pattern.
9. method according to claim 7 or 8, wherein it is described according to the render mode, it loads in the webpage and includes
Each block, comprising:
If the render mode of the block is synchronous render mode, the complete HTML content of the synchronous load block, and utilize
Block controller initializes the block；
If the render mode of the block is not initialised for the block controller of asynchronous render mode and the block, basis should
The node content for including in block, the asynchronous complete HTML content for loading the block, and the area is initialized using block controller
Block.
10. according to the method described in claim 9, wherein, according to the node content for including in block, asynchronous load block it is complete
Whole HTML content, comprising:
Rendering result acquisition request is sent to the public rendering interface of block, includes the node in the rendering result acquisition request
The rendering parameter and rendering interface message for including in content；
The public rendering interface is received according to the HTML content of the rendering parameter and the rendering interface message rendering；
The HTML content received is filled into block.
11. according to the method described in claim 7, wherein, render and load include in the webpage each block after, it is described
Method further include:
Rendering, which is sent, to the public rendering interface of block updates request, it is described to render the rendering updated include in request in node content
Interface message and default rendering parameter；
The public rendering interface is received to be updated according to the HTML of the default rendering parameter and the rendering interface message rendering
Content；
The HTML received is updated into fills into block, more new block.
12. a kind of block generating means, wherein include:
Acquiring unit, for obtaining the block arrangement information of user's input, the block arrangement information includes node content, block
Controller, asynchronous attribute and search engine optimization SEO close friend's attribute；
Generation unit, it is raw according to the block arrangement information that the acquiring unit obtains for calling preset block generating function
At block, the block generating function is determined according to the block arrangement information.
13. a kind of webpage rendering device, wherein include:
Acquiring unit, for obtaining the webpage of webpage load request and webpage load request institute request of loading, and
The render mode of the block for including in the webpage and each block for including in the webpage is obtained, the block is pre-
First web page element is divided, and including block arrangement information, the block arrangement information includes hypertext markup
Language HTML node identification, node classification, node content, block controller, block pattern, asynchronous attribute and search engine optimization
SEO close friend's attribute, the render mode is determining according to the block arrangement information, and including synchronous render mode and asynchronous rendering
Mode；
Loading unit is rendered, the render mode for obtaining according to the acquiring unit is rendered respectively and loaded in the webpage
Including each block.
14. a kind of server, wherein the server includes:
Memory is configured to store instruction；And
Processor is configured to that described instruction perform claim is called to require block generation method described in any one of 1-6.
15. a kind of server, wherein the server includes:
Memory is configured to store instruction；And
Processor is configured to that described instruction perform claim is called to require webpage rendering method described in any one of 7-11.
16. a kind of computer readable storage medium, wherein the computer-readable recording medium storage has computer is executable to refer to
It enables, when executed by the processor, perform claim requires block described in any one of 1-6 to generate to the computer executable instructions
Method.
17. a kind of computer readable storage medium, wherein the computer-readable recording medium storage has computer is executable to refer to
It enables, when executed by the processor, perform claim requires webpage wash with watercolours described in any one of 7-11 to the computer executable instructions
Dyeing method.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201811242839.0A CN109508434B (en) | 2018-10-24 | 2018-10-24 | Block generation method, webpage rendering method and device |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201811242839.0A CN109508434B (en) | 2018-10-24 | 2018-10-24 | Block generation method, webpage rendering method and device |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN109508434A true CN109508434A (en) | 2019-03-22 |
| CN109508434B CN109508434B (en) | 2020-07-28 |
Family
ID=65746203
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201811242839.0A Active CN109508434B (en) | 2018-10-24 | 2018-10-24 | Block generation method, webpage rendering method and device |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN109508434B (en) |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN110515606A (en) * | 2019-08-30 | 2019-11-29 | 南京焦点领动云计算技术有限公司 | A kind of Components Development method based on block |
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 |
| CN106610832A (en) * | 2015-10-27 | 2017-05-03 | 阿里巴巴集团控股有限公司 | Page asynchronous rendering method and device |
-
2018
- 2018-10-24 CN CN201811242839.0A patent/CN109508434B/en active Active
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 |
| CN106610832A (en) * | 2015-10-27 | 2017-05-03 | 阿里巴巴集团控股有限公司 | Page asynchronous rendering method and device |
Non-Patent Citations (1)
| Title |
|---|
| 无: "Pagelet的前世今生", 《作业部落：HTTPS://WWW.ZYBULUO.COM/MIRCODE/NOTE/426336》 * |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN110515606A (en) * | 2019-08-30 | 2019-11-29 | 南京焦点领动云计算技术有限公司 | A kind of Components Development method based on block |
Also Published As
| Publication number | Publication date |
|---|---|
| CN109508434B (en) | 2020-07-28 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN106569824B (en) | Method and apparatus, the method and apparatus of page rendering of page data compiling | |
| CN106598574B (en) | Page rendering method and device | |
| CN101122921B (en) | Method forming tree-shaped display structure based on ajax and html | |
| KR102220127B1 (en) | Method and apparatus for customized software development kit (sdk) generation | |
| US20080040661A1 (en) | Method for inheriting a Wiki page layout for a Wiki page | |
| US20080065769A1 (en) | Method and apparatus for argument detection for event firing | |
| CN102096581B (en) | Method and device for generating widget | |
| US20080010345A1 (en) | Method and apparatus for data hub objects | |
| CN107357817B (en) | It is a kind of towards the Web page module design of JSON and its Asynchronous loading method | |
| CN112100550A (en) | Page construction method and device | |
| CN105260424B (en) | The processing method and processing device that user browses web-page histories record and most frequentation is asked | |
| CN107665170B (en) | Flow testing method and device | |
| CN105745644A (en) | Establishment of state representation of a web page represented in a web browser | |
| CN103873318A (en) | Website automated testing method and automated testing system | |
| CN103559097B (en) | The method of interprocess communication, device and browser in a kind of browser | |
| CN110598135A (en) | Network request processing method and device, computer readable medium and electronic equipment | |
| CN113741965A (en) | Method, device and equipment for arranging flow chart and storage medium | |
| TWI519980B (en) | Method and device for displaying web page and computer-readable storage medium | |
| WO2019217214A1 (en) | Personal history recall | |
| JP2008134906A (en) | Business process definition generation method, device and program | |
| CN104156421B (en) | The page shows method, apparatus and system | |
| Nadee et al. | Towards data extraction of dynamic content from JavaScript Web applications | |
| CN109508434A (en) | Block generation method, webpage rendering method and device | |
| CN104834594B (en) | Web system method of testing and device | |
| CN111209463B (en) | Internet data acquisition method and device |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | 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 |