Component dynamic rendering method, device, equipment and medium

The cross-platform dynamic rendering solution using DSL description files solves the problem of insufficient dynamic rendering performance in existing technologies, achieving efficient cross-platform rendering applicable to multiple platforms such as Android, iOS, Web, and mini-programs.

CN114547514BActive Publication Date: 2026-02-24RUITING NETWORK TECH (SHANGHAI) CO LTD
View PDF 1 Cites 0 Cited by

Patent Information

Application Number
CN202111672777.9
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2021-12-31
Publication Date
2026-02-24
Estimated Expiration
2041-12-31

AI Technical Summary

Technical Problem

Existing dynamic rendering solutions have shortcomings in performance and user experience, especially the low performance of H5 technology and the performance bottleneck of React Native, which limit large-scale application in business.

Method used

Cross-platform dynamic rendering is achieved through DSL description files, which obtain and identify the attribute information and cascading relationships of UI objects, convert them into component description information supported by the platform, and use native components for page rendering.

Benefits of technology

It achieves high-performance dynamic rendering across platforms, improving rendering efficiency and performance, and is suitable for multiple platforms such as Android, iOS, Web, and mini-programs.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN114547514B_ABST
    Figure CN114547514B_ABST
Patent Text Reader

Abstract

Embodiments of the present application provide a component dynamic rendering method and device, equipment and medium. In the embodiments of the present application, according to the rendering request initiated by the first platform for the target page supported by the application program, the DSL description file corresponding to the target page and the attribute information of the multiple UI objects and the cascade relationship between the multiple UI objects in the DSL description file can be obtained, the attribute information of the multiple UI objects and the cascade relationship between the multiple UI objects are converted into multiple component description information and page layout information corresponding to multiple target components respectively, which can be recognized by the first platform, so as to utilize the multiple target components to perform page rendering and obtain the target page. Since the DSL description file has no dependency on the first platform, cross-platform dynamic rendering of the front-end page can be realized according to the DSL description file, the native components and the native rendering capability of each platform are utilized to perform page rendering, and higher performance and efficiency are achieved.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This application relates to the field of computer technology, and in particular to a method, apparatus, device and medium for dynamic rendering of components. Background Technology

[0002] With the development of computer technology, the ways to present information to users in a visual format are becoming increasingly diverse, especially on mobile devices. Different mobile platforms can typically present information to users through various means such as apps, mini-programs, micro-stores, and mobile websites. In scenarios where business operations are flexible and dynamic, requiring rapid response and agile iteration, the use of high-performance mobile development technologies for dynamic rendering of components has always been a goal pursued by application developers, especially mobile developers.

[0003] However, existing dynamic rendering solutions all have shortcomings. For example, H5's web-based dynamic rendering solution relies on the browser kernel for rendering. While H5 technology has a natural advantage in dynamic rendering, its low performance and poor user experience limit its large-scale application in business applications. Another example is the React Native (RN) cross-platform mobile application development framework, whose dynamic solution based on React JS controls the native side's page rendering and interaction at runtime. Although dynamic rendering of the application can be achieved by interpreting and executing RN's JS bundles, the frequent data interaction between the JS Core and the native side due to JS being the core of rendering control can cause performance bottlenecks.

[0004] Therefore, it is necessary to implement a solution that meets both high performance requirements and enables dynamic rendering of components to address the aforementioned issues. Summary of the Invention

[0005] This application provides a method, apparatus, device, and medium for dynamic rendering of components, which solves the problem of achieving dynamic rendering of components while meeting high performance requirements.

[0006] This application provides a component dynamic rendering method, comprising: responding to a rendering request initiated by a first platform supported by an application for a target page; obtaining a DSL description file corresponding to the target page, wherein the DSL description file is a page information description file independent of the characteristics of the first platform; identifying attribute information of multiple UI objects contained in the DSL description file and the cascading relationship between the multiple UI objects; converting the attribute information of the multiple UI objects into multiple component description information recognizable by the first platform, wherein the multiple component description information points to multiple target components supported by the first platform; converting the cascading relationship between the multiple UI objects into page layout information corresponding to the multiple target components; and rendering the page using the multiple target components according to the page layout information and the multiple component description information to obtain the target page.

[0007] In one optional embodiment, in response to a rendering request initiated by a first platform supported by the application for a target page, obtaining the DSL description file corresponding to the target page includes: in response to a rendering request initiated by the first platform supported by the application for a target page, obtaining the DSL description file corresponding to the target page from a local cache; the method further includes: during the application startup process, sending a first DSL description file request to a DSL description file management platform, the first DSL description file request including the version information of the application and the identifiers of each page included in the application; receiving the DSL description files corresponding to each page returned by the DSL description file management platform according to the version information of the application and the identifiers of each page, and writing the DSL files corresponding to each page into the local cache.

[0008] In one optional embodiment, in response to a rendering request initiated by a first platform supported by the application for a target page, obtaining the DSL description file corresponding to the target page includes: in response to the rendering request initiated by the first platform supported by the application for a target page, sending a second DSL description file request to a DSL description file management platform, wherein the second DSL description file request includes the version information of the application and the identifier of the target page; and receiving the DSL description file corresponding to the target page returned by the DSL description file management platform based on the version information of the application and the identifier of the target page.

[0009] In one optional embodiment, the data structure of the DSL description file is a view tree structure. Identifying the attribute information of multiple UI objects contained in the DSL description file and the cascading relationship between the multiple UI objects includes: parsing the DSL description file to obtain the UI objects and their attribute information corresponding to each node in the view tree; and determining the cascading relationship between the UI objects corresponding to each node based on the cascading relationship between each node in the view tree.

[0010] In one optional embodiment, converting the attribute information of the plurality of UI objects into multiple component description information that the first platform can recognize includes: parsing multiple basic component information and multiple component layout information required for rendering the target page from the attribute information of the plurality of UI objects; and converting the multiple basic component information and multiple component layout information into multiple component description information supported by the first platform according to the syntax rules supported by the first platform.

[0011] In an optional embodiment, the method further includes: obtaining specified rendering information of the target page by the first platform, and determining a specified rendering component and its basic component information and layout information based on the specified rendering information; the step of converting the attribute information of the plurality of UI objects into multiple component description information that the first platform can recognize includes: converting the basic component information and layout information of the plurality of UI objects and the specified rendering component into multiple component description information supported by the first platform according to the syntax rules supported by the first platform.

[0012] In an optional embodiment, the method further includes: determining the cascading relationship between the specified rendering component and the plurality of target components based on the basic information and layout information of the specified rendering component; wherein the cascading relationship between the specified rendering component and the plurality of target components is collectively used as the cascading relationship, and the specified rendering information and the attribute information of the plurality of UI objects are collectively used as attribute information.

