WO2018082562A1 - 页面数据编译的方法、页面渲染的方法、装置及存储介质 - Google Patents

页面数据编译的方法、页面渲染的方法、装置及存储介质 Download PDF

Info

Publication number
WO2018082562A1
WO2018082562A1 PCT/CN2017/108909 CN2017108909W WO2018082562A1 WO 2018082562 A1 WO2018082562 A1 WO 2018082562A1 CN 2017108909 W CN2017108909 W CN 2017108909W WO 2018082562 A1 WO2018082562 A1 WO 2018082562A1
Authority
WO
WIPO (PCT)
Prior art keywords
page
data
application
generation method
script language
Prior art date
Application number
PCT/CN2017/108909
Other languages
English (en)
French (fr)
Inventor
游顺航
黄吉生
胡浩
林超
胡豪俊
桂旭宇
彭海天
Original Assignee
腾讯科技(深圳)有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 腾讯科技(深圳)有限公司 filed Critical 腾讯科技(深圳)有限公司
Priority to US16/343,554 priority Critical patent/US10776567B2/en
Publication of WO2018082562A1 publication Critical patent/WO2018082562A1/zh

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/958Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
    • G06F16/972Access to data in other repository systems, e.g. legacy data or dynamic Web page generation
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00Handling natural language data
    • G06F40/10Text processing
    • G06F40/12Use of codes for handling textual entities
    • G06F40/14Tree-structured documents
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00Handling natural language data
    • G06F40/10Text processing
    • G06F40/103Formatting, i.e. changing of presentation of documents
    • G06F40/117Tagging; Marking up; Designating a block; Setting of attributes
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00Handling natural language data
    • G06F40/20Natural language analysis
    • G06F40/205Parsing
    • G06F40/221Parsing markup language streams
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements 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/44Arrangements for executing specific programs
    • G06F9/448Execution paradigms, e.g. implementations of programming paradigms