[0013] In one optional embodiment, converting the cascading relationship between the plurality of UI objects into page layout information corresponding to the plurality of target components includes: generating a document tree corresponding to the description information of the plurality of components based on the cascading relationship and the description information of the plurality of components, wherein the directory structure of the document tree represents the page layout information.

[0014] In an optional embodiment, the attribute information further includes event information associated with the first component. The event information includes at least an event triggering behavior, a data processing method, and data transmission information. The method further includes: parsing the first target component associated with the event information from the attribute information; and for the first target component, binding a data response event and a behavior listening event to the first target component in the document tree according to the event triggering behavior, the data processing method, and the data transmission information. The behavior listening event is used to listen for whether the event triggering behavior occurs on the target page when the target page is rendered, and the data response event is used to perform data processing according to the data processing method and the data transmission information when the behavior listening event detects the event triggering behavior.

[0015] In an optional embodiment, after rendering the target page, the method further includes: listening to whether the event triggering behavior occurs on the target page; if the event triggering behavior is detected, parsing the data acquisition address and data acquisition type from the data transmission information, acquiring target data from the data acquisition address according to the data acquisition type, and processing the target data according to the data processing method.

[0016] In one optional embodiment, page rendering is performed using the multiple target components based on the page layout information and the multiple component description information to obtain the target page, including: sequentially obtaining each target component corresponding to the document tree from the component source code library supported by the first platform according to the directory structure of the document tree, and performing page rendering based on each sequentially obtained target component to obtain the target page.

[0017] This application embodiment also provides a component dynamic rendering apparatus, comprising: an acquisition module, configured to respond to a rendering request initiated by a first platform supported by an application for a target page, and acquire a DSL description file corresponding to the target page, wherein the DSL description file is a page information description file independent of the characteristics of the first platform; a first processing module, configured to identify attribute information of multiple UI objects contained in the DSL description file and the cascading relationship between the multiple UI objects; a second processing module, configured to convert the attribute information of the multiple UI objects into multiple component description information recognizable by the first platform, wherein the multiple component description information points to multiple target components supported by the first platform; and to convert the cascading relationship between the multiple UI objects into page layout information corresponding to the multiple target components; and a rendering module, configured to render the page using the multiple target components according to the page layout information and the multiple component description information to obtain the target page.

[0018] This application embodiment also provides a component dynamic rendering device, including: a processor and a memory storing a computer program; the processor is configured to execute the computer program for: responding to a rendering request initiated by a first platform supported by an application for a target page; obtaining a DSL description file corresponding to the target page, wherein the DSL description file is a page information description file independent of the characteristics of the first platform; identifying attribute information of multiple UI objects contained in the DSL description file and the cascading relationship between the multiple UI objects; converting the attribute information of the multiple UI objects into multiple component description information recognizable by the first platform, wherein the multiple component description information points to multiple target components supported by the first platform; converting the cascading relationship between the multiple UI objects into page layout information corresponding to the multiple target components; and rendering the page using the multiple target components according to the page layout information and the multiple component description information to obtain the target page.

[0019] This application also provides a computer-readable storage medium storing a computer program, which, when executed by a processor, causes the processor to implement the steps of the method claim.

[0020] In this embodiment, upon receiving a rendering request for a target page from a first platform supported by the application, the DSL description file corresponding to the target page can be obtained, and the attribute information of multiple UI objects contained in the DSL description file and the cascading relationships between the multiple UI objects can be identified. Based on this, the attribute information of the multiple UI objects can be converted into multiple component description information recognizable by the first platform, and the cascading relationships between the multiple UI objects can be converted into page layout information corresponding to multiple target components. Further, based on the page layout information and multiple component description information, a document tree recognizable by the first platform is generated, and data response events and behavior listening events are set for components containing event information. After the target page is obtained by rendering the page using multiple target components, corresponding data processing can be performed when the event corresponding to the target component is triggered. Since the DSL description file in this embodiment is a general data format after being abstracted and re-expressed by platform characteristics, it has no dependency on the first platform. Therefore, cross-platform dynamic rendering of the front-end page can be achieved based on the DSL description file. Furthermore, when each platform renders the page based on the DSL description file, it utilizes the native components and native rendering capabilities supported by each platform for page rendering, resulting in higher performance and efficiency. Attached Figure Description

[0021] The accompanying drawings, which are included to provide a further understanding of this application and form part of this application, illustrate exemplary embodiments and are used to explain this application, but do not constitute an undue limitation of this application. In the drawings:

[0022] Figure 1a A schematic diagram illustrating a component dynamic rendering process based on a component dynamic rendering method provided in this application embodiment;

[0023] Figure 1b A flowchart of a component dynamic rendering method provided in an embodiment of this application;

[0024] Figure 1c This application provides an overall flowchart of a component dynamic rendering method according to an embodiment of the present application;

[0025] Figure 2 This is a schematic diagram of the structure of a component dynamic rendering device provided in an embodiment of this application;

[0026] Figure 3 This is a schematic diagram of the structure of a component dynamic rendering device provided in an embodiment of this application. Detailed Implementation

[0027] To make the objectives, technical solutions, and advantages of this application clearer, the technical solutions of this application will be clearly and completely described below in conjunction with specific embodiments and corresponding drawings. Obviously, the described embodiments are only a part of the embodiments of this application, and not all of them. Based on the embodiments in this application, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of this application.

[0028] To address the issue that existing solutions cannot simultaneously satisfy the requirements of high performance and dynamic rendering components, embodiments of this application provide a component dynamic rendering method. This method is applied to a front-end DSL rendering engine, which can respond to rendering requests initiated by the application's front-end pages by the platform supported by the application. Figure 1aAs shown, when the DSL rendering engine 10 receives a rendering request for a target page on the front end, it can send a DSL description file request to the Domain Specific Language (DSL) description file management platform 20. This request includes the version information of the application to which the target page belongs and the identifier of the target page to be rendered. The DSL description file management platform 20 includes DSL description files corresponding to different versions of the front end page and at least one component library corresponding to the page. Each component library includes multiple components involved in the page, and each DSL description file includes description information of the multiple components involved in the corresponding version of the page and description information of the application versions supported by the component library.

[0029] Based on this, upon receiving a DSL description file request from the DSL rendering engine 10, the DSL description file management platform 20 can determine the target component library and target DSL description file that support the application version based on the application version information and the identifier of the target page to be rendered. It then returns the target DSL description file to the DSL rendering engine 10, allowing the DSL rendering engine 10 to render the target page according to the target DSL description file. Furthermore, the DSL rendering engine 10 can identify the component description information included in the target DSL description, determine the target components required for rendering the target page and the cascading relationships between the target components, obtain the target components from the backend server 30 of the platform where the DSL rendering engine 10 is currently located, and dynamically render the target page.

[0030] The DSL description file in this embodiment is a description file with a universal data format obtained by abstracting and re-expressing the characteristics of the application platform. This DSL description file does not depend on the specific platform on which the page is applied. Optionally, the format of the DSL description file can be a universal data format without platform characteristics, such as JSON or XML. Based on this, when the DSL description file management platform 20 distributes the target DSL description file across platforms, each platform can dynamically render the target page using its native rendering capabilities based on the target DSL description file, resulting in higher performance. Among these platforms, there are, but are not limited to, any one or more of Android, iOS, Web, mini-programs, and H5 platforms, which are not limited here.

[0031] Figure 1b A flowchart of the component dynamic rendering method provided in the embodiments of this application is shown below. Figure 1b As shown, the method includes:

[0032] S1. Respond to the rendering request initiated by the first platform supported by the application for the target page, and obtain the DSL description file corresponding to the target page. The DSL description file is a page information description file that is independent of the characteristics of the first platform.

[0033] S2. Identify the attribute information of multiple UI objects contained in the DSL description file and the cascading relationship between multiple UI objects;

[0034] S3. Convert the attribute information of multiple UI objects into multiple component description information that can be recognized by the first platform, and the multiple component description information points to multiple target components supported by the first platform;

[0035] S4. Convert the cascading relationships between multiple UI objects into page layout information corresponding to multiple target components;

[0036] S5. Based on the page layout information and multiple component description information, render the page using multiple target components to obtain the target page.

[0037] In this embodiment, the first platform refers to the platform supported by the application, and the DSL description file is a page information description file that is independent of the characteristics of the first platform. When the target page in the application front end is triggered and needs to be rendered, the DSL rendering engine can respond to the rendering request initiated by the first platform supported by the application for the target page and obtain the DSL description file corresponding to the target page. For the obtained DSL description file, the DSL rendering engine can identify the attribute information of multiple UI objects contained in the DSL description file and the cascading relationship between multiple UI objects; wherein the attribute information of the UI objects includes the basic information and layout information of the UI objects, and the cascading relationship between multiple UI objects reflects the relative positional relationship of multiple UI objects on the target page.

[0038] Since the DSL description file is a universal data format that has been abstracted and re-expressed based on platform characteristics, when the DSL description file contains descriptions of multiple UI objects, the DSL rendering engine can convert the attribute information of these UI objects into component descriptions that the first platform can recognize. It can also convert the cascading relationships between these UI objects into page layout information corresponding to multiple target components. These component descriptions point to multiple target components supported by the first platform. Furthermore, the DSL rendering engine can use these target components to render the page based on the page layout information and the component descriptions to obtain the target page.

[0039] In this embodiment, the specific form in which the DSL rendering engine obtains the DSL description file corresponding to the target page is not limited. In an optional embodiment, if the DSL description file is stored in the DSL rendering engine's local cache manager, the DSL rendering engine can directly obtain the DSL description file corresponding to the target page from the local cache manager when responding to a rendering request initiated by the first platform supported by the application for the target page. Based on this, during application startup, the DSL rendering engine can send a first DSL description file request to the DSL description file management platform; wherein, the first DSL description file request includes the application version information and the identifiers of each page included in the application, the DSL description file management platform can return the DSL description file corresponding to each page to the DSL rendering engine according to the application version information and the identifiers of each page; furthermore, the DSL rendering engine can receive the DSL description file corresponding to each page returned by the DSL description file management platform according to the application version information and the identifiers of each page, and write the DSL file corresponding to each page into the local cache manager, so that when responding to a rendering request initiated by the first platform for the target page, the DSL description file corresponding to the target page can be obtained from the local cache manager, and the target page can be dynamically rendered according to the DSL description file.

[0040] In another optional embodiment, the DSL rendering engine can also obtain the DSL description file corresponding to the target page in real time. When the DSL rendering engine responds to the rendering request initiated by the first platform supported by the application for the target page, it can directly send a second DSL description file request to the DSL description file management platform. The second DSL description file request includes the application version information and the identifier of the target page. Based on this, the DSL description file management platform can return the DSL description file corresponding to the target page to the DSL rendering engine according to the application version information and the identifier of the target page. Furthermore, the DSL rendering engine can receive the DSL description file corresponding to the target page returned by the DSL description file management platform according to the application version information and the identifier of the target page, and perform dynamic rendering of the target page according to the DSL description file.

[0041] In this embodiment, the data structure of the DSL description file is a view tree structure, which reflects the cascading relationships between multiple UI objects. Based on this, when the DSL rendering engine identifies the attribute information of multiple UI objects contained in the DSL description file and the cascading relationships between them, it can use the DSL Manager of the DSL rendering engine to parse the DSL description file to obtain the UI objects and their attribute information corresponding to each node in the view tree. Furthermore, based on the cascading relationships between nodes in the view tree, the cascading relationships between the UI objects corresponding to each node can be determined. Further, having obtained the attribute information of multiple UI objects and the cascading relationships between them, the DSL rendering engine can convert the attribute information of multiple UI objects into multiple component description information that can be recognized by the first platform. Based on the multiple component description information, the target component is determined, and the target page is dynamically rendered based on the target component.

[0042] Optionally, when converting the attribute information of multiple UI objects into multiple component description information that the first platform can recognize, the DSL rendering engine can parse the basic information of multiple components and the layout information of multiple components required for rendering the target page from the attribute information of multiple UI objects. The basic information includes, but is not limited to, the identifier, name, type, and supported application version of multiple components. The layout information includes, but is not limited to, the layout information of multiple components on the target page in the form of flow layout, border layout, grid layout, online lending layout, absolute layout, etc., and may also include the size information of multiple components and the display position information such as left, right, top, bottom, or center, etc.

[0043] In this embodiment, the specific format of the content in the DSL description file is not limited. Optionally, it is assumed that the DSL description file is in JSON data format. As shown in Example 1 below, the cascading relationship of multiple UI objects in the DSL description file is distinguished by curly braces. The information in each pair of curly braces is the basic information and layout information of the UI object corresponding to that pair of curly braces; the curly braces nested within the current curly braces and the information within them are the child UI objects of the current UI object and their basic information and layout information; and so on, thus the basic information and layout information of multiple UI objects and the cascading relationship between multiple UI objects can be identified. Furthermore, when multiple component basic information and multiple component layout information are identified, the DSL rendering engine can convert the multiple component basic information and multiple component layout information into multiple component description information supported by the first platform according to the syntax rules supported by the first platform.

[0044] In this embodiment, the specific implementation of the first platform is not limited. Assuming the first platform is the Android platform, which supports JavaScript syntax rules, then in Example 1 below, after identifying the attribute information and layout information of multiple UI objects, as well as the cascading relationship between multiple UI objects, the identified information can be converted into multiple component description information according to JavaScript syntax rules. As shown in Example 1 below, after format conversion, the entire node set shown on the right side of the figure is converted into the page node and its component information shown on the left side of the figure; the three child subsets included in the node set on the right side of the figure represent three UI objects and their basic information and layout information, respectively. After format conversion, they are converted into three child nodes in the page node shown on the left side of the figure, which are used to represent three components in the page and their basic information and layout information, respectively.