Definitions

  • the present application relates to the field of computer technology, and in particular, to a method for compiling page data, a method, device, and a storage medium for page rendering.
  • the application example provides a method for compiling page data, and the method includes:
  • Parsing the initial page structure data to generate corresponding script language page data includes a page generation method and a data variable set, and the input of the page generation method is a current data set determined according to the data variable set, The output of the page generation method is a node tree that matches the current data set of the input;
  • the node tree displays the corresponding page according to the node tree.
  • the application examples also provide an apparatus for compiling page data, the apparatus comprising: one or more memories, one or more processors; wherein the one or more memories store one or more computer readable An instruction module, configured to be executed by the one or more processors; wherein the one or more computer readable instruction modules comprise: an acquisition module, configured to acquire initial page structure data generated by an extended markup language;
  • a compiling module configured to parse the initial page structure data to generate a corresponding script language page data and a data variable set, where the script language page data includes a page generating method, where the input of the page generating method is determined according to the data variable set a data set, the output of the page generation method is a node tree matching the input current data set, and the script language page data is sent to the terminal, so that the terminal determines the current data set according to the data variable set, and And determining, according to the current data set and the page generation method in the script language page data, a matching node tree, and displaying a corresponding page according to the node tree.
  • the application example also provides a method for page rendering, the method comprising:
  • the script language page data includes a page generation method and a data variable set
  • the input of the page generation method is a current data set determined according to the data variable set
  • the output of the page generation method is an input current a node tree in which the data set matches
  • the corresponding page is displayed according to the standard structure data.
  • An example of the present application also provides an apparatus for page rendering, the apparatus comprising: one or more memories, one or more processors; wherein the one or more memories store one or more computer readable instructions A module, configured to be executed by the one or more processors; wherein the one or more computer readable instruction modules comprise:
  • An acquisition module configured to acquire script language page data, where the script language page data includes a page generation method and a data variable set, where the input of the page generation method is a current data set determined according to the data variable set, and the page generation method
  • the output is a node tree
  • a node tree output module configured to acquire page data, determine a current data set according to the page data and the data variable set, and determine, by the page generation method, the node according to the corresponding node tree output by the current data set
  • the tree is transformed into standard structure data describing the view
  • a rendering module configured to display a corresponding page according to the standard structure data.
  • the present application examples also provide a non-transitory computer readable storage medium storing computer readable instructions that cause at least one processor to perform the method as described above.
  • 1 is an application environment diagram of a method for compiling page data and a method for rendering a page in an embodiment
  • Figure 2 is a diagram showing the internal structure of the server of Figure 1 in an embodiment
  • Figure 3 is a diagram showing the internal structure of the terminal of Figure 1 in an embodiment
  • FIG. 4 is a flow chart of a method for compiling page data in an embodiment
  • FIG. 5 is a flowchart of a method for generating a page in an embodiment
  • FIG. 6 is a schematic diagram of a process of a page generation method in a specific embodiment
  • FIG. 8 is a schematic diagram of a process of generating an expression fragment in a specific embodiment
  • FIG. 9 is a flow chart of a method for page rendering in an embodiment
  • FIG. 10 is a schematic diagram of a node tree generated in an embodiment
  • FIG. 11 is a schematic diagram of a page corresponding to the node tree in FIG. 10 in an embodiment
  • FIG. 13 is a schematic diagram of a node tree generated after updating in an embodiment
  • FIG. 14 is a schematic diagram of a page displayed after being updated in an embodiment
  • 15 is a structural block diagram of an apparatus for compiling page data in an embodiment
  • 16 is a structural block diagram of a compiling module in an embodiment
  • 17 is a structural block diagram of an apparatus for compiling page data in another embodiment
  • 19 is a structural block diagram of an apparatus for page rendering in an embodiment
  • 20 is a structural block diagram of an apparatus for page rendering in another embodiment.
  • page presentations are made through front-end templates or back-end templates, and page data written in extended markup syntax is often included in front-end templates or back-end templates.
  • the page markup needs to load the extended markup language page data and the scripting language to parse the data.
  • the scripting language parsing data is used to parse the extended markup language page data to display the page.
  • the front-end template loads the page, it needs to load the script language to parse the data and parse the extended markup language page data, resulting in low page loading efficiency.
  • the page data written by the extended mark syntax is directly parsed into the final view standard data in the background, so that the displayed page is fixed and cannot be updated with the front end dynamic data.
  • the embodiment of the present application provides a page data compiling method, a page rendering method, and a device And the storage medium, so that the compiled page data keeps the page display efficiency while retaining the dynamics.
  • the method for compiling the page data and the method for page rendering can be applied to the system architecture shown in FIG. 1.
  • the application environment includes a terminal 110 and a server 120, wherein the terminal 110 and the server 120 communicate through a network.
  • the terminal 110 can be a smart phone, a tablet computer, a notebook computer, a desktop computer, etc., but is not limited thereto.
  • the server 120 compiles the initial page structure data generated by the extension markup language to generate script language page data, and the script language page data is used for transmission to the terminal 110, so that the terminal 110 displays the corresponding page according to the script language page data.
  • the part that compiles the initial page structure data is placed in the server 120, and the terminal does not need to parse the extended markup language page data every time the page is loaded, thereby improving the efficiency of page display.
  • the script language page data includes a page generation method, and the node tree output by the page generation method matches the input data variable set, and different node trees can be obtained according to different inputs to achieve dynamic update of the page.
  • the internal structure of server 120 in FIG. 1 is as shown in FIG. 2, which includes a processor, storage medium, memory, and network interface connected by a system bus.
  • the storage medium of the server 120 stores an operating system, a database, and a device for compiling page data.
  • the database is used to store data, such as initial page structure data, script language page data, etc., and the device is used to implement a method for compiling page data of the server 120.
  • the processor of the server 120 is used to provide computing and control capabilities to support the operation of the entire server 120.
  • the memory of the server 120 provides an environment for the operation of the device compiled with the page data in the storage medium.
  • the network interface of the server 120 is used to communicate with the terminal 110 via a network connection, such as sending script language page data to the terminal 110, and the like.
  • the structure shown in FIG. 2 is only a block diagram of a part of the structure related to the solution of the present application, and does not constitute a limitation on the server to which the solution of the present application is applied.
  • the specific server may include more or as shown in the figure. Fewer parts, or some parts, or different parts.
  • the internal structure of the terminal 110 in FIG. 1 is as shown in FIG. 3.
  • the terminal 110 includes a processor, a graphics processing unit, a storage medium, a memory, a network interface, a display screen, and an input device connected through a system bus.
  • the storage medium of the terminal 110 stores an operating system, and further includes a device for page rendering, and the device is used to implement a method for page rendering of the terminal.
  • the processor is used to provide computing and control capabilities to support the operation of the entire terminal 110.
  • the graphics processing unit in the terminal 110 is configured to provide at least a rendering capability of the display interface, such as rendering a page, etc.
  • the memory provides an environment for running the device for page rendering in the storage medium
  • the network interface is used for network communication with the server 120, such as The server 120 transmits a download request, receives script language page data, and the like.
  • the display screen is used to display an application interface or the like
  • the input device is used to receive commands or data input by the user.
  • the display screen and the input device can be a touch screen.
  • the structure shown in FIG. 3 is only a block diagram of a part of the structure related to the solution of the present application, and does not constitute a limitation on the terminal to which the solution of the present application is applied.
  • the specific terminal may include more than the figure or Fewer parts, or some parts, or different parts.
  • a method for compiling page data is provided, which is applied to the server in the application environment shown in FIG. 1, and includes the following steps:
  • Step S210 Acquire initial page structure data generated by the extended markup language.
  • the markup language is a combination of text and other information related to the text, showing the textual coding about the structure of the document and the details of the data processing.
  • the extended markup language is based on XML (Extensible Markup Language) extension.
  • the custom markup language is extended based on XML to form a set of custom markup speech.
  • the custom markup voice is called extended markup voice.
  • the syntax of the extended markup language is defined to form a set of template languages.
  • the functions of the template language include conditional control, fixed-length loops, custom reusable clips, full right-value expression support, immediate strings such as 'somestring', and immediate arrays such as [1, 2, 3] .
  • the initial page structure data generated by the extended markup language can describe the page structure flexibly and conveniently through a custom syntax structure.
  • the extended markup language in this embodiment is a markup language independent of rendering, and the rendering layer may be WEBVIEW or a CANVAS canvas.
  • Step S220 parsing the initial page structure data to generate corresponding script language page data
  • the script language page data includes a page generation method and a data variable set
  • the input of the page generation method is a current data set determined according to the data variable set
  • the output of the page generation method The node tree that matches the current data set entered.
  • the initial page structure data often includes different tags, each tag has the attributes of the tag, the content of the tag, and the like, and the attribute of the tag may be a control attribute, and the content of the tag may include an expression, a text content, and the like.
  • the attributes of the label are used to modify the label, such as defining the style of the label itself, the data needed, and so on.
  • the tag includes a plurality of elements, and each element included in the tag constituting the initial page structure data needs to be analyzed, and the data processing logic is obtained, thereby converting the logic and data carried by each tag into the current data set as input, and the node
  • the tree generates a method for outputting the page, that is, obtaining the corresponding script language page data.
  • a scripting language is an interpreted programming language, such as the JavaScript scripting language or VBScript, which does not limit the specific type of scripting language.
  • the data variable collection is a collection of all variables that need to be passed to the page generation method during the page presentation process, and the data variable set is composed by extracting variables in the initial page structure data.
  • the dynamic data can be obtained by the operation of the page to assign a value to the variable in the data variable set, thereby obtaining the current data set, inputting the current data set into the page generation method, and obtaining the node tree corresponding to the current data set, thereby Update the page, such as by clicking on the button on the page, obtaining the current data bound by the button, and updating the data displayed by the page to the current data.
  • Node tree is Taking the elements in the initial page structure data as nodes, there is a tree data structure of the top-down relationship between the parent node and the child nodes. Since the initial page structure data is analyzed and the code is rendered, a page generation method with the node tree as the output is formed, and the front end (the client at the terminal) can automatically output and match the current data set according to the input current data set. Node tree. Since the node tree is a data structure of the existing node relationship that has been parsed, it does not need to be parsed in the terminal. When the node tree is obtained at the front end, it can be directly converted into a standard data structure that can be parsed by the front end to carry the node relationship, thereby quickly performing The rendering of the page.
  • the extended markup language carries a custom syntax and has limitations in the runtime environment, it is compiled into a scripting language on the server, such as generating JavaScript code as the target machine language to remove the client runtime environment. Threshold, and parsing it in advance to generate script language page data while avoiding the problem that the page needs to be parsed in the front-end for the custom syntax, which improves the efficiency of page display.
  • Step S230 the script language page data is sent to the terminal, so that the terminal determines the current data set according to the data variable set, and determines according to the current data set and the page generation method in the script language page data.
  • a matching node tree displays corresponding pages according to the node tree.
  • the script language page data can be matched with different page identifiers, application identifiers, and uploaded user identifiers to establish an association relationship, so as to obtain corresponding target script language page data according to the identifier information in the page data acquisition request sent by the terminal.
  • the server can also actively send to the terminal after generating new script language page data, or custom send rules, such as timing to the terminal.
  • the terminal After receiving the script language page data, the terminal includes the page generation method in the script language page data, so that the corresponding node tree can be generated according to the page generation method, and then the node tree is converted into the data structure of the final description view, and the fast rendering display correspondingly Page.
  • the displayed page can be either a page running inside the application of the operating system or a page running on a browser.
  • the initial page structure data is parsed to generate corresponding script language page data
  • the script language page data includes a page generation method and a data variable set
  • the input of the page generation method is According to the current data set determined by the data variable set
  • the output of the page generation method is a node tree matching the input current data set
  • the script language page data is sent to the terminal, so that the terminal displays the corresponding page according to the script language page data.
  • the task of parsing the initial page structure data is performed on the server, and the terminal does not need to parse the extended markup language page data every time the page is loaded, thereby improving the efficiency of page display, and the script language page data includes the page generation method.
  • the node tree output by the page generation method matches the input current data set, and different node trees can be obtained according to different current data sets input to achieve dynamic update of the page.
  • step S220 includes:
  • Step S221 performing segmentation on the source code corresponding to the initial page structure data to obtain an array of word segmentation elements.
  • the source code corresponding to the initial page structure data is segmented to obtain a word segmentation element, and each word segment element forms an array.
  • the source code 310 corresponding to the initial page structure data is an array 320 obtained after the word segmentation.
  • Step S222 generating a syntax tree with the word segmentation element as a node according to the array.
  • the word segmentation element can be parsed according to the customized grammatical structure feature, and a syntax tree with the word segmentation element as a node is obtained, wherein only a specific element can be used as a node, such as a tag node and a text node. According to the specific content of the word segmentation element, it is determined whether each word segment can be used as a node, or whether it is a node attribute information, such as a control attribute, and a position where the word segment element appears to determine a node relationship between the word segment elements.
  • a complete label includes a start label and an end label
  • first look up the word segmentation element to form a complete label element a complete label as a
  • the tag node searches for attribute information between the start tag and the end tag corresponding to the complete tag as the attribute information corresponding to the current tag node.
  • look for a string and a string expression between the start tag and the end tag and use the found string or string expression as the text child node corresponding to the current tag node, and finally form a syntax tree.
  • FIG. 6 a schematic diagram of the syntax tree 330 corresponding to the array 320 is shown. There are two child nodes 331a and 331b under the root node 331, the node 331a includes one child node 331a1, and the node 331b includes one child node 331b1.
  • Step S223 extracting a variable determination data variable set in the syntax tree, parsing the syntax tree to generate a data generation variable corresponding to the page generation method segment under different logical conditions, and generating a page generation method according to the page generation method segment.
  • all variables of different names existing in the syntax tree are combined to generate a data variable set, wherein the order of each variable can be customized as needed.
  • Variables in the data variable collection are updated based on the data or instructions passed in the front end.
  • the data in the data variable set satisfies different logical conditions, such as a node or an array traversing the node corresponding to the control attribute, corresponding to different child nodes, corresponding to different page generation method fragments.
  • the syntax tree 330 shown in FIG. 6 is under the control logic condition, when the variable is true, that is, when the name is true, the corresponding first page generation method fragment 341, and the variable is false, that is, the second page corresponding to the name is false.
  • Method fragment 342 wherein the specific content of the second page generation method fragment is omitted in the figure.
  • the syntax tree is parsed first, and the syntax tree clearly and hierarchically describes the relationship between the elements, and then according to the syntax tree, the page generation method segments corresponding to different logic conditions can be quickly generated, thereby finally generating a page generation method. .
  • step S223 includes:
  • Step S223a performing a post-order traversal on the syntax tree to obtain a string expression.
  • the post-order traversal refers to first traversing the left subtree, then traversing the right subtree, and finally accessing the root node.
  • the left subtree is still traversed first, then the right subtree is traversed, and finally the root node is traversed, and the string expression corresponding to the text node is obtained during the traversal process.
  • the string expression 410 is obtained, as shown in FIG.
  • Step S223b performing a character expression segmentation on the string expression to obtain an expression therein.
  • the string and the expression are recognized according to the grammatical structure feature, and the string in the string expression is distinguished from the expression to obtain one or more strings and one or more expressions to form an array, as shown in FIG. 420 is an array generated after the string expression 410 is segmented, and then each code is rendered by code, and the expression 430 is coded as shown in FIG.
  • Step S223c parsing the expression to generate an expression fragment in the page generation method segment.
  • the expression may be obtained according to a custom grammatical structural feature, and the basic element corresponding to the expression is formed into an expression array, and the expression array is structurally analyzed to obtain an expression syntax data structure, and the data structure is generated according to the expression syntax.
  • the expression fragment in the fragment, the expression fragment is the corresponding script language code generated after parsing the expression in the markup language.
  • the expression 430 is subjected to expression segmentation to obtain an expression array 440, and parsed to obtain an expression grammar data structure 450, and finally a corresponding expression fragment 460 is generated.
  • the script language page data is used to receive dynamic data at the front end, determine variables in the data variable set according to the dynamic data, obtain a current data set, and input the current data set to the page generation method to generate a node tree.
  • the dynamic data may be data acquired by the terminal before the page is displayed, or may be data acquired by the terminal after the page is displayed, and the data acquired by the terminal may be data acquired in response to the operation of the control on the page.
  • Input box control or action button control and data variables on the page The variables in the set correspond to each other.
  • the terminal responds to the operation of the input box control and responds to the operation of the operation button control, and the acquired data is assigned to the corresponding variable in the data variable set to obtain the current data set.
  • the variables in the data variable set may be one or more, and the current data set is input to the page generation method in the script language page data, thereby outputting a node tree matching the current data set, rendering the page according to the node tree, and according to the acquired
  • the current data collection is a dynamic update page. Since the output node tree is already compiled from the initial page structure data when rendering at the front end, it can be directly converted into the standard structure data describing the view without the need for parsing, and the corresponding page is quickly generated, thereby improving the The speed at which the page is generated.
  • the page can be updated in real time based on dynamic data, keeping the dynamics of the page.
  • the node tree is used to transform the standard structure data describing the view at the front end such that the front end displays the page corresponding to the node tree according to the standard structure data.
  • the parent node and the child nodes corresponding to each parent node can be quickly obtained, and the node tree is quickly converted into standard structure data describing the view according to the hierarchical relationship between the nodes, such as HTML (Hyper Text Markup Language). Language) language data such that the front end displays the page corresponding to the node tree based on the standard structure data.
  • HTML Hyper Text Markup Language
  • the method for compiling page data provided by the present application may further be used to compile page data of a sub-application under a parent application, where the initial page structure data is sub-application initial page structure data. Used to describe the sub-application page structure running in the parent application on the operating system.
  • the sub-application is an application that is attached to the parent application, and can download, start, run, and close the sub-application through the parent application.
  • the parent application can be a social application, a dedicated application that specifically supports the sub-application, a file management application, a mail application, or a game application.
  • Social applications include instant messaging applications, SNS (Social Network Service) applications, or live applications.
  • the sub-application is an application that can be implemented in an environment provided by the parent application, and the sub-application may specifically be a social application, a file management application, a mail application, or a game application. Every The pages in the sub-applications have corresponding initial page structure data, which is used to describe the sub-application page structure.
  • the initial page structure data corresponding to each sub-application is compiled into the script language page data in the server, the initial page structure data, that is, the source code is not exposed to the client, thereby avoiding the sub-application page being copied and tampered, thereby improving the security of the application. .
  • the initial page structure data corresponds to the sub-application page identifier
  • the method for compiling the page data provided by the application further includes: establishing an association relationship between the script language page data corresponding to the initial page structure data and the sub-application page identifier, and receiving
  • the current sub-application page identifier sent by the terminal acquires the target script language page data corresponding to the current sub-application page identifier according to the association relationship, and sends the target script language page data to the terminal.
  • the current sub-application page identifier may be carried in a page data acquisition request sent by the terminal.
  • each sub-application may have multiple pages
  • the developer carries the sub-application page identifier matched by each page when uploading the initial page structure data, and generates a script language after generating the script language page data corresponding to the initial page structure data.
  • the association relationship between the page data and the sub-application page identifier so that the display terminal of the sub-application page can download the corresponding target script language page data through the sub-application page identifier, thereby displaying the corresponding page.
  • the initial page structure data further includes the sub-application identifiers matched by the sub-applications.
  • the method for compiling page data provided by the present application further includes: acquiring application code data corresponding to the parent application, and packaging the script language page data corresponding to the initial application page structure data of the child application into the application code data.
  • the script language page data corresponding to the initial application page structure data of the sub-application is packaged into the application code data of the parent application, and the user can obtain the page data of each sub-application when the parent application is downloaded, thereby displaying the corresponding sub-application page.
  • the sub-application page can be opened directly in the parent application without jumping to the browser, which improves the convenience of page display.
  • the page data is already stored in the terminal, and no need to pass through the server. Network transmission acquires page data, which improves the efficiency of page display.
  • a method for page rendering is provided, which is applied to the terminal in the application environment shown in FIG. 1, and includes the following steps:
  • Step S510 acquiring script language page data, where the script language page data includes a page generation method and a data variable set, where the input of the page generation method is a current data set determined according to the data variable set, and the output of the page generation method is a node tree matching the current data set, and determining a node tree matching the current data set according to the current data set and the page generation method in the script language page data.
  • the scripting language is an interpreted programming language, such as a JavaScript scripting language or VBScript, and the specific type of the scripting language is not limited.
  • the script language page data is data written by the scripting language to describe the structure of the page. Since the script language page data is a scripting language, there is no extended custom syntax, and the client can directly parse it, such as through a browser or a webview. Analyze it.
  • the page generation method includes a page generation method segment corresponding to the data variable set under different logic conditions, so that the corresponding target page generation method segment can be obtained according to the logical condition that the different data variable sets satisfy, and the segment output corresponding to the target page generation method is output.
  • Node tree The data variable collection is a collection of all the variables that need to be passed to the page generation method during the page display process.
  • the dynamic data can be obtained by assigning dynamic data to the variables in the data variable collection, thereby updating the page, such as Clicking on the button on the page, obtaining the current data bound by the button, and updating the data displayed on the page to the current data.
  • the node tree is a tree-like data structure in which a markup language or an extended markup language element is a node, and there is a top-down relationship between the parent node and the child node.
  • the node tree can automatically output the matching node tree according to the input. Since the node tree is the data structure of the existing node relationship that has been parsed, it does not need to be parsed in the terminal. When the node tree is obtained in the front end, it can be directly converted into the front end to be parsed. A standard data structure that carries node relationships to quickly render pages. Number of pages According to the scripting language, the problem of parsing the custom syntax of the markup language in the front end is avoided every time the page is loaded, which improves the efficiency of page display.
  • Step S520 Obtain page data, determine a current data set according to the page data and the data variable set, and determine that the page generation method converts the node tree into standard structure data describing the view according to the corresponding node tree output by the current data set.
  • the page data may be default data, or may be data extracted from the currently running application or browser, such as the currently logged in user name, may include one or more data, or may be obtained after the event response. Response data.
  • the page data is respectively corresponding to the variables in the data variable set to form a current data set, and the current data set is passed to the page generation method, and according to the current logical condition that the current data set satisfies, the corresponding target page generation method segment is obtained, thereby outputting The target node tree corresponding to the current data set.
  • the target node tree is transformed to generate standard structure data describing the view, such as transforming and generating HTML data.
  • the default data name is empty before the current page is displayed, so that the node tree output according to the name is the node tree shown in FIG.
  • step S530 the corresponding page is displayed according to the standard structure data.
  • Figure 11 shows a schematic diagram of the page displayed.
  • the script language page data is acquired, the script language page data includes a page generation method data variable set, and the input of the page generation method is a current data set determined according to the data variable set, and the output of the page generation method is the current data.
  • the matching node tree is collected, the page data is obtained, each variable in the data variable set is determined according to the page data, and the current data set is obtained.
  • the page generation method outputs the corresponding node tree according to the current data set, and transforms the node tree to generate a standard structure describing the view.
  • the client obtains the compiled script language page data, does not require the terminal to parse the extended markup language page data every time the page is loaded, and improves the page exhibition
  • the efficiency of the display while the script language page data includes the page generation method, the node tree output by the page generation method matches the input current data set, obtains different page data, and the determined current data set is also different, thereby obtaining different node trees. , to achieve dynamic updates of the page.
  • the scripting language page data is sub-application scripting language page data for describing a sub-application page structure running in a parent application on the operating system.
  • the sub-application is an application that is attached to the parent application, and can download, start, run, and close the sub-application through the parent application.
  • the parent application can be a social application, a dedicated application that specifically supports the sub-application, a file management application, a mail application, or a game application.
  • Social applications include instant messaging applications, SNS (Social Network Service) applications, or live applications.
  • the sub-application is an application that can be implemented in an environment provided by the parent application, and the sub-application may specifically be a social application, a file management application, a mail application, or a game application.
  • the pages in each sub-application have corresponding script language page data, which is used to describe the sub-application page structure.
  • the script language page data corresponding to each sub-application can be the script language data generated by the initial page structure data after the server is compiled, the initial page structure data, that is, the source code is not exposed on the client, and the sub-application page is prevented from being copied and falsified. Improve the security of your app.
  • the initial page structure data is generated by the extended markup language, and the initial page structure data generated by the extended markup language can describe the page structure flexibly and conveniently through a customized syntax structure.
  • step S410 includes: sending a parent application download request to the server, receiving application code data corresponding to the parent application returned by the server, and extracting sub-application script language page data from the application code data.
  • the script language page data is packaged into the application code data of the parent application, and the user can obtain the page data of each sub-application when downloading the parent application, thereby displaying the corresponding sub-application page, and directly opening the sub-application in the parent application.
  • the page does not need to jump to the browser, which improves the convenience of the page display.
  • the page data is already Stored in the terminal, it is no longer necessary to obtain page data from the server through the network transmission, which improves the efficiency of page display.
  • the step S410 includes: sending a page data acquisition request to the server, where the page data acquisition request carries the current sub-application page identifier, so that the server obtains the target script language page data corresponding to the current sub-application page identifier, and the receiving server returns Script language page data.
  • each sub-application may have multiple pages
  • the server may store script language page data corresponding to multiple pages, and the display terminal of the sub-application page needs to download the corresponding target script language page data through the sub-application page identifier. Thereby displaying the corresponding page.
  • the sub-application identifier is further included when the page data acquisition request is sent to distinguish different sub-applications. By carrying the identification information in the page data acquisition request, only the page that needs to be displayed can be downloaded, and the page downloading is flexible and convenient.
  • the method further includes:
  • Step S610 Acquire a trigger event for the page, and obtain corresponding event response data according to the trigger event.
  • each trigger event corresponds to a matching event response
  • the event type of the trigger event may be determined first, and then the logic code matching the event type in the page logic code is used to process the event, and the corresponding event response data is obtained.
  • Step S620 Update the current data set to the first data set according to the event response data, and determine a corresponding first node tree that is output by the page generation method according to the first data set.
  • the event response data can be bound to the variable in the data variable set, so that when the event response data is different from the previous assignment data, the bound variable is re-assigned to the event response data, so that the current data set is updated to the first
  • the data collection causes the page generation method to output an updated first node tree.
  • the page first displays "hi,guest", and the variable name is empty. After receiving the user's click event on the button, the event response corresponding to the click event is obtained.
  • the event response is an update data response, and the name is changed from empty to "world”.
  • the string hello exists before the variable name, so that the text node in the output node tree corresponds to "hello world", as shown in FIG. 13 is a schematic diagram of the updated first node tree.
  • Step S630 updating the display page according to the first node tree.
  • FIG. 14 it is a schematic diagram of an updated page in a specific embodiment.
  • the event response corresponding to the event can be customized according to requirements, so that the value of the data variable is updated by the preset logic by the trigger of the event, and the updated node tree is generated, thereby rendering a new page and conveniently updating the page.
  • an apparatus for compiling page data comprising: one or more memories, one or more processors; wherein the one or more memories store one or More than one computer readable instruction module configured to be executed by the one or more processors; wherein the one or more computer readable instruction modules comprise:
  • the obtaining module 710 is configured to obtain initial page structure data generated by the extended markup language.
  • the compiling module 720 is configured to parse the initial page structure data to generate a corresponding script language page data and a data variable set, where the script language page data includes a page generating method, and the input of the page generating method is determined according to the data variable set.
  • a current data set the output of the page generating method is a node tree matching the input current data set, and the script language page data is sent to the terminal, so that the terminal determines the current data set according to the data variable set. And determining, according to the current data set and the page generation method in the script language page data, a matching node tree, and displaying a pair according to the node tree The page should be.
  • the compiling module 720 includes:
  • the word segmentation unit 721 is configured to perform segmentation of the source code corresponding to the initial page structure data to obtain an array of word segmentation elements.
  • the syntax tree generating unit 722 is configured to generate a syntax tree with the word segmentation element as a node according to the array.
  • a page generation method generating unit 723, configured to extract a variable determination data variable set in the syntax tree, and parse the syntax generation tree to generate a data variable set corresponding to a page generation method segment under different logical conditions, according to the page generation method segment
  • the page generation method is generated.
  • the page generation method generating unit 723 is further configured to perform post-order traversal on the syntax tree, obtain a string expression, perform a character expression segmentation on the string expression, obtain an expression therein, and parse the expression. Generating an expression fragment in the page generation method fragment.
  • the compiling module 720 is further configured to: enable the terminal to acquire page data at the front end, determine a current data set according to the page data and the data variable set, and input the current data set to The page generation method generates a node tree, and displays a corresponding page according to the node tree.
  • the compiling module 720 is further configured to enable the terminal to transform the node tree into a standard structure data describing a view, and display, according to the standard structure data, the corresponding node tree. page.
  • the initial page structure data is a sub-application initial page structure data for describing a sub-application page structure running in a parent application on the operating system.
  • the one or more computer readable instruction modules include:
  • the packaging module 730 is configured to obtain application code data corresponding to the parent application, and package the script language page data corresponding to the initial application page structure data into the application code data.
  • the initial page structure data corresponds to the sub-application page identifier.
  • the one or more computer readable instruction modules further includes:
  • the association relationship establishing module 740 is configured to establish an association relationship between the script language page data corresponding to the initial page structure data and the sub-application page identifier.
  • the sending module 750 is configured to receive a page data acquisition request sent by the terminal, where the page data acquisition request carries a current sub-application page identifier, and acquires script language page data corresponding to the current sub-application page identifier according to the association relationship, where the Script language page data is sent to the terminal.
  • the present application example also proposes a hardware structure including one or more memories, one or more processors, and functions of an apparatus or method for implementing the above-described page data compilation.
  • an apparatus for page rendering comprising: one or more memories, one or more processors; wherein the one or more memories store one or one
  • the above computer readable instruction module is configured to be executed by the one or more processors; wherein the one or more computer readable instruction modules comprise:
  • the obtaining module 810 is configured to obtain script language page data, where the script language page data includes a page generating method and a data variable set, where the input of the page generating method is a current data set determined according to the data variable set, and the page generating method
  • the output is a node tree.
  • the node tree output module 820 is configured to acquire page data, determine a current data set according to the page data and the data variable set, and determine that the page generation method is according to the The corresponding node tree output from the previous data set transforms the node tree into standard structure data describing the view.
  • the rendering module 830 is configured to display a corresponding page according to the standard structure data.
  • the initial page structure data is a sub-application initial page structure data for describing a sub-application page structure running in a parent application on the operating system.
  • the obtaining module 810 is further configured to send a parent application download request to the server, receive application code data corresponding to the parent application returned by the server, and extract the sub-application script language page data from the application code data.
  • the obtaining module 810 is further configured to send a page data obtaining request to the server, where the page data obtaining request carries the current sub-application page identifier, so that the server obtains the script language page data corresponding to the current sub-application page identifier, Receive script language page data returned by the server.
  • the one or more computer readable instruction modules further include:
  • An update display module 840 configured to acquire a trigger event for the page, obtain corresponding event response data according to the trigger event, update the current data set to a first data set according to the event response data, and determine the The page generation method displays the page according to the first node tree update according to the corresponding first node tree output by the first data set.
  • the present application example also proposes a hardware structure including one or more memories, one or more processors, and functions of an apparatus or method for implementing the above-described page rendering.
  • the present application examples also provide a non-transitory computer readable storage medium storing computer readable instructions that cause at least one processor to perform the method as described above.
  • the computer hardware program is used to instruct related hardware, and the program can be stored in a computer readable storage medium.
  • the program can be stored in a storage medium of the computer system and used by the computer.
  • At least one processor in the system executes to implement a process comprising an embodiment of the methods as described above.
  • the storage medium may be a non-volatile storage medium, such as a magnetic disk, an optical disk, a read-only memory (ROM), or a random access memory (RAM).

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • General Health & Medical Sciences (AREA)
  • Computational Linguistics (AREA)
  • Artificial Intelligence (AREA)
  • Health & Medical Sciences (AREA)
  • Databases & Information Systems (AREA)
  • Multimedia (AREA)
  • Data Mining & Analysis (AREA)
  • Information Transfer Between Computers (AREA)
  • Stored Programmes (AREA)