[0045]

[0046] In practical applications, different application platforms may have different display requirements for the same page display effect. For example, Android and iOS platforms have different requirements for the top notch, bottom navigation, and displayed text baseline on the mobile interface. Therefore, in the optional embodiment of this application, when the first platform has specific rendering requirements for specific components in the target page, specific rendering information can be set for specific components in the target page as needed. The set specific rendering information is injected into the startup parameters of the DSL rendering engine each time the DSL rendering engine starts, so that the DSL rendering engine can obtain the specific rendering information of the first platform for the target page, and determine the specified rendering component and its basic component information and component layout information based on the specified rendering information.

[0047] Based on this, when converting the attribute information of multiple UI objects into multiple component description information recognizable by the first platform, the basic component information and component layout information of multiple UI objects and a specified rendering component can also be converted into multiple component description information supported by the first platform, according to the syntax rules supported by the first platform. Optionally, when converting to multiple component description information supported by the first platform, the cascading relationship between the specified rendering component and multiple target components corresponding to multiple UI objects in the DSL description file can be determined based on the basic component information and component layout information of the specified rendering component. The cascading relationship between the specified rendering component and multiple target components is used as the cascading relationship, and the attribute information of the specified rendering information and multiple UI objects is used as the attribute information. Based on this, the target component can be determined based on the multiple component description information, and the target page can be dynamically rendered based on the target component.

[0048] In this embodiment, the specific implementation of converting the cascading relationship between multiple UI objects into page layout information corresponding to multiple target components is not limited. Optionally, a document tree corresponding to multiple component description information can be generated based on the cascading relationship between multiple components and multiple component description information. This document tree can be recognized by the first platform. The directory structure of the document tree represents the page layout information. Furthermore, when a document tree recognizable by the first platform is obtained, and the attribute information of the DSL description file also includes event information associated with the first component, the DSL rendering engine can also parse the first target component associated with event information from the attribute information. The event information includes at least the event triggering behavior, data processing method, and data transmission information. As shown in Example 2 below, the UI object named Text in the DSL description file contains event information (event). In this event information, the event triggering method is click (onClick). When the event is triggered, the "showToast" method is executed. The parameter type of the "showToast" method is String, and the parameter value is "this is text".

[0049] Based on this, upon recognizing the aforementioned event information, the DSL rendering engine can identify the first target component corresponding to the UI object named "Text". Using the Data Bind Manager (DSL) description file, based on the event triggering behavior, data processing method, and data transmission information, it binds data response events and behavior listener events to the first target component in the document tree. This allows it to listen for event triggering behavior on the target page after rendering, and to process data according to the data processing method and data transmission information if the behavior listener detects an event triggering behavior. For example, if a click on the first target component is detected when the target page is rendered, the "showToast" method is executed, with "this is text" of type "Text" as the parameter of the "showToast" method.

[0050] Further optionally, in this embodiment, the data transmission information representation can vary depending on the data acquisition method. For example, an API type can indicate data acquisition from a specific interface, a URL type can indicate data acquisition from a website, a Store type can indicate data acquisition from local storage, and so on. Furthermore, the corresponding addresses can be differentiated for different data acquisition methods. For instance, the prefix "Apiname" in the address Apiname.data.community.name corresponds to data acquisition from an interface. Correspondingly, "Urlname" can be used to represent data acquisition from a website, and "Localname" can be used to represent data acquisition from local storage. This is merely an illustrative example, and the specific implementation is not limited. Based on this, when acquiring data, the data acquisition address and data acquisition type can be parsed from the data transmission information, and the target data can be acquired from the data acquisition address according to the data acquisition type, and the target data can be processed according to the data processing method.

[0051]

[0052] Based on the above, after parsing the basic information and layout information of multiple target components, as well as the cascading relationships between them, and generating a document tree corresponding to each target component based on the parsed information, the DSL rendering engine can, when rendering a page using multiple target components, sequentially request each target component from the backend server of the first platform according to the directory structure of the document tree, and receive each target component sequentially returned by the backend server from the component source code library. Based on this, the DSL rendering engine can render the page according to the sequentially obtained target components to obtain the target page.

[0053] The overall process of the embodiments of this application will now be described with reference to the accompanying drawings. Figure 1c This is an overall flowchart of an embodiment of this application, as shown below. Figure 1cAs shown, when the DSL rendering engine receives a rendering request from the first platform for the target page of the application, it first checks whether the local cache contains the DSL description file corresponding to the target page. If it does, it retrieves the DSL description file from the local cache; otherwise, it retrieves it from the DSL description file management platform. Further, if the DSL description file is found, the DSL rendering engine parses it to obtain the basic information, layout information, and cascading relationships between the target components. Based on this, it generates a document tree for the target page and determines whether each target component contains a first target component with event information. If so, it sets data response events and behavior listener events for the first target component in the document tree. Further, it retrieves each target component from the component source code library of the backend server corresponding to the first platform and renders the page based on each target component to obtain the target page. If retrieval fails, it indicates that the parsed target component does not correspond to the component in the component source code library, possibly indicating a parsing error. In this case, the current DSL description file can be re-parsed. Once the target page is obtained, you can continuously monitor whether the first target component on the target page triggers an event during the display of the target page; if so, you can bind data to the first target component and refresh the page.

[0054] For details regarding the overall process described above, please refer to the aforementioned embodiments, which will not be repeated here. In this embodiment, upon receiving a rendering request for a target page initiated by a first platform supported by the application, the DSL description file corresponding to the target page can be obtained, and the attribute information of multiple UI objects contained in the DSL description file and the cascading relationships between the multiple UI objects can be identified. Based on this, the attribute information of the multiple UI objects can be converted into multiple component description information recognizable by the first platform, and the cascading relationships between the multiple UI objects can be converted into page layout information corresponding to multiple target components. Furthermore, based on the page layout information and multiple component description information, a document tree recognizable by the first platform is generated, and data response events and behavior listening events are set for components containing event information, so that after the target page is obtained by rendering the page using multiple target components, corresponding data processing can be performed when the event corresponding to the target component is triggered. Since the DSL description file in this embodiment is a general data format that has been abstracted and re-expressed based on platform characteristics, it is not dependent on the first platform. Therefore, dynamic rendering of the front-end page can be achieved across platforms based on the DSL description file. Furthermore, when rendering the page based on the DSL description file, each platform utilizes the native components and native rendering capabilities supported by each platform to perform page rendering, resulting in higher performance and efficiency.

[0055] It should be noted that the execution subject of each step in the method provided in the above embodiments can be the same device, or the method can be executed by different devices. For example, the execution subject of steps S1 to S5 can be device A; or the execution subject of step S1 can be device A, and the execution subject of steps S2 to S5 can be device B; and so on.