Abstract

一种页面数据编译的方法和装置,所述方法包括:获取由扩展标记语言生成的初始页面结构数据(S210),解析所述初始页面结构数据生成对应的脚本语言页面数据,所述脚本语言页面数据包括页面生成方法及数据变量集合,所述页面生成方法的输入为当前数据变量集合,所述页面生成方法的输出为节点树(S220);所述脚本语言页面数据用于发送至终端,以使所述终端根据所述脚本语言页面数据显示对应的页面(S230)。应用该方法能够提高页面展示效率的同时保留动态性,另外还提供了一种页面渲染的方法和装置。

Description

页面数据编译的方法、页面渲染的方法、装置及存储介质
本申请要求于2016年11月7日提交中国专利局、申请号为201610975743.X、申请名称为“页面数据编译的方法和装置、页面渲染的方法和装置”的中国专利申请的优先权,其全部内容通过引用结合在本申请中。
技术领域
本申请涉及计算机技术领域,特别是涉及页面数据编译的方法、页面渲染的方法、装置及存储介质。
背景技术
随着计算机技术的发展,用户可以在终端上安装各种应用程序,在应用程序内部展示页面或通过浏览器展示页面,从而浏览页面获取感兴趣的内容。
技术内容
本申请实例提供了一种页面数据编译的方法,所述方法包括:
解析所述初始页面结构数据生成对应的脚本语言页面数据,所述脚本语言页面数据包括页面生成方法及数据变量集合,所述页面生成方法的输入为根据数据变量集合确定的当前数据集合,所述页面生成方法的输出为与输入的当前数据集合匹配的节点树;
将所述脚本语言页面数据发送至终端,以使所述终端根据所述数据变量集合确定当前数据集合,及根据所述当前数据集合及所述脚本语言页面数据中的所述页面生成方法确定匹配的节点树,根据所述节点树显示对应的页面。
本申请实例还提供了一种页面数据编译的装置,所述装置包括:一个或一个以上存储器,一个或一个以上处理器;其中,所述一个或一个以上存储器存储有一个或者一个以上计算机可读指令模块,经配置由所述一个或者一个以上处理器执行;其中,所述一个或者一个以上计算机可读指令模块包括:获取模块,用于获取由扩展标记语言生成的初始页面结构数据;
编译模块,用于解析所述初始页面结构数据生成对应的脚本语言页面数据及数据变量集合,所述脚本语言页面数据包括页面生成方法,所述页面生成方法的输入为根据数据变量集合确定的当前数据集合,所述页面生成方法的输出为与输入的当前数据集合匹配的节点树,将所述脚本语言页面数据发送至终端,以使所述终端根据所述数据变量集合确定当前数据集合,及根据所述当前数据集合及所述脚本语言页面数据中的所述页面生成方法确定匹配的节点树,根据所述节点树显示对应的页面。
本申请实例还提供了一种页面渲染的方法,所述方法包括:
获取脚本语言页面数据,所述脚本语言页面数据包括页面生成方法及数据变量集合,所述页面生成方法的输入为根据数据变量集合确定的当前数据集合,所述页面生成方法的输出为输入的当前数据集合匹配的节点树;
及根据所述当前数据集合及所述脚本语言页面数据中的所述页面生成方法确定与所述当前数据集合匹配的节点树,
获取页面数据,根据所述页面数据及所述数据变量集合确定当前数据集合,确定所述页面生成方法根据所述当前数据集合输出的对应的节点树,将所述节点树变换成描述视图的标准结构数据;
根据所述标准结构数据显示对应的页面。
本申请实例还提供了一种页面渲染的装置,所述装置包括:一个或一个以上存储器,一个或一个以上处理器;其中,所述一个或一个以上存储器存储有一个或者一个以上计算机可读指令模块,经配置由所述一个或者一个以上处理器执行;其中,所述一个或者一个以上计算机可读指令模块包括:
获取模块,用于获取脚本语言页面数据,所述脚本语言页面数据包括页面生成方法及数据变量集合,所述页面生成方法的输入为根据数据变量集合确定的当前数据集合,所述页面生成方法的输出为节点树;
节点树输出模块,用于获取页面数据,根据所述页面数据及所述数据变量集合确定当前数据集合,确定所述页面生成方法根据所述当前数据集合输出的对应的节点树,将所述节点树变换成描述视图的标准结构数据;
渲染模块,用于根据所述标准结构数据显示对应的页面。
本申请实例还提供了一种非易失性计算机可读存储介质,存储有计算机可读指令,可以使至少一个处理器执行如上述所述的方法。
附图说明
图1为一个实施例中页面数据编译的方法、页面渲染的方法运行的应用环境图;
图2为一个实施例中图1中服务器的内部结构图;
图3为一个实施例中图1中终端的内部结构图;
图4为一个实施例中页面数据编译的方法的流程图;
图5为一个实施例中生成页面生成方法的流程图;
图6为一个具体的实施例中页面生成方法的过程示意图;
图7为一个实施例中生成表达式片段的流程图;
图8为一个具体的实施例中生成表达式片段的过程示意图;
图9为一个实施例中页面渲染的方法的流程图;
图10为一个实施例中生成的节点树的示意图;
图11为一个实施例中图10中节点树对应的页面示意图;
图12为一个实施例中更新显示页面的流程图;
图13为一个实施例中更新后生成的节点树示意图;
图14为一个实施例中更新后显示的页面示意图;
图15为一个实施例中页面数据编译的装置的结构框图;
图16为一个实施例中编译模块的结构框图;
图17为另一个实施例中页面数据编译的装置的结构框图;
图18为再一个实施例中页面数据编译的装置的结构框图;
图19为一个实施例中页面渲染的装置的结构框图;
图20为另一个实施例中页面渲染的装置的结构框图
具体实施方式
在一些实例中,通过前端模版或后端模版进行页面的展示,前端模版或后端模版中往往包括了扩展标记语法编写的页面数据。如果通过前端模版实现,则页面展示时需要加载扩展标记语言页面数据和脚本语言解析数据。脚本语言解析数据用于对扩展标记语言页面数据进行解析,从而展示页面。每次在前端模板载入页面时都需要加载脚本语言解析数据并对扩展标记语言页面数据进行解析,导致页面载入效率低。如果通过后端模版实现,则在后台直接将扩展标记语法编写的页面数据全部解析为最终的视图标准数据,导致展示的页面固定不变,不能随着前端动态数据而更新。
本申请实施例提供了页面数据编译的方法、页面渲染的方法、装置 及存储介质,使得编译生成的页面数据在提高页面展示效率的同时保留动态性。上述页面数据编译的方法、页面渲染的方法可应用于图1所示的系统架构,如图1所示,该应用环境包括终端110和服务器120,其中终端110、服务器120通过网络进行通信。
终端110,可为智能手机、平板电脑、笔记本电脑、台式计算机等,但并不局限于此。服务器120将扩展标记语言生成的初始页面结构数据进行编译生成脚本语言页面数据,脚本语言页面数据用于发送至终端110,以使终端110根据脚本语言页面数据显示对应的页面。其中将初始页面结构数据进行编译的部分放在服务器120完成,不需要终端每次页面加载后再对扩展标记语言页面数据进行解析,提高了页面展示的效率。同时脚本语言页面数据包括了页面生成方法,页面生成方法输出的节点树与输入的数据变量集合匹配,可根据输入的不同得到不同的节点树,达到页面的动态更新。
在一个实施例中,图1中服务器120的内部结构如图2所示,该服务器120包括通过系统总线连接的处理器、存储介质、内存和网络接口。其中,该服务器120的存储介质存储有操作系统、数据库和一种页面数据编译的装置。其中,数据库用于存储数据,如初始页面结构数据、脚本语言页面数据等,该装置用于实现一种适用于服务器120的页面数据编译的方法。该服务器120的处理器用于提供计算和控制能力,支撑整个服务器120的运行。该服务器120的内存为存储介质中的页面数据编译的装置的运行提供环境。该服务器120的网络接口用于与终端110通过网络连接通信,比如向终端110发送脚本语言页面数据等。图2中示出的结构,仅仅是与本申请方案相关的部分结构的框图,并不构成对本申请方案所应用于其上的服务器的限定,具体的服务器可以包括比图中所示更多或更少的部件,或者组合某些部件,或者具有不同的部件布置。
在一个实施例中,图1中的终端110的内部结构如图3所示,该终端110包括通过系统总线连接的处理器、图形处理单元、存储介质、内存、网络接口、显示屏幕和输入设备。其中,终端110的存储介质存储有操作系统,还包括页面渲染的装置,该装置用于实现一种适用于终端的页面渲染的方法。该处理器用于提供计算和控制能力,支撑整个终端110的运行。终端110中的图形处理单元用于至少提供显示界面的绘制能力,如渲染页面等,内存为存储介质中的页面渲染的装置的运行提供环境,网络接口用于与服务器120进行网络通信,如向服务器120发送下载请求、接收脚本语言页面数据等。显示屏幕用于显示应用界面等,输入设备用于接收用户输入的命令或数据等。对于带触摸屏的终端110,显示屏幕和输入设备可为触摸屏。图3中示出的结构,仅仅是与本申请方案相关的部分结构的框图,并不构成对本申请方案所应用于其上的终端的限定,具体的终端可以包括比图中所示更多或更少的部件,或者组合某些部件,或者具有不同的部件布置。
在一个实施例中,如图4所示,提供了一种页面数据编译的方法,应用于上述图1所示的应用环境中的服务器,包括以下步骤:
步骤S210,获取由扩展标记语言生成的初始页面结构数据。
具体的,标记语言是一种将文本以及文本相关的其他信息结合起来,展现出关于文档结构和数据处理细节的文字编码,扩展标记语言是指基于XML(Extensible Markup Language,可扩展标记语言)扩展的自定义标记语言,基于XML进行扩展形成一套自定义标记语音,后续,该自定义标记语音称为扩展标记语音。在一个实施例中,定义了扩展标记语言的语法形成一套模版语言。模版语言的功能包括条件控制、定长循环、自定义可复用片段,提供完整的右值表达式支持,支持立即字符串如‘somestring’以及立即数组如[1,2,3]等数据类型。页面结构数 据是指用于描述页面结构的数据,包括基本视图元素数据、条件控制数据、表达式数据、遍历数组数据等,通过不同类型数据的组合完成对需要展示的页面的不同配置,从而能展示不同的页面。通过扩展标记语言生成的初始页面结构数据可通过自定义的语法结构灵活方便的描述页面结构。本实施例中的扩展标记语言是一种与渲染无关的标记语言,渲染层可能是WEBVIEW,也可能是CANVAS画布。
步骤S220,解析初始页面结构数据生成对应的脚本语言页面数据,脚本语言页面数据包括页面生成方法及数据变量集合,页面生成方法的输入为根据数据变量集合确定的当前数据集合,页面生成方法的输出为与输入的当前数据集合匹配的节点树。
具体的,初始页面结构数据中往往包括了不同的标签,每个标签都存在标签的属性、标签的内容等数据,标签的属性可能为控制属性,标签的内容中可包括表达式、文本内容等。其中标签的属性用于对标签进行修饰,如定义标签本身的样式、需要的数据等。标签包括多个元素,需要对组成初始页面结构数据的标签中包含的各个元素进行分析,获取其中的数据处理逻辑,从而将各个标签携带的逻辑、数据转换为以当前数据集合为输入,以节点树为输出的页面生成方法,即得到对应的脚本语言页面数据。脚本语言是一种解释性的编程语言,如JavaScript脚本语言或者VBScript,对脚本语言的具体类型不作限定。数据变量集合是页面展示过程中需要传递至页面生成方法的所有变量的集合,通过提取初始页面结构数据中的变量组成数据变量集合。在页面展示过程中,可通过对页面的操作获取动态数据为数据变量集合中的变量赋值,从而得到当前数据集合,将当前数据集合输入页面生成方法,获得与当前数据集合对应的节点树,从而更新页面,如通过对页面上的按钮的点击,获取按钮绑定的当前数据,将页面展示的数据更新为当前数据。节点树是 以初始页面结构数据中的元素为节点,存在自上而下的父节点与子节点关系的树形数据结构。由于通过对初始页面结构数据进行分析并进行代码渲染后,形成了以节点树为输出的页面生成方法,在前端(终端处的客户端)可根据输入的当前数据集合自动输出与当前数据集合匹配的节点树。由于节点树是已经解析完成的存在节点关系的数据结构,从而不需要在终端再进行解析,在前端得到节点树时可直接转换为前端能解析的携带节点关系的标准数据结构,从而快速的进行页面的渲染。
扩展标记语言由于携带了自定义的语法,存在运行环境的限制,所以采用在服务器将其编译为以脚本语言的方式,如将JavaScript脚本语言作为目标机器语言生成代码以去除对客户端运行时环境的门槛,且提前对其进行解析生成脚本语言页面数据同时避免了页面每加载一次就需要在前端对自定义语法进行解析的问题,提高了页面展示的效率。
步骤S230,将脚本语言页面数据发送至终端,以使所述终端根据所述数据变量集合确定当前数据集合,及根据所述当前数据集合及所述脚本语言页面数据中的所述页面生成方法确定匹配的节点树,根据所述节点树显示对应的页面。
具体的,脚本语言页面数据可与不同的页面标识、应用标识、上传用户标识等进行匹配,建立关联关系,从而根据终端发送的页面数据获取请求中的标识信息获取对应的目标脚本语言页面数据并发送至终端。服务器也可在生成新的脚本语言页面数据后主动发送至终端,或自定义发送规则,如定时发送至终端。终端接收到脚本语言页面数据后,由于脚本语言页面数据中包括了页面生成方法,从而能根据页面生成方法生成对应的节点树,再将节点树转换为最终描述视图的数据结构,快速渲染显示对应的页面。显示的页面可以是运行于操作系统的应用内部的页面,也可以是基于浏览器运行的页面。
本实施例中,通过获取由扩展标记语言生成的初始页面结构数据,解析初始页面结构数据生成对应的脚本语言页面数据,脚本语言页面数据包括页面生成方法及数据变量集合,页面生成方法的输入为根据数据变量集合确定的当前数据集合,页面生成方法的输出为与输入的当前数据集合匹配的节点树,脚本语言页面数据用于发送至终端,以使终端根据脚本语言页面数据显示对应的页面,其中对初始页面结构数据进行解析的任务放在服务器完成,不需要终端每次页面加载后再对扩展标记语言页面数据进行解析,提高了页面展示的效率,同时脚本语言页面数据包括了页面生成方法,页面生成方法输出的节点树与输入的当前数据集合匹配,可根据输入的不同的当前数据集合得到不同的节点树,达到页面的动态更新。
在一个实施例中,如图5所示,步骤S220包括:
步骤S221,对初始页面结构数据对应的源代码进行分词得到分词元素组成的数组。
具体的,根据自定义的语法结构特征和最小元素单元对初始页面结构数据对应的源代码进行分词得到分词元素,各个分词元素组成一个数组。如图6所示为初始页面结构数据对应的源代码310,进行分词后得到的数组320。
步骤S222,根据数组生成以分词元素为节点的语法树。
具体的,可根据自定义的语法结构特征对分词元素进行解析,得到以分词元素为节点的语法树,其中只有特定的元素能作为节点,如标签节点、文本节点。根据分词元素的具体内容确定各个分词是否可作为节点,或是否为节点的属性信息,如控制属性,以及分词元素出现的位置确定分词元素间的节点关系。如一个完整的标签包括开始标签和结束标签,则先查找分词元素构成一个完整标签的元素,一个完整标签作为一 个标签节点,再在完整标签对应的开始标签和结束标签之间查找属性信息,作为当前标签节点对应的属性信息。再在开始标签和结束标签之间查找是否存在字符串及字符串表达式,并将查找到的字符串或字符串表达式作为当前标签节点对应的文本子节点,最终形成语法树。如图6所示,数组320对应的语法树330示意图。其中在根节点331下包括2个子节点331a和331b,节点331a包括一个子节点331a1,节点331b包括一个子节点331b1。
步骤S223,提取语法树中的变量确定数据变量集合,解析语法树生成数据变量集合在不同逻辑条件下对应的页面生成方法片段,根据页面生成方法片段生成页面生成方法。
具体的,将语法树中存在的不同名称的所有变量组合生成数据变量集合,其中各个变量的顺序可根据需要自定义。数据变量集合中的变量会根据前端传入的数据或指令进行更新。当数据变量集合中的数据满足不同的逻辑条件时,如对于控制属性对应的节点或数组遍历节点,会对应不同的子节点,从而对应不同的页面生成方法片段。如图6所示的语法树330在控制逻辑条件下,当变量为真,即name为真时对应的第一页面生成方法片段341,和变量为假即name为假时对应的第二页面生成方法片段342,其中第二页面生成方法片段的具体内容在图中省略。对于包含条件控制属性的节点,每个节点分配唯一的标号,如图中cond=1表示为1的标号,不同的标号都有对应的页面生成方法片段。
本实施例中,先解析生成语法树,语法树清晰有层次的描述出各个元素间的关系,再根据语法树可快速生成在不同逻辑条件下对应的页面生成方法片段,从而最终生成页面生成方法。
在一个实施例中,如图7所示,步骤S223包括:
步骤S223a,对语法树进行后序遍历,获取字符串表达式。
具体的,后序遍历是指首先遍历左子树,然后遍历右子树,最后访问根结点。在遍历左、右子树时,仍然先遍历左子树,然后遍历右子树,最后遍历根结点,遍历的过程中获取文本节点对应的字符串表达式。在一个具体的实施例中,获取得到字符串表达式410,如图8所示。
步骤S223b,对字符串表达式进行字符表达式分词获取其中的表达式。
具体的,根据语法结构特征识别字符串和表达式,将字符串表达式中的字符串与表达式进行区分得到一个或多个字符串及一个或多个表达式组成数组,如图8中数组420为字符串表达式410分词后生成的数组,再对每个表达式进行代码渲染,如图8所示对表达式430进行代码渲染。
步骤S223c,对表达式进行解析生成页面生成方法片段中的表达式片段。
具体的,可根据自定义的语法结构特征对表达式进行分词得到表达式对应的基础元素组成表达式数组,对表达式数组进行结构分析得到表达式语法数据结构,根据表达式语法数据结构生成方法片段中的表达式片段,表达式片段是对标记语言中的表达式进行解析后生成的对应的脚本语言代码。如图8所示,对表达式430进行表达式分词得到表达式数组440,并进行解析得到表达式语法数据结构450,最终生成对应的表达式片段460。
在一个实施例中,脚本语言页面数据用于在前端接收动态数据,根据动态数据确定数据变量集合中的各变量,得到当前数据集合,输入当前数据集合至页面生成方法生成节点树。
具体的,动态数据可以是展示页面前终端获取的数据,也可以是展示页面后终端获取的数据,终端获取的数据可以是响应于对页面上的控件的操作获取的数据。页面上的输入框控件或操作按钮控件与数据变量 集合中的变量相对应,终端响应于对输入框控件的操作及响应于对操作按钮控件的操作,获取数据赋值给数据变量集合中的对应变量,得到当前数据集合。数据变量集合中的变量可为一个或多个,当前数据集合输入至脚本语言页面数据中的页面生成方法,从而输出与当前数据集合匹配的节点树,根据节点树渲染页面,并根据获取的不同的当前数据集合动态的更新页面。由于在前端进行渲染时,输出的节点树已经是从初始页面结构数据编译后的数据,因此不需要再进行解析就可直接转换为描述视图的标准结构数据,快速生成对应的页面,从而提高了页面生成的速度。且可根据动态数据实时更新页面,保留了页面的动态性。
在一个实施例中,节点树用于在前端变换生成描述视图的标准结构数据,以使得前端根据标准结构数据显示节点树对应的页面。
具体的,根据节点树可快速获取父节点和各个父节点对应的子节点,根据节点间的层次关系快速将节点树转换为描述视图的标准结构数据,如HTML(Hyper Text Markup Language,超文本标记语言)语言数据,以使得前端根据标准结构数据显示节点树对应的页面。
在一个实施例中,本申请提供的页面数据编译的方法还可以用以编译一母应用下的子应用的页面数据,在该实例中,所述初始页面结构数据为子应用初始页面结构数据,用于描述运行于操作系统上的母应用中的子应用页面结构。
具体的,子应用是依附于母应用运行的应用程序,可通过母应用下载、启动、运行、关闭子应用。母应用可以是社交应用、专门支持子应用的专用应用、文件管理应用、邮件应用或者游戏应用等。社交应用包括即时通信应用、SNS(Social Network Service,社交网站)应用或者直播应用等。子应用则是可在母应用提供的环境中实现的应用,子应用具体可以是社交应用、文件管理应用、邮件应用或者游戏应用等。每 个子应用中的页面都有对应的初始页面结构数据,用于描述子应用页面结构。由于每个子应用对应的初始页面结构数据都会在服务器编译为脚本语言页面数据,初始页面结构数据即源码不会暴露在客户端,因此避免了子应用页面被仿造和篡改,提高了应用的安全性。
在一个实施例中,初始页面结构数据与子应用页面标识对应,本申请提供的页面数据编译的方法还包括:建立初始页面结构数据对应的脚本语言页面数据与子应用页面标识的关联关系,接收终端发送的当前子应用页面标识,根据关联关系获取与当前子应用页面标识对应的目标脚本语言页面数据,将目标脚本语言页面数据发送至终端。其中,该当前子应用页面标识可以携带在终端发送的页面数据获取请求中。
具体的,由于每个子应用都可能存在多个页面,开发者在上传初始页面结构数据时携带各页面匹配的子应用页面标识,且生成初始页面结构数据对应的脚本语言页面数据后,建立脚本语言页面数据与子应用页面标识的关联关系,从而便于子应用页面的展示终端通过子应用页面标识下载对应的目标脚本语言页面数据,从而展示对应的页面。可以理解的是,除了子应用页面标识,当服务器存储了多个子应用的初始页面结构数据时,初始页面结构数据还包括各子应用匹配的子应用标识。
在一个实施例中,本申请提供的页面数据编译的方法还包括:获取母应用对应的应用程序代码数据,将子应用初始页面结构数据对应的脚本语言页面数据打包入应用程序代码数据中。
具体的,将子应用初始页面结构数据对应的脚本语言页面数据打包入母应用的应用程序代码数据,用户在下载母应用时就可获取各个子应用的页面数据,从而展示对应的子应用页面,可在母应用中直接打开子应用页面不需要跳转至浏览器,提高了页面展示的便利性。且在展示子应用的各个页面时,页面数据已经存储在终端,不需要再从服务器通过 网络传输获取页面数据,提高了页面展示的效率。
在一个实施例中,如图9所示,提供了一种页面渲染的方法,应用于上述图1所示的应用环境中的终端,包括以下步骤:
步骤S510,获取脚本语言页面数据,所述脚本语言页面数据包括页面生成方法及数据变量集合,所述页面生成方法的输入为根据数据变量集合确定的当前数据集合,所述页面生成方法的输出为与所述当前数据集合匹配的节点树,及根据所述当前数据集合及所述脚本语言页面数据中的所述页面生成方法确定与所述当前数据集合匹配的节点树。
具体的,脚本语言是一种解释性的编程语言,如JavaScript脚本语言或者VBScript,对脚本语言的具体类型不作限定。脚本语言页面数据是脚本语言编写的用于描述页面结构的数据,脚本语言页面数据由于是脚本语言,不存在扩展的自定义语法,客户端可直接对其进行解析,如通过浏览器或webview等对其进行解析。
页面生成方法中包括了数据变量集合在不同逻辑条件下对应的页面生成方法片段,从而能根据不同的数据变量集合满足的逻辑条件获取对应的目标页面生成方法片段,根据目标页面生成方法片段输出对应的节点树。数据变量集合是页面展示过程中需要传递至页面生成方法的所有变量的集合,在页面展示过程中,可通过对页面的操作获取动态数据为数据变量集合中的变量赋值,从而更新页面,如通过对页面上的按钮的点击,获取按钮绑定的当前数据,将页面展示的数据更新为当前数据。节点树是以标记语言或扩展标记语言元素为节点,存在自上而下的父节点与子节点关系的树形数据结构。在前端可根据输入自动输出匹配的节点树,由于节点树是已经解析完成的存在节点关系的数据结构,从而不需要在终端再进行解析,在前端得到节点树时可直接转换为前端能解析的携带节点关系的标准数据结构,从而快速的进行页面的渲染。页面数 据采取脚本语言避免了页面每加载一次就需要在前端对标记语言的自定义语法进行解析的问题,提高了页面展示的效率。
步骤S520,获取页面数据,根据页面数据及数据变量集合确定当前数据集合,确定页面生成方法根据当前数据集合输出的对应的节点树,将节点树变换成描述视图的标准结构数据。
具体的,页面数据可以是默认数据,也可以是从当前运行的应用或浏览器中提取的数据,如当前登录的用户名等,可包括一个或多个数据,也可以是事件响应后得到的响应数据。将页面数据分别与数据变量集合中的变量一一对应形成当前数据集合,将当前数据集合传递至页面生成方法,根据当前数据集合满足的当前逻辑条件,获取对应的目标页面生成方法片段,从而输出当前数据集合对应的目标节点树。再将目标节点树变换生成描述视图的标准结构数据,如变换生成HTML数据。在一个具体的实施例中,在展示当前页面之前,默认数据name为空,从而根据name输出的节点树为图10所示的节点树。
步骤S530,根据标准结构数据显示对应的页面。
具体的,可直接解析标准结构数据显示对应的页面。如图11所示为显示的页面示意图。
本实施例中,获取脚本语言页面数据,脚本语言页面数据包括页面生成方法数据变量集合,页面生成方法的输入为根据数据变量集合确定的当前数据集合,页面生成方法的输出为与所述当前数据集合匹配的节点树,获取页面数据,根据页面数据确定数据变量集合中的各变量,得到当前数据集合,页面生成方法根据当前数据集合输出对应的节点树,将节点树变换生成描述视图的标准结构数据,根据标准结构数据渲染显示对应的页面,客户端获取的是编译后的脚本语言页面数据,不需要终端每次页面加载后再对扩展标记语言页面数据进行解析,提高了页面展 示的效率,同时脚本语言页面数据包括了页面生成方法,页面生成方法输出的节点树与输入的当前数据集合匹配,获取不同的页面数据,确定的当前数据集合也不同,从而得到不同的节点树,实现页面的动态更新。
在一个实施例中,脚本语言页面数据为子应用脚本语言页面数据,用于描述运行于操作系统上的母应用中的子应用页面结构。
具体的,子应用是依附于母应用运行的应用程序,可通过母应用下载、启动、运行、关闭子应用。母应用可以是社交应用、专门支持子应用的专用应用、文件管理应用、邮件应用或者游戏应用等。社交应用包括即时通信应用、SNS(Social Network Service,社交网站)应用或者直播应用等。子应用则是可在母应用提供的环境中实现的应用,子应用具体可以是社交应用、文件管理应用、邮件应用或者游戏应用等。每个子应用中的页面都有对应的脚本语言页面数据,用于描述子应用页面结构。由于每个子应用对应的脚本语言页面数据可为初始页面结构数据在服务器编译后生成的脚本语言数据,从而初始页面结构数据即源码不会暴露在客户端,避免了子应用页面被仿造和篡改,提高了应用的安全性。其中初始页面结构数据是由扩展标记语言编写生成的,通过扩展标记语言生成的初始页面结构数据可通过自定义的语法结构灵活方便的描述页面结构。
在一个实施例中,步骤S410包括:向服务器发送母应用下载请求,接收服务器返回的母应用对应的应用程序代码数据,从应用程序代码数据中提取子应用脚本语言页面数据。
具体的,脚本语言页面数据打包入母应用的应用程序代码数据,用户在下载母应用时就可获取各个子应用的页面数据,从而展示对应的子应用页面,可在母应用中直接打开子应用页面不需要跳转至浏览器,提高了页面展示的便利性。且在展示子应用的各个页面时,页面数据已经 存储在终端,不需要再从服务器通过网络传输获取页面数据,提高了页面展示的效率。
在一个实施例中,步骤S410包括:向服务器发送页面数据获取请求,页面数据获取请求携带当前子应用页面标识,以使服务器获取当前子应用页面标识对应的目标脚本语言页面数据,接收服务器返回的脚本语言页面数据。
具体的,由于每个子应用都可能存在多个页面,服务器中可能存储了多个页面对应的脚本语言页面数据,子应用页面的展示终端需要通过子应用页面标识下载对应的目标脚本语言页面数据,从而展示对应的页面。可以理解的是,除了子应用页面标识,当服务器存储了多个子应用的初始页面结构数据时,发送页面数据获取请求时还包括子应用标识,以区分不同的子应用。通过页面数据获取请求中携带标识信息,可只下载需要展示的页面,达到页面下载的灵活方便。
在一个实施例中,如图12所示,步骤S430之后,还包括:
步骤S610,获取对页面的触发事件,根据触发事件获取对应的事件响应数据。
具体的,每个触发事件都对应了匹配的事件响应,可先确定触发事件的事件类型,进而采用页面逻辑代码中与该事件类型相匹配的逻辑代码处理该事件,得到相应的事件响应数据。
步骤S620,根据事件响应数据将当前数据集合更新为第一数据集合,确定页面生成方法根据第一数据集合输出的对应的第一节点树。
具体的,可将事件响应数据与数据变量集合中的变量进行绑定,从而事件响应数据与之前赋值数据不同时,绑定的变量会重新赋值为事件响应数据,从而当前数据集合更新为第一数据集合,由于数据集合的变化导致页面生成方法输出更新的第一节点树。在一个具体的实施例中, 页面初次显示“hi,guest”,变量name为空,接收用户对按钮的点击事件后,获取点击事件对应的事件响应,此事件响应为更新数据响应,将name从空变更为“world”,其中变量name前存在字符串hello,从而输出的节点树中文本节点对应的是“hello world”,如图13所示为更新后的第一节点树的示意图。
步骤S630,根据第一节点树更新显示页面。
具体的,节点树更新后得到第一节点树,根据该第一节点树进行渲染生成第一节点树对应的新的页面,完成页面的动态更新。如图14所示,为一个具体的实施例中更新后的页面示意图。
本实施例中,事件对应的事件响应可根据需要自定义,从而通过事件的触发通过预设逻辑更新数据变量的值,生成更新后的节点树,从而渲染新的页面,方便的更新页面。
在一个实施例中,如图15所示,提供了一种页面数据编译的装置,包括:一个或一个以上存储器,一个或一个以上处理器;其中,所述一个或一个以上存储器存储有一个或者一个以上计算机可读指令模块,经配置由所述一个或者一个以上处理器执行;其中,所述一个或者一个以上计算机可读指令模块包括:
获取模块710,用于获取由扩展标记语言生成的初始页面结构数据。
编译模块720,用于解析所述初始页面结构数据生成对应的脚本语言页面数据及数据变量集合,所述脚本语言页面数据包括页面生成方法,所述页面生成方法的输入为根据数据变量集合确定的当前数据集合,所述页面生成方法的输出为与输入的当前数据集合匹配的节点树,将所述脚本语言页面数据发送至终端,以使所述终端根据所述数据变量集合确定当前数据集合,及根据所述当前数据集合及所述脚本语言页面数据中的所述页面生成方法确定匹配的节点树,根据所述节点树显示对 应的页面。
在一个实施例中,如图16所示,编译模块720包括:
分词单元721,用于对初始页面结构数据对应的源代码进行分词得到分词元素组成的数组。
语法树生成单元722,用于根据所述数组生成以分词元素为节点的语法树。
页面生成方法生成单元723,用于提取所述语法树中的变量确定数据变量集合,解析所述语法树生成数据变量集合在不同逻辑条件下对应的页面生成方法片段,根据所述页面生成方法片段生成所述页面生成方法。
在一个实施例中,页面生成方法生成单元723还用于对语法树进行后序遍历,获取字符串表达式,对字符串表达式进行字符表达式分词获取其中的表达式,对表达式进行解析生成所述页面生成方法片段中的表达式片段。
在一个实施例中,所述编译模块720,还用以,以使所述终端在前端获取页面数据,根据所述页面数据及所述数据变量集合确定当前数据集合,输入所述当前数据集合至所述页面生成方法生成节点树,根据所述节点树显示对应的页面。
在一个实施例中,所述编译模块720,还用以,以使所述终端将所述节点树在前端变换成描述视图的标准结构数据,根据所述标准结构数据显示所述节点树对应的页面。
在一个实施例中,初始页面结构数据为子应用初始页面结构数据,用于描述运行于操作系统上的母应用中的子应用页面结构。
在一个实施例中,如图17所示,所述一个或者一个以上计算机可读指令模块包括:
打包模块730,用于获取母应用对应的应用程序代码数据,将子应用初始页面结构数据对应的脚本语言页面数据打包入应用程序代码数据中。
在一个实施例中,初始页面结构数据与子应用页面标识对应,如图18所示,所述一个或者一个以上计算机可读指令模块还包括:
关联关系建立模块740,用于建立初始页面结构数据对应的脚本语言页面数据与所述子应用页面标识的关联关系。
发送模块750,用于接收终端发送的页面数据获取请求,该页面数据获取请求中携带当前子应用页面标识,根据所述关联关系获取与当前子应用页面标识对应的脚本语言页面数据,将所述脚本语言页面数据发送至所述终端。
根据图2所示的结构,本申请实例还提出了一种硬件结构,包括一个或一个以上存储器,一个或一个以上处理器,用于实现上述页面数据编译的装置或方法的功能。
在一个实施例中,如图19所示,提供了一种页面渲染的装置,包括:一个或一个以上存储器,一个或一个以上处理器;其中,所述一个或一个以上存储器存储有一个或者一个以上计算机可读指令模块,经配置由所述一个或者一个以上处理器执行;其中,所述一个或者一个以上计算机可读指令模块包括:
获取模块810,用于获取脚本语言页面数据,所述脚本语言页面数据包括页面生成方法及数据变量集合,所述页面生成方法的输入为根据数据变量集合确定的当前数据集合,所述页面生成方法的输出为节点树。
节点树输出模块820,用于获取页面数据,根据所述页面数据及所述数据变量集合确定当前数据集合,确定所述页面生成方法根据所述当 前数据集合输出的对应的节点树,将所述节点树变换成描述视图的标准结构数据。
渲染模块830,用于根据所述标准结构数据显示对应的页面。
在一个实施例中,初始页面结构数据为子应用初始页面结构数据,用于描述运行于操作系统上的母应用中的子应用页面结构。
在一个实施例中,获取模块810,还用于向服务器发送母应用下载请求,接收服务器返回的母应用对应的应用程序代码数据,从应用程序代码数据中提取子应用脚本语言页面数据。
在一个实施例中,获取模块810,还用于向服务器发送页面数据获取请求,页面数据获取请求携带当前子应用页面标识,以使服务器获取所述当前子应用页面标识对应的脚本语言页面数据,接收服务器返回的脚本语言页面数据。
在一个实施例中,如图20所示,所述一个或者一个以上计算机可读指令模块还包括:
更新显示模块840,用于获取对所述页面的触发事件,根据所述触发事件获取对应的事件响应数据,根据所述事件响应数据将所述当前数据集合更新为第一数据集合,确定所述页面生成方法根据所述第一数据集合输出的对应的第一节点树,根据所述第一节点树更新显示所述页面。
根据图2所示的结构,本申请实例还提出了一种硬件结构,包括一个或一个以上存储器,一个或一个以上处理器,用于实现上述页面渲染的装置或方法的功能。
本申请实例还提供了一种非易失性计算机可读存储介质,存储有计算机可读指令,可以使至少一个处理器执行如上述所述的方法。本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程,是可 以通过计算机程序来指令相关的硬件来完成,所述程序可存储于一计算机可读取存储介质中,如本发明实施例中,该程序可存储于计算机系统的存储介质中,并被该计算机系统中的至少一个处理器执行,以实现包括如上述各方法的实施例的流程。其中,所述存储介质可为非易失性存储介质,例如磁碟、光盘、只读存储记忆体(Read-Only Memory,ROM)或随机存储记忆体(Random Access Memory,RAM)等。
以上所述实施例的各技术特征可以进行任意的组合,为使描述简洁,未对上述实施例中的各个技术特征所有可能的组合都进行描述,然而,只要这些技术特征的组合不存在矛盾,都应当认为是本说明书记载的范围。
以上所述实施例仅表达了本发明实施例的几种实施方式,其描述较为具体和详细,但并不能因此而理解为对发明专利范围的限制。应当指出的是,对于本领域的普通技术人员来说,在不脱离本发明实施例构思的前提下,还可以做出若干变形和改进,这些都属于本发明实施例的保护范围。因此,本发明实施例专利的保护范围应以所附权利要求为准。

Claims (27)

  1. 一种页面数据编译的方法,应用于服务器,所述方法包括:
    获取由扩展标记语言生成的初始页面结构数据;
    解析所述初始页面结构数据生成对应的脚本语言页面数据,所述脚本语言页面数据包括页面生成方法及数据变量集合,所述页面生成方法的输入为根据数据变量集合确定的当前数据集合,所述页面生成方法的输出为与输入的当前数据集合匹配的节点树;
    将所述脚本语言页面数据发送至终端,以使所述终端根据所述数据变量集合确定当前数据集合,及根据所述当前数据集合及所述脚本语言页面数据中的所述页面生成方法确定匹配的节点树,根据所述节点树显示对应的页面。
  2. 根据权利要求1所述的方法,其中,所述解析所述初始页面结构数据生成对应的脚本语言页面数据及数据变量集合包括:
    对所述初始页面结构数据对应的源代码进行分词得到分词元素组成的数组;
    根据所述数组生成以分词元素为节点的语法树;
    提取所述语法树中的变量确定数据变量集合;
    解析所述语法树生成数据变量集合在不同逻辑条件下对应的页面生成方法片段;
    根据所述页面生成方法片段生成所述页面生成方法。
  3. 根据权利要求2所述的方法,其中,所述解析所述语法树生成数据变量集合在不同逻辑条件下对应的页面生成方法片段包括:
    对所述语法树进行后序遍历,获取字符串表达式;
    对所述字符串表达式进行字符表达式分词获取其中的表达式;
    对所述表达式进行解析生成所述页面生成方法片段中的表达式片段。
  4. 根据权利要求1所述的方法,其中,所述以使所述终端根据所述数据变量集合确定当前数据集合,及根据所述当前数据集合及所述脚本语言页面数据中的所述页面生成方法确定匹配的节点树,根据所述节点树显示对应的页面包括:
    以使所述终端在前端获取页面数据,根据所述页面数据及所述数据变量集合确定当前数据集合,输入所述当前数据集合至所述页面生成方法生成节点树,根据所述节点树显示对应的页面。
  5. 根据权利要求1所述的方法,其中,所述以使所述终端根据所述数据变量集合确定当前数据集合,及根据所述当前数据集合及所述脚本语言页面数据中的所述页面生成方法确定匹配的节点树,根据所述节点树显示对应的页面包括:
    以使所述终端将所述节点树在前端变换成描述视图的标准结构数据,根据所述标准结构数据显示所述节点树对应的页面。
  6. 根据权利要求1所述的方法,其中,所述初始页面结构数据为子应用初始页面结构数据,用于描述运行于操作系统上的母应用中的子应用页面结构。
  7. 根据权利要求6所述的方法,其中,所述方法还包括:
    获取所述母应用对应的应用程序代码数据;
    将所述子应用初始页面结构数据对应的脚本语言页面数据打包入所述应用程序代码数据中。
  8. 根据权利要求6所述的方法,其中,所述初始页面结构数据与子应用页面标识对应,所述方法还包括:
    建立所述初始页面结构数据对应的脚本语言页面数据与所述子应 用页面标识的关联关系;
    接收终端发送的页面数据获取请求,该页面数据获取请求中携带当前子应用页面标识;
    根据所述关联关系获取与当前子应用页面标识对应的脚本语言页面数据,将所述脚本语言页面数据发送至所述终端。
  9. 一种页面渲染的方法,应用于终端,所述方法包括:
    获取脚本语言页面数据,所述脚本语言页面数据包括页面生成方法及数据变量集合,所述页面生成方法的输入为根据数据变量集合确定的当前数据集合,所述页面生成方法的输出为与所述当前数据集合匹配的节点树;
    及根据所述当前数据集合及所述脚本语言页面数据中的所述页面生成方法确定与所述当前数据集合匹配的节点树;
    获取页面数据,根据所述页面数据及所述数据变量集合确定当前数据集合,确定所述页面生成方法根据所述当前数据集合输出的对应的节点树,将所述节点树变换成描述视图的标准结构数据;
    根据所述标准结构数据显示对应的页面。
  10. 根据权利要求9所述的方法,其中,所述初始页面结构数据为子应用初始页面结构数据,用于描述运行于操作系统上的母应用中的子应用页面结构。
  11. 根据权利要求9所述的方法,其中,所述获取脚本语言页面数据包括:
    向服务器发送母应用下载请求,接收服务器返回的母应用对应的应用程序代码数据;
    从所述应用程序代码数据中提取子应用脚本语言页面数据。
  12. 根据权利要求9所述的方法,其中,所述获取脚本语言页面数 据包括:
    向服务器发送页面数据获取请求,所述页面数据获取请求携带当前子应用页面标识,以使所述服务器获取所述当前子应用页面标识对应的脚本语言页面数据;
    接收所述服务器返回的脚本语言页面数据。
  13. 根据权利要求9所述的方法,其中,所述根据所述标准结构数据显示对应的页面之后,还包括:
    获取对所述页面的触发事件,根据所述触发事件获取对应的事件响应数据;
    根据所述事件响应数据将所述当前数据集合更新为第一数据集合;
    确定所述页面生成方法根据所述第一数据集合输出的对应的第一节点树;
    根据所述第一节点树更新显示所述页面。
  14. 一种页面数据编译的装置,包括:一个或一个以上存储器,一个或一个以上处理器;其中,所述一个或一个以上存储器存储有一个或者一个以上计算机可读指令模块,经配置由所述一个或者一个以上处理器执行;其中,所述一个或者一个以上计算机可读指令模块包括:获取模块,用于获取由扩展标记语言生成的初始页面结构数据;
    编译模块,用于解析所述初始页面结构数据生成对应的脚本语言页面数据及数据变量集合,所述脚本语言页面数据包括页面生成方法,所述页面生成方法的输入为根据数据变量集合确定的当前数据集合,所述页面生成方法的输出为与输入的当前数据集合匹配的节点树,将所述脚本语言页面数据发送至终端,以使所述终端根据所述数据变量集合确定当前数据集合,及根据所述当前数据集合及所述脚本语言页面数据中的所述页面生成方法确定匹配的节点树,根据所述节点树显示对应的页 面。
  15. 根据权利要求14所述的装置,其中,所述编译模块包括:
    分词单元,用于对所述初始页面结构数据对应的源代码进行分词得到分词元素组成的数组;
    语法树生成单元,用于根据所述数组生成以分词元素为节点的语法树;
    页面生成方法生成单元,用于提取所述语法树中的变量确定数据变量集合,解析所述语法树生成数据变量集合在不同逻辑条件下对应的页面生成方法片段,根据所述页面生成方法片段生成所述页面生成方法。
  16. 根据权利要求14所述的装置,其中,所述页面生成方法生成单元还用于对所述语法树进行后序遍历,获取字符串表达式,对所述字符串表达式进行字符表达式分词获取其中的表达式,对所述表达式进行解析生成所述页面生成方法片段中的表达式片段。
  17. 根据权利要求14所述的装置,其中,
    所述编译模块,还用以,以使所述终端在前端获取页面数据,根据所述页面数据及所述数据变量集合确定当前数据集合,输入所述当前数据集合至所述页面生成方法生成节点树,根据所述节点树显示对应的页面。
  18. 根据权利要求14所述的装置,其中,
    所述编译模块,还用以,以使所述终端将所述节点树在前端变换成描述视图的标准结构数据,根据所述标准结构数据显示所述节点树对应的页面。
  19. 根据权利要求14所述的装置,其中,所述初始页面结构数据为子应用初始页面结构数据,用于描述运行于操作系统上的母应用中的子应用页面结构。
  20. 根据权利要求19所述的装置,其中,所述一个或者一个以上计算机可读指令模块还包括:
    打包模块,用于获取所述母应用对应的应用程序代码数据,将所述子应用初始页面结构数据对应的脚本语言页面数据打包入所述应用程序代码数据中。
  21. 根据权利要求19所述的装置,其中,所述初始页面结构数据与子应用页面标识对应,所述一个或者一个以上计算机可读指令模块还包括:
    关联关系建立模块,用于建立所述初始页面结构数据对应的脚本语言页面数据与所述子应用页面标识的关联关系;
    发送模块,用于接收终端发送的页面数据获取请求,该页面数据获取请求中携带当前子应用页面标识,根据所述关联关系获取与当前子应用页面标识对应的脚本语言页面数据,将所述脚本语言页面数据发送至所述终端。
  22. 一种页面渲染的装置,包括:一个或一个以上存储器,一个或一个以上处理器;其中,所述一个或一个以上存储器存储有一个或者一个以上计算机可读指令模块,经配置由所述一个或者一个以上处理器执行;其中,所述一个或者一个以上计算机可读指令模块包括:
    获取模块,用于获取脚本语言页面数据,所述脚本语言页面数据包括页面生成方法及数据变量集合,所述页面生成方法的输入为根据数据变量集合确定的当前数据集合,所述页面生成方法的输出为节点树;
    节点树输出模块,用于获取页面数据,根据所述页面数据及所述数据变量集合确定当前数据集合,确定所述页面生成方法根据所述当前数据集合输出的对应的节点树,将所述节点树变换成描述视图的标准结构数据;
    渲染模块,用于根据所述标准结构数据显示对应的页面。
  23. 根据权利要求22所述的装置,其中,所述初始页面结构数据为子应用初始页面结构数据,用于描述运行于操作系统上的母应用中的子应用页面结构。
  24. 根据权利要求22所述的装置,其中,所述获取模块还用于向服务器发送母应用下载请求,接收服务器返回的母应用对应的应用程序代码数据,从所述应用程序代码数据中提取子应用脚本语言页面数据。
  25. 根据权利要求22所述的装置,其中,所述获取模块还用于向服务器发送页面数据获取请求,所述页面数据获取请求携带当前子应用页面标识,以使所述服务器获取所述当前子应用页面标识对应的脚本语言页面数据,接收所述服务器返回的脚本语言页面数据。
  26. 根据权利要求22所述的装置,其中,所述一个或者一个以上计算机可读指令模块还包括:
    更新显示模块,用于获取对所述页面的触发事件,根据所述触发事件获取对应的事件响应数据,根据所述事件响应数据将所述当前数据集合更新为第一数据集合,确定所述页面生成方法根据所述第一数据集合输出的对应的第一节点树,根据所述第一节点树更新显示所述页面。
  27. 一种非易失性计算机可读存储介质,存储有计算机可读指令,可以使至少一个处理器执行如权利要求1-13任一项所述的方法。