[0056] Furthermore, in some of the processes described in the above embodiments and accompanying drawings, multiple operations appear in a specific order. However, it should be clearly understood that these operations may not be executed in the order they appear herein, or they may be executed in parallel. The operation numbers, such as S1, S2, etc., are merely used to distinguish different operations and do not represent any execution order. Additionally, these processes may include more or fewer operations, and these operations may be executed sequentially or in parallel. It should be noted that the descriptions such as "first" and "second" in this document are used to distinguish different messages, devices, modules, etc., and do not represent a sequential order, nor do they limit "first" and "second" to different types.

[0057] This application also provides a component dynamic rendering apparatus. For example, the component dynamic rendering apparatus can be implemented as a virtual device within a Communication Control Unit (CCU), such as an application program. Figure 2 As shown, the component dynamic rendering device includes an acquisition module 201, a first processing module 202, a second processing module 203, and a rendering module 204; wherein:

[0058] The acquisition module 201 is used to respond to the rendering request initiated by the first platform supported by the application for the target page and acquire the DSL description file corresponding to the target page; wherein the DSL description file is a page information description file that is independent of the characteristics of the first platform;

[0059] The first processing module 202 is used to identify the attribute information of multiple UI objects contained in the DSL description file and the cascading relationship between the multiple UI objects;

[0060] The second processing module 203 is used to convert the attribute information of multiple UI objects into multiple component description information that can be recognized by the first platform, wherein the multiple component description information points to multiple target components supported by the first platform; and to convert the cascading relationship between multiple UI objects into page layout information corresponding to multiple target components;

[0061] The rendering module 204 is used to render the page using multiple target components based on the page layout information and multiple component description information to obtain the target page.

[0062] In an optional embodiment, when the acquisition module 201 responds to a rendering request initiated by the first platform supported by the application for a target page and acquires the DSL description file corresponding to the target page, it is used to retrieve the DSL description file corresponding to the target page from the local cache. During the application startup process, the acquisition module 201 is also used to send a first DSL description file request to the DSL description file management platform, the first DSL description file request including the application version information and the identifiers of each page included in the application; receive the DSL description files corresponding to each page returned by the DSL description file management platform according to the application version information and the identifiers of each page, and write the DSL files corresponding to each page into the local cache.

[0063] In an optional embodiment, when the acquisition module 201 responds to a rendering request initiated by the first platform supported by the application for the target page and acquires the DSL description file corresponding to the target page, it is used to send a second DSL description file request to the DSL description file management platform in response to the rendering request initiated by the first platform supported by the application for the target page. The second DSL description file request includes the version information of the application and the identifier of the target page; and receive the DSL description file corresponding to the target page returned by the DSL description file management platform based on the version information of the application and the identifier of the target page.

[0064] In an optional embodiment, the data structure of the DSL description file is a view tree structure. When the first processing module 202 identifies the attribute information of multiple UI objects contained in the DSL description file and the cascading relationship between multiple UI objects, it parses the DSL description file to obtain the UI objects and their attribute information corresponding to each node in the view tree; and determines the cascading relationship between the UI objects corresponding to each node based on the cascading relationship between each node in the view tree.

[0065] In an optional embodiment, when the second processing module 203 converts the attribute information of multiple UI objects into multiple component description information that the first platform can recognize, it is used to parse the basic information of multiple components and the layout information of multiple components required for rendering the target page from the attribute information of multiple UI objects; and convert the basic information of multiple components and the layout information of multiple components into multiple component description information supported by the first platform according to the syntax rules supported by the first platform.

[0066] In an optional embodiment, the acquisition module 201 is further configured to acquire the specified rendering information of the target page by the first platform, and determine the specified rendering component and the component basic information and component layout information of the specified rendering component according to the specified rendering information; when the second processing module 203 converts the attribute information of multiple UI objects into multiple component description information that the first platform can recognize, it is configured to convert the component basic information and component layout information of multiple UI objects and the specified rendering component into multiple component description information supported by the first platform according to the syntax rules supported by the first platform.

[0067] In an optional embodiment, the first processing module 202 is further configured to determine the cascading relationship between the specified rendering component and multiple target components based on the basic information of the specified rendering component and the component layout information; wherein the cascading relationship between the specified rendering component and multiple target components is collectively used as the cascading relationship, and the specified rendering information and the attribute information of multiple UI objects are collectively used as the attribute information.

[0068] In an optional embodiment, when the second processing module 203 converts the cascading relationship between multiple UI objects into page layout information corresponding to multiple target components, it generates a document tree corresponding to the multiple component description information based on the cascading relationship and the multiple component description information. The directory structure of the document tree represents the page layout information.

[0069] In an optional embodiment, the attribute information further includes event information associated with the first component. The event information includes at least the event triggering behavior, data processing method, and data transmission information. The second processing module 203 is further used to parse the first target component associated with the event information from the attribute information. For the first target component, according to the event triggering behavior, data processing method, and data transmission information, a data response event and a behavior listening event are bound to the first target component in the document tree. The behavior listening event is used to listen for whether an event triggering behavior occurs on the target page when the target page is rendered. The data response event is used to process data according to the data processing method and data transmission information when the behavior listening event detects the event triggering behavior.

[0070] In an optional embodiment, after rendering the target page, the second processing module 203 is further configured to listen for whether an event triggering behavior occurs on the target page; if an event triggering behavior is detected, the data acquisition address and data acquisition type are parsed from the data transmission information, the target data is acquired from the data acquisition address according to the data acquisition type, and the target data is processed according to the data processing method.

[0071] In an optional embodiment, when the rendering module 204 renders the page using multiple target components based on the page layout information and multiple component description information to obtain the target page, it sequentially retrieves each target component corresponding to the document tree from the component source code library supported by the first platform according to the directory structure of the document tree, and renders the page based on each target component retrieved sequentially to obtain the target page.

[0072] It should be noted that the specific functions and implementation processes of each module in the above-mentioned device can be found in the above-mentioned method embodiments, and will not be repeated here.

[0073] This application also provides a component dynamic rendering device. Figure 3 A schematic diagram of the structure of a component dynamic rendering device, such as Figure 3 As shown, the component dynamic rendering device includes: a processor 31 and a memory 32 storing a computer program; wherein the processor 31 and the memory 32 may be one or more.

[0074] Memory 32 is primarily used to store computer programs that can be executed by processor 31, causing processor 31 to control the component dynamic rendering device to perform corresponding functions, actions, or tasks. In addition to storing computer programs, memory 32 can also be configured to store various other data to support operations on the component dynamic rendering device. Examples of this data include instructions for any application or method used to operate on the component dynamic rendering device.

[0075] The memory 32 can be implemented by any type of volatile or non-volatile storage device or a combination thereof, such as static random access memory (SRAM), electrically erasable programmable read-only memory (EEPROM), erasable programmable read-only memory (EPROM), programmable read-only memory (PROM), read-only memory (ROM), magnetic storage, flash memory, magnetic disk or optical disk.