PCT/CN2017/108909 2016-11-07 2017-11-01 页面数据编译的方法、页面渲染的方法、装置及存储介质 WO2018082562A1 (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
US16/343,554 US10776567B2 (en) 2016-11-07 2017-11-01 Method for compiling page data, method, device and storage medium for page rendering

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN201610975743.X 2016-11-07
CN201610975743.XA CN106569824B (zh) 2016-11-07 2016-11-07 页面数据编译的方法和装置、页面渲染的方法和装置

Publications (1)

Publication Number Publication Date
WO2018082562A1 true WO2018082562A1 (zh) 2018-05-11

Family

ID=58540257

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2017/108909 WO2018082562A1 (zh) 2016-11-07 2017-11-01 页面数据编译的方法、页面渲染的方法、装置及存储介质

Country Status (3)

Country Link
US (1) US10776567B2 (zh)
CN (1) CN106569824B (zh)
WO (1) WO2018082562A1 (zh)

Cited By (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109669695A (zh) * 2018-12-14 2019-04-23 北京向上心科技有限公司 在后端渲染项目中与前端页面的开发交互方法和装置
CN111736840A (zh) * 2019-09-19 2020-10-02 北京沃东天骏信息技术有限公司 小程序应用的编译方法、运行方法、存储介质及电子设备
CN112506602A (zh) * 2020-12-23 2021-03-16 北京百度网讯科技有限公司 页面生成方法及装置、电子设备、计算机可读介质

Families Citing this family (17)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106569824B (zh) 2016-11-07 2019-08-13 腾讯科技(深圳)有限公司 页面数据编译的方法和装置、页面渲染的方法和装置
CN108810599A (zh) * 2017-04-27 2018-11-13 腾讯科技(上海)有限公司 视频直播方法、装置和计算机设备
CN108874390B (zh) * 2017-05-10 2023-05-16 腾讯科技(北京)有限公司 一种数据处理方法及装置、设备、存储介质
CN108196930B (zh) * 2018-01-18 2020-04-03 腾讯科技(深圳)有限公司 应用程序处理方法、装置、存储介质和计算机设备
CN110928540A (zh) * 2018-09-19 2020-03-27 北京国双科技有限公司 一种页面生成方法及装置
US20200186623A1 (en) * 2018-12-11 2020-06-11 Microsoft Technology Licensing, Llc Performant retrieval and presentation of content
CN109885794B (zh) * 2019-01-24 2020-10-20 曲阜师范大学 基于区块链的循环式同步更新网页的处理方法
CN110659057B (zh) * 2019-09-24 2021-10-22 腾讯科技(深圳)有限公司 应用程序热更新方法、装置、存储介质及计算机设备
CN110708235B (zh) * 2019-10-12 2021-07-06 腾讯科技(深圳)有限公司 消息生成方法、装置、存储介质和计算机设备
CN112863501B (zh) * 2019-11-26 2023-06-09 北京声智科技有限公司 一种数据处理方法、装置及电子设备
CN111258577A (zh) * 2019-12-02 2020-06-09 泰康保险集团股份有限公司 页面渲染方法、装置、电子设备和存储介质
CN111638904B (zh) * 2020-05-11 2023-12-22 贝壳技术有限公司 一种数据配置的还原方法、装置以及可读存储介质
CN112416340A (zh) * 2020-05-14 2021-02-26 上海哔哩哔哩科技有限公司 基于草图的网页生成方法和系统
CN112214671A (zh) * 2020-10-09 2021-01-12 百度国际科技(深圳)有限公司 前端页面生成方法、目标用户的确定方法及装置和介质
CN113626015B (zh) * 2021-08-24 2024-04-26 贵州电子科技职业学院 一种适用于i语言的高性能运行优化方法
CN115495169B (zh) * 2022-09-21 2023-05-12 昆仑数智科技有限责任公司 数据获取、页面生成方法、装置、设备及可读存储介质
CN116909563B (zh) * 2023-09-14 2023-12-19 深圳市智慧城市科技发展集团有限公司 页面的生成方法、终端设备和存储介质

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102520966A (zh) * 2011-12-28 2012-06-27 东软集团股份有限公司 一种代码提示方法和装置
US20120330984A1 (en) * 2011-06-21 2012-12-27 Canon Kabushiki Kaisha Method for processing a structured document to render, and corresponding processor
CN104572035A (zh) * 2013-10-11 2015-04-29 北大方正集团有限公司 网页代码的动态生成方法和动态生成系统
CN104699706A (zh) * 2013-12-06 2015-06-10 中国移动通信集团海南有限公司 目录树的生成方法、装置及系统
CN106569824A (zh) * 2016-11-07 2017-04-19 腾讯科技(深圳)有限公司 页面数据编译的方法和装置、页面渲染的方法和装置

Family Cites Families (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US6981212B1 (en) * 1999-09-30 2005-12-27 International Business Machines Corporation Extensible markup language (XML) server pages having custom document object model (DOM) tags
AU2582401A (en) * 1999-12-17 2001-06-25 Dorado Network Systems Corporation Purpose-based adaptive rendering
US6990653B1 (en) * 2000-05-18 2006-01-24 Microsoft Corporation Server-side code generation from a dynamic web page content file
US9262185B2 (en) * 2010-11-22 2016-02-16 Unisys Corporation Scripted dynamic document generation using dynamic document template scripts
CN104778285B (zh) * 2015-05-12 2018-08-28 成都广达新网科技股份有限公司 一种基于xml的web服务系统及其工作方法

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20120330984A1 (en) * 2011-06-21 2012-12-27 Canon Kabushiki Kaisha Method for processing a structured document to render, and corresponding processor
CN102520966A (zh) * 2011-12-28 2012-06-27 东软集团股份有限公司 一种代码提示方法和装置
CN104572035A (zh) * 2013-10-11 2015-04-29 北大方正集团有限公司 网页代码的动态生成方法和动态生成系统
CN104699706A (zh) * 2013-12-06 2015-06-10 中国移动通信集团海南有限公司 目录树的生成方法、装置及系统
CN106569824A (zh) * 2016-11-07 2017-04-19 腾讯科技(深圳)有限公司 页面数据编译的方法和装置、页面渲染的方法和装置

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109669695A (zh) * 2018-12-14 2019-04-23 北京向上心科技有限公司 在后端渲染项目中与前端页面的开发交互方法和装置
CN111736840A (zh) * 2019-09-19 2020-10-02 北京沃东天骏信息技术有限公司 小程序应用的编译方法、运行方法、存储介质及电子设备
CN112506602A (zh) * 2020-12-23 2021-03-16 北京百度网讯科技有限公司 页面生成方法及装置、电子设备、计算机可读介质
CN112506602B (zh) * 2020-12-23 2023-08-08 北京百度网讯科技有限公司 页面生成方法及装置、电子设备、计算机可读介质

Also Published As

Publication number Publication date
US10776567B2 (en) 2020-09-15
CN106569824B (zh) 2019-08-13
CN106569824A (zh) 2017-04-19
US20200050652A1 (en) 2020-02-13

Similar Documents

Publication Publication Date Title
WO2018082562A1 (zh) 页面数据编译的方法、页面渲染的方法、装置及存储介质
US10824691B2 (en) Page rendering method, device, and data storage medium
CN111708539B (zh) 一种应用程序代码转换方法、装置、电子设备和存储介质
US11635944B2 (en) Methods and systems for programmatic creation of an interactive demonstration presentation for an envisioned software product
CN111666526B (zh) 页面生成方法、装置、设备及存储介质
JP6922538B2 (ja) Api学習
US20200125482A1 (en) Code examples sandbox
CN109522018B (zh) 页面处理方法、装置及存储介质
CN106294493B (zh) 实现文档格式转换的方法及装置
CN112905179A (zh) 移动端h5页面生成方法、装置、电子设备和存储介质
CN111831384B (zh) 语言切换方法和装置、设备及存储介质
CN113126990A (zh) 一种页面开发方法、装置、设备及存储介质
CN114153459A (zh) 接口文档生成方法及装置
WO2023087721A1 (zh) 一种业务处理模型生成方法、装置、电子设备和存储介质
CN115599386A (zh) 代码生成方法、装置、设备及存储介质
Decker et al. A tool for efficiently reverse engineering accurate UML class diagrams
CN113495730A (zh) 资源包的生成及解析方法和装置
US9898467B1 (en) System for data normalization
US20120124555A1 (en) Optimization of Compiled Control Objects
CN117519877A (zh) 快应用卡片的渲染方法、装置、存储介质及电子设备
CN112632333A (zh) 查询语句生成方法、装置、设备及计算机可读存储介质
CN112632425A (zh) 一种离线资源文件的生成方法、装置、设备及存储介质
CN107077484B (zh) 生成应用的网络浏览器视图
CN110110299B (zh) 文本变换方法、装置以及服务器
CN117251231B (zh) 一种动画资源处理方法、装置、系统及电子设备

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 17866564

Country of ref document: EP

Kind code of ref document: A1

NENP Non-entry into the national phase

Ref country code: DE

122 Ep: pct application non-entry in european phase

Ref document number: 17866564

Country of ref document: EP

Kind code of ref document: A1