[0076] In this embodiment, the implementation of processor 31 is not limited; it may be, for example, but not limited to, a CPU, GPU, or MCU. Processor 31 can be viewed as a control system for the component dynamic rendering device, capable of executing computer programs stored in memory 32 to control the component dynamic rendering device to perform corresponding functions, actions, or tasks. It is worth noting that, depending on the implementation of the component dynamic rendering device and the scene it is in, the required functions, actions, or tasks will differ; correspondingly, the computer programs stored in memory 32 will also differ, and processor 31 can control the component dynamic rendering device to perform different functions and complete different actions or tasks by executing different computer programs.

[0077] In some alternative embodiments, such as Figure 3 As shown, the component dynamic rendering device may also include other components such as a display 33, a power supply component 34, and a communication component 35. Figure 3 The diagram only shows a portion of the components and does not imply that the dynamic rendering devices for these components only include... Figure 3 The components shown can be dynamically rendered by the device to meet different application needs. Other components may also be included, for example, in cases where voice interaction is required. Figure 3 As shown, the component dynamic rendering device may also include an audio component 36. The specific components that a component dynamic rendering device may include depend on the product form of the device and are not limited here.

[0078] In this embodiment, when the processor 31 executes the computer program in the memory 32, it is used to: respond to a rendering request initiated by a first platform supported by the application for a target page; obtain a DSL description file corresponding to the target page, wherein the DSL description file is a page information description file independent of the characteristics of the first platform; identify the attribute information of multiple UI objects contained in the DSL description file and the cascading relationship between the multiple UI objects; convert the attribute information of the multiple UI objects into multiple component description information that can be recognized by the first platform, wherein the multiple component description information points to multiple target components supported by the first platform; convert the cascading relationship between the multiple UI objects into page layout information corresponding to the multiple target components; and render the page using the multiple target components according to the page layout information and the multiple component description information to obtain the target page.

[0079] In an optional embodiment, when responding to a rendering request initiated by a first platform supported by the application for a target page and obtaining the DSL description file corresponding to the target page, the processor 31 is configured to: respond to the rendering request initiated by the first platform supported by the application for a target page and obtain the DSL description file corresponding to the target page from the local cache; accordingly, the processor 31 is further configured to send a first DSL description file request to the DSL description file management platform during the application startup process, wherein the first DSL description file request includes the application version information and the identifiers of each page included in the application; and receive the DSL description files corresponding to each page returned by the DSL description file management platform according to the application version information and the identifiers of each page, and write the DSL files corresponding to each page into the local cache.

[0080] In an optional embodiment, when responding to a rendering request initiated by a first platform supported by the application for a target page and obtaining a DSL description file corresponding to the target page, the processor 31 is further configured to: respond to the rendering request initiated by the first platform supported by the application for a target page, send a second DSL description file request to a DSL description file management platform, wherein the second DSL description file request includes application version information and the identifier of the target page; and receive the DSL description file corresponding to the target page returned by the DSL description file management platform based on the application version information and the identifier of the target page.

[0081] In an optional embodiment, the data structure of the DSL description file is a view tree structure. When the processor 31 identifies the attribute information of multiple UI objects contained in the DSL description file and the cascading relationship between multiple UI objects, it parses the DSL description file to obtain the UI objects and their attribute information corresponding to each node in the view tree; and determines the cascading relationship between the UI objects corresponding to each node based on the cascading relationship between each node in the view tree.

[0082] In an optional embodiment, when the processor 31 converts the attribute information of multiple UI objects into multiple component description information that can be recognized by the first platform, it is used to parse the basic information of multiple components and the layout information of multiple components required for rendering the target page from the attribute information of multiple UI objects; and convert the basic information of multiple components and the layout information of multiple components into multiple component description information supported by the first platform according to the syntax rules supported by the first platform.

[0083] In an optional embodiment, the processor 31 is further configured to obtain specified rendering information of the target page by the first platform, determine a specified rendering component and its basic component information and component layout information according to the specified rendering information; and convert multiple UI objects and the basic component information and component layout information of the specified rendering component into multiple component description information supported by the first platform according to the syntax rules supported by the first platform.

[0084] In an optional embodiment, the processor 31 is further configured to determine the cascading relationship between the specified rendering component and multiple target components based on the basic information of the specified rendering component and the component layout information; wherein the cascading relationship between the specified rendering component and multiple target components is collectively used as the cascading relationship, and the specified rendering information and the attribute information of multiple UI objects are collectively used as the attribute information.

[0085] In an optional embodiment, when the processor 31 converts the cascading relationship between multiple UI objects into page layout information corresponding to multiple target components, it generates a document tree corresponding to the multiple component description information based on the cascading relationship and the multiple component description information. The directory structure of the document tree represents the page layout information.

[0086] In an optional embodiment, the attribute information further includes event information associated with the first component. The event information includes at least the event triggering behavior, data processing method, and data transmission information. The processor 31 is also used to parse the first target component associated with the event information from the attribute information. For the first target component, according to the event triggering behavior, data processing method, and data transmission information, a data response event and a behavior listening event are bound to the first target component in the document tree. The behavior listening event is used to listen for whether an event triggering behavior occurs on the target page when the target page is rendered. The data response event is used to process data according to the data processing method and data transmission information when the behavior listening event detects the event triggering behavior.

[0087] In an optional embodiment, after rendering the target page, the processor 31 is further configured to, upon detecting an event-triggered behavior on the target page, parse the data acquisition address and data acquisition type from the data transmission information, acquire the target data from the data acquisition address according to the data acquisition type, and process the target data according to the data processing method.

[0088] In an optional embodiment, when rendering a page using multiple target components based on page layout information and multiple component description information, the processor 31 is used to sequentially obtain each target component corresponding to the document tree from the component source code library supported by the first platform according to the directory structure of the document tree, and to render the page based on each target component obtained sequentially to obtain the target page.

[0089] It should be noted that the specific functions of the processor in the above-mentioned dynamic rendering device can be found in the above method embodiments, and will not be repeated here.

[0090] Accordingly, embodiments of this application also provide a computer-readable storage medium storing a computer program, which, when executed, can implement the steps that can be executed by the component dynamic rendering device in the above method embodiments.

[0091] The communication components in the above embodiments are configured to facilitate wired or wireless communication between the device housing the communication component and other devices. The device housing the communication component can access wireless networks based on communication standards, such as WiFi, 2G, 3G, 4G / LTE, 5G, or combinations thereof. In one exemplary embodiment, the communication component receives broadcast signals or broadcast-related information from an external broadcast management system via a broadcast channel. In one exemplary embodiment, the communication component further includes a Near Field Communication (NFC) module to facilitate short-range communication. For example, the NFC module may be implemented based on Radio Frequency Identification (RFID), Infrared Data Association (IrDA) technology, Ultra-Wideband (UWB) technology, Bluetooth (BT) technology, and other technologies.

[0092] The display in the above embodiments includes a screen, which may include a liquid crystal display (LCD) and a touch panel (TP). If the screen includes a touch panel, the screen can be implemented as a touchscreen to receive input signals from a user. The touch panel includes one or more touch sensors to sense touches, swipes, and gestures on the touch panel. The touch sensors can sense not only the boundaries of the touch or swipe action, but also the duration and pressure associated with the touch or swipe operation.

[0093] The power supply component in the above embodiments provides power to various components of the device in which the power supply component is located. The power supply component may include a power management system, one or more power supplies, and other components associated with generating, managing, and distributing power to the device in which the power supply component is located.

[0094] The audio component of the above embodiments can be configured to output and / or input audio signals. For example, the audio component includes a microphone (MIC) configured to receive external audio signals when the device containing the audio component is in an operating mode, such as a call mode, recording mode, or voice recognition mode. The received audio signals can be further stored in memory or transmitted via a communication component. In some embodiments, the audio component also includes a speaker for outputting audio signals.

[0095] Those skilled in the art will understand that embodiments of this application can be provided as methods, systems, or computer program products. Therefore, this application can take the form of a completely hardware embodiment, a completely software embodiment, or an embodiment combining software and hardware aspects. Furthermore, this application can take the form of a computer program product embodied on one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) containing computer-usable program code.

[0096] This application is described with reference to flowchart illustrations and / or block diagrams of methods, apparatus (systems), and computer program products according to embodiments of this application. It will be understood that each block of the flowchart illustrations and / or block diagrams, and combinations of blocks in the flowchart illustrations and / or block diagrams, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general-purpose computer, special-purpose computer, embedded processor, or other programmable data processing apparatus to produce a machine, such that the instructions, which execute via the processor of the computer or other programmable data processing apparatus, create means for implementing the functions specified in one or more flowchart illustrations and / or one or more block diagrams.

[0097] These computer program instructions may also be stored in a computer-readable storage medium that can direct a computer or other programmable data processing device to function in a particular manner, such that the instructions stored in the computer-readable storage medium produce an article of manufacture including instruction means that implement the functions specified in one or more flowcharts and / or one or more block diagrams.

[0098] These computer program instructions may also be loaded onto a computer or other programmable data processing apparatus to cause a series of operational steps to be performed on the computer or other programmable apparatus to produce a computer-implemented process, such that the instructions, which execute on the computer or other programmable apparatus, provide steps for implementing the functions specified in one or more flowcharts and / or one or more block diagrams.

[0099] In a typical configuration, a computing device includes one or more processors (CPU), input / output interfaces, network interfaces, and memory.

[0100] Memory may include non-persistent storage in computer-readable media, such as random access memory (RAM) and / or non-volatile memory, such as read-only memory (ROM) or flash RAM. Memory is an example of computer-readable media.

[0101] Computer-readable media includes both permanent and non-permanent, removable and non-removable media that can store information using any method or technology. Information can be computer-readable instructions, data structures, modules of programs, or other data. Examples of computer storage media include, but are not limited to, phase-change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), flash memory or other memory technologies, CD-ROM, digital versatile optical disc (DVD) or other optical storage, magnetic tape, magnetic magnetic disk storage or other magnetic storage devices, or any other non-transferable medium that can be used to store information accessible by a computing device. As defined herein, computer-readable media does not include transient computer-readable media, such as modulated data signals and carrier waves.

[0102] It should also be noted that the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus. Without further limitation, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes said element.

[0103] The above description is merely an embodiment of this application and is not intended to limit this application. Various modifications and variations can be made to this application by those skilled in the art. Any modifications, equivalent substitutions, improvements, etc., made within the spirit and principle of this application should be included within the scope of the claims of this application.

Claims

1. A method for dynamic rendering of components, characterized in that, include: In response to a rendering request initiated by the first platform supported by the application for a target page, the application obtains the DSL description file and specified rendering information corresponding to the target page. The DSL description file is a page information description file that is independent of the characteristics of the first platform. The specified rendering information is set on demand for the specified rendering components in the target page when the first platform has specified rendering requirements for the specified rendering components in the target page. The specified rendering information is injected into the startup parameters of the DSL rendering engine each time it starts, so that the DSL rendering engine can obtain the specified rendering information of the first platform for the target page. The specified rendering information is used to determine the specified rendering components and the basic component information and component layout information of the specified rendering components. Identify the attribute information of multiple UI objects contained in the DSL description file and the cascading relationships between the multiple UI objects; The basic information and layout information of multiple components contained in the attribute information of the multiple UI objects, as well as the basic information and layout information of the specified rendering component, are converted into multiple component description information that the first platform can recognize. The multiple component description information points to multiple target components supported by the first platform and the specified rendering component. The cascading relationship between the multiple target components and the specified rendering component is converted into page layout information corresponding to the multiple target components and the specified rendering component. The cascading relationship between the multiple target components and the specified rendering component is determined based on the component basic information and component layout information of the specified rendering component. Based on the page layout information and the multiple component description information, the page is rendered using the multiple target components and the specified rendering component to obtain the target page; The attribute information further includes event information associated with the first component. The event information includes at least the event triggering behavior, data processing method, and data transmission information. The method also includes: The first target component associated with event information is parsed from the attribute information; For the first target component, based on the event triggering behavior, data processing method, and data transmission information, a data response event and a behavior listening event are bound to the first target component in the page layout information; wherein, the behavior listening event is used to listen for whether the event triggering behavior occurs on the target page when the target page is rendered, and the data response event is used to perform data processing according to the data processing method and the data transmission information when the behavior listening event detects the event triggering behavior.

2. The method according to claim 1, characterized in that, In response to a rendering request initiated by the first platform supported by the application for a target page, the application obtains the DSL description file corresponding to the target page, including: In response to a rendering request for a target page initiated by the first platform supported by the application, the DSL description file corresponding to the target page is retrieved from the local cache; The method further includes: during the application startup process, sending a first DSL description file request to the DSL description file management platform, wherein the first DSL description file request includes the version information of the application and the identifiers of each page contained in the application; The system receives the DSL description file corresponding to each page returned by the DSL description file management platform based on the application version information and the identifier of each page, and writes the DSL file corresponding to each page into the local cache.

3. The method according to claim 1, characterized in that, In response to a rendering request initiated by the first platform supported by the application for a target page, the application obtains the DSL description file corresponding to the target page, including: In response to a rendering request initiated by the first platform supported by the application for the target page, a second DSL description file request is sent to the DSL description file management platform. The second DSL description file request includes the version information of the application and the identifier of the target page. The system receives the DSL description file corresponding to the target page, returned by the DSL description file management platform based on the application version information and the identifier of the target page.

4. The method according to claim 1, characterized in that, The data structure of the DSL description file is a view tree structure, which identifies the attribute information of multiple UI objects contained in the DSL description file and the cascading relationships between the multiple UI objects, including: The DSL description file is parsed to obtain the UI objects and their attribute information corresponding to each node in the view tree; Based on the cascading relationships between nodes in the view tree, determine the cascading relationships between the UI objects corresponding to each node.

5. The method according to claim 1, characterized in that, The basic component information and layout information of the multiple UI objects, as well as the basic component information and layout information of the specified rendering component, are converted into multiple component description information that the first platform can recognize, including: Parse the attribute information of the multiple UI objects to extract the basic information of multiple components and the layout information of multiple components required for rendering the target page; According to the syntax rules supported by the first platform, the basic information of the multiple components, the layout information of the multiple components, and the basic information and layout information of the specified rendering component are converted into multiple component description information supported by the first platform.

6. The method according to claim 5, characterized in that, Also includes: After obtaining the specified rendering information of the target page, the specified rendering component, as well as the basic component information and component layout information of the specified rendering component, are determined based on the specified rendering information. The step of converting the basic component information and layout information of the multiple UI objects contained in their attribute information, as well as the basic component information and layout information of the specified rendering component, into multiple component description information that the first platform can recognize includes: According to the syntax rules supported by the first platform, the basic component information and component layout information of the multiple UI objects and the specified rendering component are converted into multiple component description information supported by the first platform.

7. The method according to claim 6, characterized in that, The method further includes: Based on the basic information and layout information of the specified rendering component, the cascading relationship between the specified rendering component and the plurality of target components is determined; wherein, the cascading relationship between the specified rendering component and the plurality of target components is collectively referred to as the cascading relationship, and the specified rendering information and the attribute information of the plurality of UI objects are collectively referred to as the attribute information.

8. The method according to claim 5 or 7, characterized in that, The cascading relationships between the multiple UI objects are converted into page layout information corresponding to the multiple target components, including: Based on the cascading relationship and the description information of the multiple components, a document tree corresponding to the description information of the multiple components is generated, and the directory structure of the document tree represents the page layout information.

9. The method according to claim 1, characterized in that, After rendering the target page, the method further includes: Monitor whether the event-triggered behavior occurs on the target page; Upon detecting the event-triggered behavior, the data acquisition address and data acquisition type are parsed from the data transmission information. The target data is then acquired from the data acquisition address according to the data acquisition type, and the target data is processed according to the data processing method.

10. The method according to claim 1, characterized in that, Based on the page layout information and the multiple component description information, page rendering is performed using the multiple target components to obtain the target page, including: According to the directory structure of the document tree, each target component corresponding to the document tree is obtained sequentially from the component source code library supported by the first platform, and the page is rendered according to each target component obtained sequentially to obtain the target page.

11. A component dynamic rendering device, characterized in that, include: The acquisition module is used to respond to a rendering request initiated by a first platform supported by the application for a target page, acquire the DSL description file and specified rendering information corresponding to the target page, wherein the DSL description file is a page information description file that is independent of the characteristics of the first platform, the specified rendering information is set on demand for the specified rendering component in the target page when the first platform has a specified rendering requirement for the specified rendering component in the target page, and the specified rendering information is injected into the startup parameters of the DSL rendering engine each time it starts, so that the DSL rendering engine can acquire the specified rendering information of the first platform for the target page, and the specified rendering information is used to determine the specified rendering component and the basic component information and component layout information of the specified rendering component; The first processing module is used to identify the attribute information of multiple UI objects contained in the DSL description file and the cascading relationship between the multiple UI objects; The second processing module is used to convert the basic information of multiple components and the layout information of multiple components contained in the attribute information of the multiple UI objects, as well as the basic information of the components and the layout information of the specified rendering component, into multiple component description information that can be recognized by the first platform. The multiple component description information points to multiple target components supported by the first platform and the specified rendering component. And convert the cascading relationship between multiple target components and the specified rendering component into page layout information corresponding to the multiple target components and the specified rendering component. The cascading relationship between the multiple target components and the specified rendering component is determined based on the component basic information and component layout information of the specified rendering component. The rendering module is used to render the page using the multiple target components and the specified rendering component based on the page layout information and the multiple component description information, so as to obtain the target page; The attribute information further includes event information associated with the first component. The event information includes at least the event triggering behavior, data processing method, and data transmission information. The device also includes: The parsing module is used to parse the attribute information to extract the first target component associated with event information; The binding module is used to bind a data response event and a behavior listening event to the first target component in the page layout information, based on the event triggering behavior, data processing method, and data transmission information. The behavior listening event is used to listen for whether the event triggering behavior occurs on the target page when the target page is rendered. The data response event is used to process data according to the data processing method and the data transmission information when the behavior listening event detects the event triggering behavior.

12. A component dynamic rendering device, characterized in that, include: Processor and memory storing computer programs; The processor is configured to execute the computer program for: In response to a rendering request initiated by the first platform supported by the application for a target page, the application obtains the DSL description file and specified rendering information corresponding to the target page. The DSL description file is a page information description file that is independent of the characteristics of the first platform. The specified rendering information is set on demand for the specified rendering components in the target page when the first platform has specified rendering requirements for the specified rendering components in the target page. The specified rendering information is injected into the startup parameters of the DSL rendering engine each time it starts, so that the DSL rendering engine can obtain the specified rendering information of the first platform for the target page. The specified rendering information is used to determine the specified rendering components and the basic component information and component layout information of the specified rendering components. Identify the attribute information of multiple UI objects contained in the DSL description file and the cascading relationships between the multiple UI objects; The basic information and layout information of multiple components contained in the attribute information of the multiple UI objects, as well as the basic information and layout information of the specified rendering component, are converted into multiple component description information that the first platform can recognize. The multiple component description information points to multiple target components supported by the first platform and the specified rendering component. The cascading relationship between the multiple target components and the specified rendering component is converted into page layout information corresponding to the multiple target components and the specified rendering component. The cascading relationship between the multiple target components and the specified rendering component is determined based on the component basic information and component layout information of the specified rendering component. Based on the page layout information and the multiple component description information, the page is rendered using the multiple target components and the specified rendering component to obtain the target page; The attribute information also includes event information associated with the first component. This event information includes at least the event triggering behavior, data processing method, and data transmission information, and further includes: The first target component associated with event information is parsed from the attribute information; For the first target component, based on the event triggering behavior, data processing method, and data transmission information, a data response event and a behavior listening event are bound to the first target component in the page layout information; wherein, the behavior listening event is used to listen for whether the event triggering behavior occurs on the target page when the target page is rendered, and the data response event is used to perform data processing according to the data processing method and the data transmission information when the behavior listening event detects the event triggering behavior.

13. A computer-readable storage medium storing a computer program, characterized in that, When the computer program is executed by a processor, it causes the processor to perform the steps of the method according to any one of claims 1-10.

Citation Information

Patent Citations

  • Rendering generation method and device of front-end page, front-end equipment and storage medium

    CN112558970A