Interface rendering method and device, equipment, storage medium and program product

Abstract

The invention relates to an interface rendering method and device, computer equipment, a storage medium and a computer program product. The method comprises the steps of obtaining skeleton configuration information and a component configuration information set of a target interface from a server according to an interface display request for the target interface; rendering an interface skeleton of the target interface according to the skeleton configuration information; generating business data acquisition requests corresponding to the data components of the target interface according to the component configuration information set, and performing deduplication summarization on the business data acquisition requests according to the business identifiers; obtaining corresponding target business data from a server according to the target business data obtaining request corresponding to each business identifier obtained by deduplication summarization; according to the component configuration information set and the target business data, determining data rendering information corresponding to each data component corresponding to the same business identifier; and according to each piece of data rendering information, respectively rendering the corresponding data component in the interface skeleton. Therefore, the interface rendering efficiency can be improved.

Description

Technical Field

[0001] The present application relates to the field of computer technology, and in particular to an interface rendering method, apparatus, computer equipment, storage medium and computer program product. Background Art

[0002] With the development of computer technology, the Internet has brought great convenience to people's daily life. Users can browse business information through terminals anytime and anywhere, and terminals display business information to users through rendering interfaces.

[0003] Currently, the front end usually requests all the data required for interface rendering from the back end at one time, and renders the display interface based on the data returned by the back end. However, this interface rendering method has low rendering efficiency, especially when the interface involves a lot of chart data, the user waits too long, which easily leads to interface freezes. Summary of the invention

[0004] Based on this, it is necessary to provide an interface rendering method, apparatus, computer equipment, computer-readable storage medium and computer program product that can improve interface rendering efficiency in response to the above technical problems.

[0005] This application provides an interface rendering method, including:

[0006] Sending an interface display request for a target interface to a server, so that the server returns interface configuration information of the target interface according to the interface display request; the interface configuration information includes skeleton configuration information and component configuration information set;

[0007] Rendering an interface skeleton of the target interface according to the skeleton configuration information;

[0008] Generate business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set, and deduplicate and aggregate each business data acquisition request according to the business identifier to obtain target business data acquisition requests corresponding to each business identifier;

[0009] Sending target service data acquisition requests corresponding to the respective service identifiers to the server, so that the server returns the corresponding target service data according to the respective target service data acquisition requests;

[0010] Determine, according to the component configuration information set and the target business data, data rendering information corresponding to each data component corresponding to the same business identifier;

[0011] According to each data rendering information, corresponding data components are rendered in the interface skeleton respectively.

[0012] The present application also provides an interface rendering device, comprising:

[0013] A first request sending module is used to send an interface display request for a target interface to a server, so that the server returns interface configuration information of the target interface according to the interface display request; the interface configuration information includes skeleton configuration information and component configuration information set;

[0014] A first interface rendering module, used for rendering an interface skeleton of the target interface according to the skeleton configuration information;

[0015] A request deduplication module is used to generate business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set, and to deduplicate and aggregate each business data acquisition request according to the business identifier to obtain the target business data acquisition request corresponding to each business identifier;

[0016] A second request sending module, used for sending the target service data acquisition requests corresponding to the respective service identifiers to the server, so that the server returns the corresponding target service data according to the respective target service data acquisition requests;

[0017] A data analysis module, used to determine data rendering information corresponding to each data component corresponding to the same business identifier according to the component configuration information set and the target business data;

[0018] The second interface rendering module is used to render corresponding data components in the interface skeleton according to various data rendering information.

[0019] This application provides an interface rendering method, including:

[0020] In response to an interface display request for a target interface sent by a terminal, acquiring interface configuration information of the target interface; the interface configuration information includes skeleton configuration information and component configuration information set;

[0021] Returning the interface configuration information to the terminal, so that the terminal renders the interface skeleton of the target interface according to the skeleton configuration information, generating business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set, and deduplicating and aggregating each business data acquisition request according to the business identifier corresponding to the business data acquisition request to obtain the target business data acquisition request corresponding to each business identifier;

[0022] Responding to each target service data acquisition request sent by the terminal, respectively acquiring the corresponding target service data;

[0023] The target business data is returned to the terminal so that the terminal determines the data rendering information corresponding to each data component corresponding to the same business identifier according to the component configuration information set and the target business data, and renders the corresponding data components in the interface skeleton according to each data rendering information.

[0024] The present application also provides an interface rendering device, comprising:

[0025] A first request processing module, configured to obtain interface configuration information of a target interface in response to an interface display request sent by a terminal; the interface configuration information includes skeleton configuration information and component configuration information set;

[0026] A first data return module is used to return the interface configuration information to the terminal, so that the terminal renders the interface skeleton of the target interface according to the skeleton configuration information, generates business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set, and deduplicates and aggregates each business data acquisition request according to the business identifier corresponding to the business data acquisition request to obtain the target business data acquisition request corresponding to each business identifier;

[0027] A second request processing module, configured to respectively obtain corresponding target service data in response to each target service data acquisition request sent by the terminal;

[0028] The second data return module is used to return the target business data to the terminal, so that the terminal can determine the data rendering information corresponding to each data component corresponding to the same business identifier according to the component configuration information set and the target business data, and render the corresponding data components in the interface skeleton according to each data rendering information.

[0029] The present application also provides a computer device, including a memory and a processor, wherein the memory stores a computer program, and the processor implements the steps described in the above interface rendering method when executing the computer program.

[0030] The present application also provides a computer-readable storage medium on which a computer program is stored. When the computer program is executed by a processor, the steps described in the above-mentioned interface rendering method are implemented.

[0031] The present application also provides a computer program product, including a computer program, which implements the steps of the above-mentioned interface rendering method when executed by a processor.

[0032] The above-mentioned interface rendering method, device, computer equipment, storage medium and computer program product, when interface rendering is required, the terminal first requests the skeleton configuration information and component configuration information set of the target interface from the server, so that the terminal can first render the skeleton of the target interface according to the skeleton configuration information. The terminal then deduplicates the business data acquisition requests of the data components belonging to the same business identifier according to the component configuration information set and aggregates them into a target business data acquisition request, and requests the corresponding business data from the server respectively according to the target business data acquisition request, thereby avoiding sending repeated business data acquisition requests to the server, which helps to improve data acquisition efficiency, thereby improving interface rendering efficiency. The terminal distinguishes the data rendering information corresponding to each data component corresponding to the same business identifier according to the component configuration information set and the target business data, and then independently renders the corresponding data components in the interface skeleton according to each data rendering information, which helps to improve interface rendering efficiency. The data components that have been rendered first can be displayed first to avoid users waiting too long. In this way, data is requested from the backend for rendering through chain requests, and the data obtained first is rendered first, which can effectively improve the interface rendering efficiency. In addition, the business data acquisition requests belonging to the data components of the same business identifier are deduplicated and aggregated into a target business data acquisition request, which can reduce the number of redundant requests, reduce resource waste, improve data processing efficiency, and thus improve interface rendering efficiency. BRIEF DESCRIPTION OF THE DRAWINGS

[0033] In order to more clearly illustrate the technical solutions in the embodiments of the present application or the related technologies, the drawings required for use in the embodiments or the related technical descriptions are briefly introduced below. Obviously, the drawings described below are only some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying creative work.

[0034] Figure 1 An application environment diagram of an interface rendering method in an embodiment;

[0035] Figure 2 A flowchart of an interface rendering method in one embodiment;

[0036] Figure 3 A schematic diagram of deduplication and aggregation of business requests in one embodiment;

[0037] Figure 4 A schematic diagram of a data processing process of a front end and a back end in one embodiment;

[0038] Figure 5 A schematic diagram of a flow chart of an interface rendering method in another embodiment;

[0039] Figure 6A schematic diagram of a data processing process of a front end and a back end in another embodiment;

[0040] Figure 7 A schematic diagram of sending a data fetching request from a front end to a large screen for rendering a chart in one embodiment;

[0041] Figure 8 A schematic diagram of sending a business request from a front end to a rendering chart in one embodiment;

[0042] Fig. 9 It is a structural block diagram of an interface rendering device in an embodiment;

[0043] Fig.10 It is a structural block diagram of an interface rendering device in another embodiment;

[0044] Fig.11 is an internal structure diagram of a computer device in one embodiment;

[0045] Fig.12 FIG. 4 is a diagram showing the internal structure of a computer device in another embodiment. DETAILED DESCRIPTION

[0046] In order to make the purpose, technical solution and advantages of the present application more clearly understood, the present application is further described in detail below in conjunction with the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are only used to explain the present application and are not used to limit the present application.

[0047] The interface rendering method provided in the embodiment of the present application can be applied to Figure 1 In the application environment shown. Among them, the terminal 102 communicates with the server 104 through the network. The data storage system can store the data that the server 104 needs to process. The data storage system can be set up separately, can be integrated on the server 104, or can be placed on the cloud or other devices. Among them, the terminal 102 can be, but is not limited to, various personal computers, laptops, smart phones, tablets, Internet of Things devices and portable wearable devices. The Internet of Things devices can be smart speakers, smart TVs, smart air conditioners, smart car devices, projection devices, etc. Portable wearable devices can be smart watches, smart bracelets, head-mounted devices, etc. The head-mounted device can be a virtual reality (VR) device, an augmented reality (AR) device, smart glasses, etc. The server 104 can be an independent physical server, a server cluster or distributed system composed of multiple physical servers, or a cloud server that provides cloud computing services.

[0048] Specifically, the terminal sends an interface display request for the target interface to the server. The server returns the interface configuration information of the target interface to the terminal according to the interface display request, and the interface configuration information includes the skeleton configuration information and the component configuration information set. The terminal renders the interface skeleton of the target interface according to the skeleton configuration information, generates the business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set, deduplicates and aggregates each business data acquisition request according to the business identifier, and obtains the target business data acquisition request corresponding to each business identifier. The terminal sends the target business data acquisition request corresponding to each business identifier to the server. The server returns the corresponding target business data to the terminal according to each target business data acquisition request. The terminal determines the data rendering information corresponding to each data component corresponding to the same business identifier based on the component configuration information set and the target business data, and renders the corresponding data components in the interface skeleton according to each data rendering information.

[0049] In one embodiment, Figure 2 As shown, an interface rendering method is provided, which is applied to Figure 1 The terminal in is used as an example to illustrate.

[0050] Step S202, sending an interface display request for the target interface to the server, so that the server returns interface configuration information of the target interface according to the interface display request; the interface configuration information includes skeleton configuration information and component configuration information set.

[0051] Among them, the target interface refers to the interface to be displayed. It is understood that the target interface can be any interface. The interface display request for the target interface is used to request the display of the target interface. The interface configuration information of the target interface includes the skeleton configuration information and the component configuration information set of the target interface. The skeleton configuration information is the configuration information of the interface skeleton of the target interface. The skeleton configuration information refers to the layout structure information of the interface. The skeleton configuration information defines the skeleton of the interface, that is, the basic framework and structure of the interface. The skeleton configuration information includes the distribution and style information of the header, bottom, sidebar, content area, etc. of the interface. The skeleton configuration information is used to indicate the overall structure and layout information of the interface. The component configuration information set includes the component configuration information corresponding to each data component in the target interface. The data components in the target interface are visual elements used to display or even operate data. They can convert complex data into easy-to-understand visual information, helping users quickly gain insight into the trends, patterns and anomalies behind the data. The target interface can display a variety of data components. For example, a data component can be a chart component for displaying charts, a map component for displaying maps, a text component for displaying text, a video component for displaying videos, etc. Component configuration information is the configuration information for the data component in the target interface. Component configuration information includes the component identifier, data source (also called data source), component attributes and other configuration information of the data component. The data source refers to the source of the business data required by the data component. Component attributes include attribute information such as the type, color, and size of the data component. It can be understood that component configuration information does not contain specific business data. Taking the data component as a chart component as an example, the component configuration information does not contain the specific business data in the chart that the chart component needs to display.

[0052] Specifically, if a display operation for a target interface is triggered on the terminal, the terminal generates an interface display request for the target interface and sends the interface display request for the target interface to the server. The server responds to the interface display request for the target interface, obtains the interface configuration information of the target interface, and returns the interface configuration information of the target interface to the terminal.

[0053] Step S204: rendering the interface skeleton of the target interface according to the skeleton configuration information.

[0054] The interface skeleton of the target interface refers to the interface framework of the target interface.

[0055] Specifically, the interface configuration information includes skeleton configuration information and component configuration information set. After acquiring the interface configuration information of the target interface, the terminal can directly start rendering, and first render the interface skeleton of the target interface according to the skeleton configuration information.

[0056] Step S206, generating business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set, deduplicating and aggregating each business data acquisition request according to the business identifier, and obtaining target business data acquisition requests corresponding to each business identifier.

[0057] The business data acquisition request corresponding to the data component is used to request the business data corresponding to the data component. The business data acquisition request has a corresponding business identifier, which is used to identify the business type corresponding to the business data requested by the business data acquisition request. The target business data acquisition request corresponding to the business identifier is used to request all business data required by each data component corresponding to the same business identifier (that is, the required business data belongs to each data component of the same business type).

[0058] Specifically, the component configuration information set of the target interface includes component configuration information corresponding to each data component in the target interface. The component configuration information includes the data source and data range of the data component. The data source refers to the source of the business data required by the data component, and the data range refers to the range of the business data required by the data component. Therefore, the terminal can generate a business data acquisition request corresponding to the data component according to the component configuration information corresponding to the data component. That is, the terminal can obtain the business data acquisition request corresponding to each data component of the target interface according to the component configuration information set. Each business data belonging to the same business identifier is usually stored in the same database or can be acquired through the same data acquisition method. The business identifier can be determined according to the data source. Therefore, there is a corresponding business identifier for the business data acquisition request. The terminal deduplicates and aggregates each business data acquisition request according to the business identifier to obtain the target business data acquisition request corresponding to each business identifier.

[0059] For example, see Figure 3 The target interface is used to display multiple chart components, and the multiple chart components include chart components corresponding to multiple charts of multiple businesses. The front end generates business requests (i.e., business data acquisition requests) corresponding to each chart component in the target interface. The front end deduplicates and aggregates each business request based on the business identifier corresponding to the business request, aggregates the business requests corresponding to the same business identifier into one business request, and obtains the total business request corresponding to each business identifier. In other words, each business independently makes a data acquisition request (i.e., business data acquisition request). The front end requests the corresponding business data from the back end based on the total business requests corresponding to each business identifier, and the back end processes each total business request in parallel through multiple threads.

[0060] It can be understood that many of the charts to be displayed in an interface are from the same business or the same data source. In traditional technology, each chart component makes an independent data request, which easily causes repeated requests for the same business, resulting in repeated development and performance impact. However, in this application, the business data of a business type is aggregated into a data source. When the interface needs to be displayed, the chart component binds the data source to make a back-end request. The front-end performs deduplication processing based on the business type (i.e., business identifier) ​​before making a back-end request. When there are multiple businesses at the same time, each business retrieves data for an independent thread. This can avoid redundant requests and reduce the burden on the database.

[0061] Step S208: sending the target service data acquisition requests corresponding to the respective service identifiers to the server, so that the server returns the corresponding target service data according to the respective target service data acquisition requests.

[0062] The target business data refers to the business data requested by the target business data acquisition request.

[0063] Specifically, the terminal sends the target business data acquisition request corresponding to each business identifier to the server, and the server responds to each target business data acquisition request to obtain the corresponding target business data. For example, the server responds to the target business data acquisition request and obtains the required target business data from the corresponding database according to the business identifier corresponding to the target business data acquisition request. The server can process each target business data acquisition request in parallel through multiple threads. Once the server obtains the target business data requested by a target business data acquisition request, it returns the target business data to the terminal, so that the terminal can start rendering the data component in time to improve the interface rendering efficiency.

[0064] Step S210: determining data rendering information corresponding to each data component corresponding to the same business identifier according to the component configuration information set and the target business data.

[0065] The data rendering information corresponding to the data component refers to the data required for rendering the data component. The data rendering information includes the configuration information and business data required for rendering the data component.

[0066] Specifically, each target business data acquisition request has a corresponding business identifier. Each time the terminal obtains the target business data corresponding to a target business data acquisition request, it promptly determines the data rendering information corresponding to each data component corresponding to the business identifier based on the component configuration information set of the component configuration information and the target business data. The terminal can obtain the business data required by the data component from the target business data according to the component configuration information, and obtain the data rendering information of the data component according to the component configuration information and the business data of the data component.

[0067] Step S212: Render corresponding data components in the interface skeleton according to the data rendering information.

[0068] Specifically, the terminal renders corresponding data components in the interface skeleton according to each data rendering information. When the terminal obtains data rendering information corresponding to a data component, it can render the data component in the interface skeleton according to the data rendering information, so that the user can quickly see the data component on the interface.

[0069] In traditional technology, the backend usually returns all the data required for the target interface to the frontend for rendering, which can easily lead to high rendering pressure on the frontend, and if the acquisition efficiency of the business data required by several data components is low, the user needs to wait for a long time to see the target interface. However, in this application, the server independently returns the target business data corresponding to each target business data acquisition request to the terminal, which can effectively reduce the user's waiting time. The terminal independently renders each data component, and the data components that have been rendered first are displayed first, which can further effectively reduce the user's waiting time, thereby improving the efficiency of interface rendering.

[0070] In the above interface rendering method, when interface rendering is required, the terminal first requests the skeleton configuration information and component configuration information set of the target interface from the server, so that the terminal can first render the skeleton of the target interface according to the skeleton configuration information. The terminal then deduplicates the business data acquisition requests of the data components belonging to the same business identifier according to the component configuration information set and aggregates them into a target business data acquisition request, and requests the corresponding business data from the server according to the target business data acquisition request, thereby avoiding sending repeated business data acquisition requests to the server, which helps to improve data acquisition efficiency and thus improve interface rendering efficiency. The terminal distinguishes the data rendering information corresponding to each data component corresponding to the same business identifier according to the component configuration information set and the target business data, and then independently renders the corresponding data components in the interface skeleton according to each data rendering information, which helps to improve the interface rendering efficiency. The data components that have been rendered first can be displayed first to avoid users waiting too long. In this way, data is requested from the backend for rendering through chain requests, and the data obtained first is rendered first, which can effectively improve the interface rendering efficiency. In addition, the business data acquisition requests belonging to the data components of the same business identifier are deduplicated and aggregated into a target business data acquisition request, which can reduce the number of redundant requests, reduce resource waste, improve data processing efficiency, and thus improve interface rendering efficiency.

[0071] In one embodiment, the component configuration information set includes a plug-in identification list, and the plug-in identification list includes plug-in identifications corresponding to each data component of the target interface.

[0072] Generate business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set, remove duplicates and aggregate each business data acquisition request according to the business identifier, and obtain the target business data acquisition request corresponding to each business identifier, including:

[0073] Generate business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set; the business data acquisition request carries the corresponding plug-in identifier;

[0074] Use different plug-in IDs as different business IDs;

[0075] The business data acquisition requests corresponding to the same business identifier are merged to obtain target business data acquisition requests corresponding to the business identifiers.

[0076] The component configuration information set includes a plug-in identification list. The plug-in identification list includes plug-in identifications corresponding to each data component of the target interface. The plug-in identification is used to identify the plug-in corresponding to the data component. The server calls the plug-in corresponding to the data component to obtain the business data required by the data component. The plug-in identification is equivalent to the data source of the data component.

[0077] Specifically, the component configuration information set includes a plug-in identifier list and component configuration information corresponding to each data component. The terminal can generate business data acquisition requests corresponding to each data component according to the component configuration information set, and the business data acquisition request carries the corresponding plug-in identifier. Further, the terminal uses different plug-in identifiers as different business identifiers, merges the business data acquisition requests corresponding to the same business identifier, and obtains the target business data acquisition requests corresponding to each business identifier. For example, the business data acquisition request carries the corresponding data range. When merging the business data acquisition requests corresponding to the same business identifier, the data ranges corresponding to the same business identifier are merged to obtain a comprehensive range, and the target business data acquisition request corresponding to the business identifier carries the comprehensive range. For another example, the terminal does not consider the data range of the business data required by the data component. The terminal directly obtains all business data corresponding to a business identifier from the server according to the target business data acquisition request corresponding to the business identifier, and then selects the business data required by the data component corresponding to the business identifier from it.

[0078] In the above embodiment, when the interface needs to be displayed, the terminal first requests the interface configuration information from the server, renders the interface skeleton according to the skeleton configuration information in the interface configuration information, and makes a service request to the server according to the component configuration information set in the interface configuration information. The component configuration information set includes a plug-in identification list, and according to the plug-in identification list, the service requests corresponding to each data component can be deduplicated according to the business before making a service request to the server, thereby avoiding redundant requests, reducing the number of front-end and back-end interactions, improving the interaction efficiency, and thus improving the interface rendering efficiency.

[0079] In one embodiment, the component configuration information set includes component configuration information corresponding to each data component of the target interface.

[0080] According to the component configuration information set and the target business data, the data rendering information corresponding to each data component corresponding to the same business identifier is determined, including:

[0081] Through the data filter, the target business data is filtered according to the configuration information of each component corresponding to the business identifier corresponding to the target business data, and the business data corresponding to each data component corresponding to the same business identifier is obtained;

[0082] Converting the data structure of the business data corresponding to the data component into the data structure indicated by the component configuration information corresponding to the data component through the data converter;

[0083] Based on the converted business data, the data rendering information corresponding to the data component is obtained.

[0084] The terminal includes a data filter and a data converter. The data filter is a tool for filtering target business data. The data converter is a tool for converting the data structure of business data. It can be understood that the data filter and the data converter can be integrated into one tool or can be separate tools.

[0085] Specifically, when the terminal obtains the corresponding target business data from the server according to the target business data acquisition request, the terminal does not distinguish between the business data required by each data component of the same business identifier, and uniformly requests the business data required by each data component of the same business identifier. The server does not need to consider the data structure of the business data required by each data component, and uniformly returns the business data of the preset data structure. In this way, the data interaction between the terminal and the server can achieve a completely decoupled effect, and each party does not need to care about how the other party processes the data.

[0086] Each time the terminal obtains the target business data corresponding to a target business data acquisition request, the terminal performs data screening and data structure conversion on the target business data through the data filter and the data converter, and obtains the data rendering information of each data component corresponding to the same business identifier. The target business data corresponding to a business identifier includes the business data required by each data component corresponding to the business identifier. The component configuration information of the data component includes the data range of the data component. The target business data is screened through the data filter according to the component configuration information corresponding to the business identifier corresponding to the target business data, and the business data corresponding to each data component corresponding to the same business identifier is obtained. For example, the target business data includes all business data of business A, and the data component 1 corresponding to business A is used to display chart 1, and the data component 2 corresponding to business A is used to display chart 2. The business data required by data component 1 is obtained from the target business data according to the component configuration information of data component 1, and the business data required by data component 2 is obtained from the target business data according to the component configuration information of data component 2.

[0087] Then, through the data converter, the data structure of the business data corresponding to the data component is converted into the data structure indicated by the component configuration information corresponding to the data component. For example, if the data component 1 corresponding to business A is used to display a line graph, the data component 2 corresponding to business A is used to display a table, and the data component 3 corresponding to business A is used to display a progress chart. For the business data corresponding to data component 1, the business data is converted from the preset data structure to the data structure required for drawing a line graph; for the business data corresponding to data component 2, the business data is converted from the preset data structure to the data structure required for drawing a table; for the business data corresponding to data component 3, the business data is converted from the preset data structure to the data structure required for drawing a progress chart. The data converter can preset the data structure conversion logic corresponding to various types of data components, so that when data structure conversion is required, the corresponding data structure conversion logic can be obtained according to the component type in the component configuration information corresponding to the data component, and the data structure of the business data corresponding to the data component is converted from the preset data structure to the data structure required by the data component according to the data structure conversion logic.

[0088] Finally, the terminal obtains the data rendering information corresponding to the data component based on the converted business data corresponding to the data component.

[0089] It is understandable that in the traditional technology, for the data acquisition requests of different data components, the business objects returned by the back end to the front end are usually different. Whether it is the front-end processing or the back-end processing, it is necessary to write a large amount of judgment and assembly code logic for each data component, so that the front end and the back end can be connected to the business object, but this easily leads to high development costs and maintenance costs for the front end and the back end, and each data component needs to be maintained separately. However, in the present application, there is no need to write a large amount of judgment and assembly code logic for each data component at the front end and the back end respectively. The front end and the back end are completely decoupled. For all data components, the back end uniformly generates business data of a preset data structure, and the front end writes the data structure conversion logic corresponding to various types of data components in the data converter. The business data of the preset data structure can be converted into the data structure required by any data component through the data converter. The front end only needs to uniformly maintain the data converter, and the front end and the back end do not need to care about how the other party processes data, thereby effectively reducing development costs.

[0090] In the above embodiment, the front end requests business data from the back end in business units. If the front end obtains the target business data returned by the back end, the business data required for a single data component is first obtained from the target business data through a data filter, and then the data structure of the business data is converted into the data structure required for a single data component through a data converter, thereby obtaining the relevant data required for data component rendering. The front end and the back end do not need to care about how the other party processes data, which realizes the complete decoupling of the front end and the back end and reduces development costs.

[0091] In one embodiment, according to each data rendering information, corresponding data components are rendered in the interface skeleton respectively, including:

[0092] For the data rendering information corresponding to any data component, the data rendering information corresponding to the data component is written into the independent cache space corresponding to the data component. In the independent cache space corresponding to the data component, the data component is rendered and displayed in the interface skeleton according to the data rendering information corresponding to the data component.

[0093] Specifically, each data component is rendered independently, which can shorten the rendering time. The terminal opens up an independent cache space for each data component and renders the data component in the independent rendering space. Once the terminal obtains the data rendering information corresponding to a single data component, it writes the data rendering information into the independent cache space corresponding to the data component, and renders the data component in the independent cache space according to the data rendering information, thereby displaying the data component at the corresponding position in the interface skeleton of the target interface.

[0094] It is understandable that in traditional technology, each data component is usually rendered uniformly, which results in low rendering efficiency. However, in this application, when rendering the interface, the front end can create an independent DOM (Document Object Model) node for each data component, that is, open up an independent DOM cache space, so as to avoid the styles and behaviors of different data components from interfering with each other. This isolation allows each component to independently manage its own state and rendering logic, improving the reusability and maintainability of data components.

[0095] In the above embodiment, each data component of the target interface is rendered independently in its own independent cache space, which can effectively improve the rendering efficiency.

[0096] In one embodiment, the target interface is a visualization interface of a large visualization screen, and the data components include at least one of a multidimensional data chart component, a single data component, and a special effect component. The multidimensional data chart component is used to display multidimensional data through a chart, the single data component is used to display single-dimensional data, and the special effect component is used to display data through special effects.

[0097] Specifically, the method of the present application can be applied to large-screen rendering scenarios. The target interface can be a visualization interface of a visualization large screen. A visualization large screen is a technical means for displaying various data, information, and images through a large-screen display device. Visualization large screens are usually used in control centers, monitoring rooms, conference rooms, exhibition centers, and other places to display key data indicators, real-time data, analysis results, monitoring information, and the like. The visualization interface of the visualization large screen displays business data through rich data components, which can help users quickly understand complex data and make more informed decisions.

[0098] The data components in the visualization interface of the visualization screen include at least one of a multidimensional data chart component, a single data component, and a special effect component. The multidimensional data chart component is used to display multidimensional data through charts. For example, the multidimensional data chart component can be a chart component such as a bar chart, a line chart, or a table. The single data component is used to display single-dimensional data. For example, the single data component can be a data component such as an indicator, a progress bar, or a dashboard. The indicator data component refers to a data component that directly displays indicator data. The special effect component is used to display data through special effects. For example, the special effect component can be a 3D globe that continuously rotates to display business data of each region. Users can customize the special effect component as needed.

[0099] In the above embodiments, the present application can improve the interface rendering efficiency of the visualization interface of the visualization screen. The visualization interface of the visualization screen includes data components of various types, and can display business data in a variety of ways.

[0100] In a specific embodiment, the present application can be applied to the interface rendering of a large-screen chart. Figure 4 , the user can enter the screen ID of the chart screen on the front end. The front end initiates the first query to the back end according to the screen ID. The back end returns the screen configuration information of the chart screen to the front end. The screen configuration information is JSON data and does not contain the business data dataset. The screen configuration information includes the skeleton configuration information. The front end can render the screen without business data (i.e., the basic skeleton for rendering the screen) according to the skeleton configuration information. The various chart areas in the screen show the loading effect of waiting for a circle. The screen configuration information includes the plug-in list (i.e., the plug-in ID list). The back end aggregates the business data of a business type into a data source, and obtains each business data under a business through a data source. The front end initiates the second query to the back end according to the plug-in list, and the back end returns the business data dataset to the front end. The front end can perform deduplication processing on the data request of each chart component according to the business according to the plug-in list. The data request of each chart component corresponding to the same plug-in ID is aggregated into one data request. The data request can be specifically an invoke request, which is a function call request initiated by the client to the server. The front end can cyclically trigger the invoke requests corresponding to each business and send the invoke requests to the back end. The back end can process each invoke request in parallel through multiple threads. The back end queries the plug-in ID corresponding to the invoke request, calls the plug-in corresponding to the plug-in ID to query the business data dataset required by the front end, assembles the query result dataset into a chart JSON data with a preset data structure, and returns the chart JSON data to the front end. The front end filters out the business data dataset required by each chart component under the same business from the data returned by the back end, converts the business data dataset from the preset data structure to the data structure required by the data component through the data converter, independently renders the chart component according to the converted business data dataset, and displays the chart component in the corresponding area on the large screen.

[0101] In this application, the request from the front end to the back end, the data returned by the back end, the data flow of the front end, and the data structure specification are optimized to reduce resource consumption, reduce the time users wait for page rendering, reduce development costs, and improve rendering performance. The front end uses a chain request, first requesting the large screen configuration information of the large screen, and then requesting the business data of the large screen. When the front end requests business data, it performs deduplication processing according to the business before making a request, which can reduce the number of redundant requests, reduce system resource consumption, and reduce the burden on the database. The back end retrieves data through an independent thread for each business, and returns business data to the front end independently, which can improve the rendering speed of the entire large screen. Each chart component in the large screen is rendered independently, without interfering with each other, and the entire large screen will not be unable to render and display due to a timeout or error in the data retrieval of a certain chart component. The front and back ends are decoupled, and the back end returns the business data of the preset data structure to the front end. The front end converts the data structure through a data converter, which can reduce the development cost of the front and back end docking.

[0102] In one embodiment, Figure 5 As shown, an interface rendering method is provided, which is applied to Figure 1 The server in the example is used to illustrate.

[0103] Step S502, in response to the interface display request for the target interface sent by the terminal, obtain the interface configuration information of the target interface; the interface configuration information includes skeleton configuration information and component configuration information set.

[0104] Step S504, returns the interface configuration information to the terminal, so that the terminal renders the interface skeleton of the target interface according to the skeleton configuration information, generates business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set, and deduplicates and aggregates each business data acquisition request according to the business identifier corresponding to the business data acquisition request to obtain the target business data acquisition request corresponding to each business identifier.

[0105] Specifically, when the target interface needs to be displayed, the terminal sends an interface display request for the target interface to the server. The server responds to the interface display request for the target interface sent by the terminal, obtains the interface configuration information of the target interface, and returns the interface configuration information of the target interface to the terminal. The interface configuration information includes skeleton configuration information and component configuration information set. After the terminal obtains the interface configuration information of the target interface, it can directly start rendering, and first render the interface skeleton of the target interface according to the skeleton configuration information. The component configuration information set of the target interface includes component configuration information corresponding to each data component in the target interface. The component configuration information includes the data source and data range of the data component. Therefore, the terminal can obtain the business data acquisition request corresponding to each data component of the target interface according to the component configuration information set. Each business data belonging to the same business identifier is usually stored in the same database or can be obtained through the same data acquisition method. The business identifier can be determined according to the data source. Therefore, the business data acquisition request has a corresponding business identifier. The terminal deduplicates and aggregates each business data acquisition request according to the business identifier to obtain the target business data acquisition request corresponding to each business identifier.

[0106] Step S506: Responding to each target service data acquisition request sent by the terminal, respectively acquire the corresponding target service data.

[0107] Step S508, returning the target business data to the terminal, so that the terminal determines the data rendering information corresponding to each data component corresponding to the same business identifier according to the component configuration information set and the target business data, and renders the corresponding data components in the interface skeleton according to each data rendering information.

[0108] Specifically, the terminal sends each target business data acquisition request to the server. The server responds to each target business data acquisition request, acquires the corresponding target business data, and returns the target business data to the terminal. Once the server acquires the target business data requested by a target business data acquisition request, it returns the target business data to the terminal, so that the terminal can start rendering data components in time to improve the interface rendering efficiency. Every time the terminal acquires the target business data corresponding to a target business data acquisition request, it promptly collects the component configuration information and target business data of each data component corresponding to the corresponding business identifier according to the component configuration information, determines the data rendering information corresponding to each data component corresponding to the business identifier, and renders the corresponding data components in the interface skeleton according to each data rendering information. Every time the terminal obtains the data rendering information corresponding to a data component, it can render the data component in the interface skeleton according to the data rendering information, so that the user can quickly see the data component on the interface.

[0109] In the above interface rendering method, when interface rendering is required, the terminal first requests the skeleton configuration information and component configuration information set of the target interface from the server, so that the terminal can first render the skeleton of the target interface according to the skeleton configuration information. The terminal then deduplicates the business data acquisition requests of the data components belonging to the same business identifier according to the component configuration information set and aggregates them into a target business data acquisition request, and requests the corresponding business data from the server according to the target business data acquisition request, thereby avoiding sending repeated business data acquisition requests to the server, which helps to improve data acquisition efficiency and thus improve interface rendering efficiency. The terminal distinguishes the data rendering information corresponding to each data component corresponding to the same business identifier according to the component configuration information set and the target business data, and then independently renders the corresponding data components in the interface skeleton according to each data rendering information, which helps to improve the interface rendering efficiency. The data components that have been rendered first can be displayed first to avoid users waiting too long. In this way, data is requested from the backend for rendering through chain requests, and the data obtained first is rendered first, which can effectively improve the interface rendering efficiency. In addition, the business data acquisition requests belonging to the data components of the same business identifier are deduplicated and aggregated into a target business data acquisition request, which can reduce the number of redundant requests, reduce resource waste, improve data processing efficiency, and thus improve interface rendering efficiency.

[0110] In one embodiment, in response to each target service data acquisition request sent by the terminal, the corresponding target service data is acquired respectively, including:

[0111] Processing each target business data acquisition request sent by the terminal in parallel through multi-threading;

[0112] For any target business data acquisition request, the initial business data is obtained from the database through the data interface corresponding to the business identifier corresponding to the target business data acquisition request, the initial business data is operated to obtain the target business data, the target business data is obtained from the data interface through the reflection mechanism, and the data structure of the target business data is converted into a preset data structure.

[0113] The data interface is an interface for acquiring and processing data. Each service identifier has its own corresponding data interface, that is, the service data of different services acquire and process data through different data interfaces.

[0114] The data interface obtains and processes data through some predefined functions and methods. The reflection mechanism is used to obtain the content in the data interface. The reflection mechanism can be used to obtain the processing results of the data interface and the relevant information of the member variables involved in the processing results.

[0115] The preset data structure refers to a preset data structure. For example, a two-dimensional array can be used as a preset data structure. The backend uniformly converts the data structure of each target business data into the preset data structure.

[0116] Specifically, the server processes each target service data acquisition request sent by the terminal in parallel through multiple threads, and acquires the target service data corresponding to each target service data acquisition request in parallel, and independently calls the data interface to retrieve data and perform operations in the thread to obtain the final target service data.

[0117] For any target business data acquisition request, the server calls the data interface corresponding to the business identifier corresponding to the target business data acquisition request in an independent thread to retrieve and calculate, and obtain the target business data. The server obtains the initial business data from the corresponding database through the data interface, calculates the initial business data, and obtains the target business data. For example, if the business data in the chart that the front end needs to display is obtained by performing logical operations on the business data in multiple reports stored in the back end, then the report data is obtained from the database through the data interface, and logical operations are performed on the report data to obtain the final business data. The data interface is equivalent to a class, and the content of the class can be obtained through the reflection mechanism. The present application specifically obtains the calculation results in the data interface through the reflection mechanism, and obtains the field name, field basic attributes, and other information used to describe the field of the data field corresponding to the calculation result. The server obtains the target business data from the data interface through the reflection mechanism, further converts the data structure of the target business data into a preset data structure, and returns the target business data of the preset data structure to the front end.

[0118] In the above embodiment, the content in the data interface can be quickly obtained through the reflection mechanism. No matter what type of business data required by the data component requested by the front end, the back end generates business data of a preset data structure, so that the back end is decoupled from the front end, and the back end does not need to care about the data structure required by the front end, which can effectively reduce the development cost of the back end.

[0119] In a specific embodiment, the present application can be applied to the large-screen display of charts in an ERP (Enterprise Resource Planning) system. A custom control is embedded in the ERP system, and the custom control is a program implemented by JSON code. The interface rendering of the large-screen chart is controlled by the front-end custom control. Figure 6, the user enters the large screen identifier on the front end to trigger the display of the large screen interface (i.e., the chart large screen) corresponding to the large screen identifier. The custom control first queries whether the large screen identifier exists. If it exists, it requests data from the back end. If it does not exist, it prompts the user that the large screen interface does not exist, and prompts the user to start drawing the large screen interface. The front end uses a chain request, first requesting the large screen configuration information of the large screen interface, and then requesting the business data required by the large screen interface. For the first request from the front end, the back end obtains the corresponding large screen configuration information from the data table that records the configuration information of multiple large screen interfaces according to the large screen identifier, and the back end can return the large screen configuration information to the front end. The large screen configuration information includes skeleton configuration information and component configuration information. It can be understood that the large screen interface usually contains multiple chart components, so the large screen configuration information includes the component configuration information of each of the multiple chart components. After the front end obtains the large screen configuration information, it renders the basic architecture of the chart large screen according to the skeleton configuration information, generates the business request (i.e., data acquisition request) corresponding to the chart component according to the component configuration information of the chart component, deduplicates and summarizes the business requests according to the business type, and then sends the request to the back end. The component configuration information of the data component includes the plug-in identifier of the data component. Different plug-in identifiers correspond to different business types, and deduplication and aggregation can be performed based on the plug-in identifier. For the business requests corresponding to each business, the backend independently retrieves data through multiple threads in parallel, and the thread that completes the retrieval first returns the data to the frontend first. The backend can retrieve data from the data table corresponding to the plug-in identifier by calling the plug-in corresponding to the plug-in identifier, encapsulate the plug-in identifier and the retrieval result into a map, where the key in the map is the plug-in identifier and the value is the dataset (i.e., the target business data), construct JSON data based on the plug-in identifier and the map, and return the JSON data to the frontend. The frontend reads the data configuration (i.e., component configuration information), reads the plug-in data (including the target business data) from the JSON data, and renders the chart component in the corresponding area of ​​the infrastructure of the chart screen based on the data configuration and the plug-in data. Each chart component in the chart screen is rendered independently on the frontend, and the chart component that is rendered first is displayed first.

[0120] In this way, deduplication and aggregation of business requests can effectively reduce the number of redundant requests, reduce system resource consumption, and reduce the burden on the database. Each chart in the large screen is rendered independently without interfering with each other. The entire large screen will not be unable to render and display due to a timeout or error in data acquisition of a certain chart. Compared with rendering the entire large screen based on a large data set, each chart is rendered independently through a small data set, which can greatly improve the rendering speed of the entire large screen and shorten the rendering time.

[0121] refer to Figure 7This chapter describes the data processing process from sending a data acquisition request from the front end to rendering the chart screen. The front end sends a data acquisition request to the back end based on the business unit. The back end acquires data according to the data acquisition method in the configuration corresponding to the business and obtains the data acquisition result. Different data acquisition methods can be set according to different needs for different businesses, for example, acquiring data through plug-ins, acquiring data through database condition query of library name / table name, acquiring data through Open API interface, and acquiring data by calling custom methods. Various data acquisition methods can be implemented by defining classes. The content of the class (including members, methods, and properties) can be obtained through the reflection mechanism to obtain the data acquisition result. The data acquisition result includes specific business data and field description information such as the field name and basic attributes of the field corresponding to the business data. The back end converts the data acquisition result into a dataset two-dimensional array through a preset method and returns the dataset two-dimensional array to the front end. The dataset two-dimensional array includes a Chinese attribute array and a two-dimensional table structure array. The Chinese attribute array includes field description information, and the two-dimensional table structure array includes specific business data. The front end determines the data rendering information of each chart component according to the data returned by the back end through data converters and data filters. The front end renders the chart components in the chart screen independently according to each data rendering information. The front end opens up an independent DOM cache space for each chart component, writes the data rendering information corresponding to the chart component into the DOM cache space, and renders the chart component independently in the DOM cache space. It can be understood that the chart components in the chart screen are divided into various components such as multi-dimensional data chart components (such as bar charts, line charts, tables, etc.), single data components (such as indicators, progress bars, dashboards, etc.), and customized special effects components.

[0122] refer to Figure 8, taking the chart component corresponding to business A in the chart screen as an example, including chart component 1 for displaying chart 1 and chart component 2 for displaying chart 2, the data processing process from sending a business request to rendering a chart is explained. The front end sends a business request to the back end in units of business, and the back end executes the business request, fetching data and performing calculations through independent threads. The back end can fetch data and perform calculations through the API interface corresponding to the business, obtain the content in the interface through the reflection mechanism, and obtain the target business data. The target business data includes the business data required for charts 1 and 2 of business A. Then, the back end converts the target business data into a dataset two-dimensional array through a pre-set dataset two-dimensional array construction method, and returns the dataset two-dimensional array to the front end. The front end obtains the business data required for chart 1 from the dataset two-dimensional array according to the component configuration information of chart component 1 through a data filter, and converts the data structure of the business data into the data structure required for chart 1 through a data converter according to the component configuration information of chart component 1, thereby obtaining all the content required for rendering chart 1 of business A. The component configuration information includes information such as chart type, chart id, and chart configuration. Similarly, the front end can obtain all the content required for rendering chart 2 of business A through data filters and data converters. The front end independently renders Chart 1 of Business A and Chart 2 of Business A based on the content required for rendering.

[0123] In this way, the backend obtains the business data obtained through calculations based on the reflection mechanism, and reconstructs it into a two-dimensional array of dataset. The frontend designs data filters and data converters, encapsulates the conversion logic of the data structure required for commonly used charts into a general method and stores it in the data converter, so that the chart configuration itself (that is, component configuration information) plus the two-dimensional array dataset can be directly used for chart rendering. In this way, the frontend and backend do not need to care about how the other party processes data, and the frontend and backend are decoupled. There is no need for the frontend or backend to perform a large number of conditional judgments or logic rewrites for each chart component, which reduces the development cost required for the frontend and backend docking.

[0124] This application method uses front-end chain requests and back-end multi-threaded independent processing. Back-end dataset two-dimensional array, front-end data filters and data converters, and front-end chart components are independently rendered. The chart screen is requested from the front-end to the back-end, and then the data flow and data structure specifications are optimized from the back-end to the back-end, so as to reduce resource consumption, reduce the time users wait for page rendering, reduce development costs, and improve rendering performance.

[0125] It should be understood that, although the various steps in the flowcharts involved in the above-mentioned embodiments are displayed in sequence according to the indication of the arrows, these steps are not necessarily executed in sequence according to the order indicated by the arrows. Unless there is a clear explanation in this article, the execution of these steps does not have a strict order restriction, and these steps can be executed in other orders. Moreover, at least a part of the steps in the flowcharts involved in the above-mentioned embodiments can include multiple steps or multiple stages, and these steps or stages are not necessarily executed at the same time, but can be executed at different times, and the execution order of these steps or stages is not necessarily to be carried out in sequence, but can be executed in turn or alternately with other steps or at least a part of the steps or stages in other steps.

[0126] Based on the same inventive concept, the embodiment of the present application also provides an interface rendering device for implementing the interface rendering method involved above. The implementation solution provided by the device to solve the problem is similar to the implementation solution recorded in the above method, so the specific limitations in one or more interface rendering device embodiments provided below can refer to the limitations of the interface rendering method above, and will not be repeated here.

[0127] In one embodiment, Fig. 9 As shown, an interface rendering device is provided, including: a first request sending module 902, a first interface rendering module 904, a request deduplication module 906, a second request sending module 908, a data analysis module 910 and a second interface rendering module 912, wherein:

[0128] The first request sending module 902 is used to send an interface display request for a target interface to the server, so that the server returns interface configuration information of the target interface according to the interface display request; the interface configuration information includes skeleton configuration information and component configuration information set.

[0129] The first interface rendering module 904 is used to render the interface skeleton of the target interface according to the skeleton configuration information.

[0130] The request deduplication module 906 is used to generate business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set, deduplicate and aggregate each business data acquisition request according to the business identifier to obtain the target business data acquisition request corresponding to each business identifier.

[0131] The second request sending module 908 is used to send the target service data acquisition request corresponding to each service identifier to the server, so that the server returns the corresponding target service data according to each target service data acquisition request.

[0132] The data analysis module 910 is used to determine the data rendering information corresponding to each data component corresponding to the same business identifier according to the component configuration information set and the target business data.

[0133] The second interface rendering module 912 is used to render corresponding data components in the interface skeleton according to various data rendering information.

[0134] In one embodiment, the component configuration information set includes a plug-in identification list, and the plug-in identification list includes plug-in identifications corresponding to each data component of the target interface. The request deduplication module 906 is also used to:

[0135] Generate business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set; the business data acquisition request carries the corresponding plug-in identifier;

[0136] Use different plug-in IDs as different business IDs;

[0137] The business data acquisition requests corresponding to the same business identifier are merged to obtain target business data acquisition requests corresponding to the business identifiers.

[0138] In one embodiment, the component configuration information set includes component configuration information corresponding to each data component of the target interface. The data analysis module 910 is also used to:

[0139] Through the data filter, the target business data is filtered according to the configuration information of each component corresponding to the business identifier corresponding to the target business data, and the business data corresponding to each data component corresponding to the same business identifier is obtained;

[0140] Converting the data structure of the business data corresponding to the data component into the data structure indicated by the component configuration information corresponding to the data component through the data converter;

[0141] Based on the converted business data, the data rendering information corresponding to the data component is obtained.

[0142] In one embodiment, the second interface rendering module 912 is further used to:

[0143] For the data rendering information corresponding to any data component, the data rendering information corresponding to the data component is written into the independent cache space corresponding to the data component. In the independent cache space corresponding to the data component, the data component is rendered and displayed in the interface skeleton according to the data rendering information corresponding to the data component.

[0144] In one embodiment, the target interface is a visualization interface of a large visualization screen, and the data components include at least one of a multidimensional data chart component, a single data component, and a special effect component. The multidimensional data chart component is used to display multidimensional data through a chart, the single data component is used to display single-dimensional data, and the special effect component is used to display data through special effects.

[0145] In one embodiment, Fig.10 As shown, an interface rendering device is provided, including: a first request processing module 1002, a first data returning module 1004, a second request processing module 1006 and a second data returning module 1008, wherein:

[0146] The first request processing module 1002 is used to respond to an interface display request for a target interface sent by a terminal, and obtain interface configuration information of the target interface; the interface configuration information includes skeleton configuration information and component configuration information set.

[0147] The first data return module 1004 is used to return interface configuration information to the terminal so that the terminal renders the interface skeleton of the target interface according to the skeleton configuration information, generates business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set, and deduplicates and aggregates each business data acquisition request according to the business identifier corresponding to the business data acquisition request to obtain the target business data acquisition request corresponding to each business identifier.

[0148] The second request processing module 1006 is used to respond to each target service data acquisition request sent by the terminal and acquire the corresponding target service data respectively.

[0149] The second data return module 1008 is used to return the target business data to the terminal, so that the terminal can determine the data rendering information corresponding to each data component corresponding to the same business identifier according to the component configuration information set and the target business data, and render the corresponding data components in the interface skeleton according to each data rendering information.

[0150] In one embodiment, the second request processing module 1006 is further configured to:

[0151] Processing each target business data acquisition request sent by the terminal in parallel through multi-threading;

[0152] For any target business data acquisition request, the initial business data is obtained from the database through the data interface corresponding to the business identifier corresponding to the target business data acquisition request, the initial business data is operated to obtain the target business data, the target business data is obtained from the data interface through the reflection mechanism, and the data structure of the target business data is converted into a preset data structure.

[0153] The above interface rendering device can improve the interface rendering efficiency.

[0154] Each module in the above interface rendering device can be implemented in whole or in part by software, hardware, or a combination thereof. Each module can be embedded in or independent of a processor in a computer device in the form of hardware, or can be stored in a memory in a computer device in the form of software, so that the processor can call and execute operations corresponding to each module.

[0155] In one embodiment, a computer device is provided. The computer device may be a server, and its internal structure diagram may be as follows: Fig.11 As shown. The computer device includes a processor, a memory, an input / output interface (Input / Output, referred to as I / O) and a communication interface. Among them, the processor, the memory and the input / output interface are connected through a system bus, and the communication interface is connected to the system bus through the input / output interface. Among them, the processor of the computer device is used to provide computing and control capabilities. The memory of the computer device includes a non-volatile storage medium and an internal memory. The non-volatile storage medium stores an operating system, a computer program and a database. The internal memory provides an environment for the operation of the operating system and the computer program in the non-volatile storage medium. The database of the computer device is used to store data related to the interface rendering method. The input / output interface of the computer device is used to exchange information between the processor and an external device. The communication interface of the computer device is used to communicate with an external terminal through a network connection. When the computer program is executed by the processor, an interface rendering method is implemented.

[0156] In one embodiment, a computer device is provided. The computer device may be a terminal, and its internal structure diagram may be as follows: Fig.12As shown. The computer device includes a processor, a memory, an input / output interface, a communication interface, a display unit and an input device. The processor, the memory and the input / output interface are connected through a system bus, and the communication interface, the display unit and the input device are connected to the system bus through the input / output interface. The processor of the computer device is used to provide computing and control capabilities. The memory of the computer device includes a non-volatile storage medium and an internal memory. The non-volatile storage medium stores an operating system and a computer program. The internal memory provides an environment for the operation of the operating system and the computer program in the non-volatile storage medium. The input / output interface of the computer device is used to exchange information between the processor and the external device. The communication interface of the computer device is used to communicate with an external terminal in a wired or wireless manner, and the wireless manner can be realized through WIFI, a mobile cellular network, NFC (near field communication) or other technologies. When the computer program is executed by the processor, an interface rendering method is realized. The display unit of the computer device is used to form a visually visible picture, which can be a display screen, a projection device or a virtual reality imaging device. The display screen can be a liquid crystal display screen or an electronic ink display screen, and the input device of the computer device can be a touch layer covering the display screen, or a button, trackball or touchpad set on the computer device shell, or an external keyboard, touchpad or mouse.

[0157] Those skilled in the art will understand that Fig.11 , Fig.12 The structure shown in the figure 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 computer device to which the solution of the present application is applied. The specific computer device may include more or fewer components than those shown in the figure, or combine certain components, or have a different arrangement of components.

[0158] In one embodiment, a computer device is further provided, including a memory and a processor, wherein a computer program is stored in the memory, and the processor implements the steps in the above method embodiments when executing the computer program.

[0159] In one embodiment, a computer-readable storage medium is provided, storing a computer program, which implements the steps in the above method embodiments when executed by a processor.

[0160] In one embodiment, a computer program product is provided. The computer program product includes a computer program. When the computer program is executed by a processor, the steps in the above method embodiments are implemented.

[0161] It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for analysis, stored data, displayed data, etc.) involved in this application are all information and data authorized by the user or fully authorized by all parties, and the collection, use and processing of relevant data must comply with relevant regulations.

[0162] Those skilled in the art can understand that all or part of the processes in the above-mentioned embodiment methods can be completed by instructing the relevant hardware through a computer program, and the computer program can be stored in a non-volatile computer-readable storage medium. When the computer program is executed, it can include the processes of the embodiments of the above-mentioned methods. Among them, any reference to the memory, database or other medium used in the embodiments provided in this application can include at least one of non-volatile and volatile memory. Non-volatile memory can include read-only memory (ROM), magnetic tape, floppy disk, flash memory, optical memory, high-density embedded non-volatile memory, resistive random access memory (ReRAM), magnetoresistive random access memory (MRAM), ferroelectric random access memory (FRAM), phase change memory (PCM), graphene memory, etc. Volatile memory can include random access memory (RAM) or external cache memory, etc. As an illustration and not limitation, RAM can be in various forms, such as static random access memory (SRAM) or dynamic random access memory (DRAM). The database involved in each embodiment provided in this application may include at least one of a relational database and a non-relational database. Non-relational databases may include distributed databases based on blockchains, etc., but are not limited to this. The processor involved in each embodiment provided in this application may be a general-purpose processor, a central processing unit, a graphics processor, a digital signal processor, a programmable logic device, a data processing logic device based on quantum computing, etc., but are not limited to this.

[0163] The technical features of the above embodiments may be combined arbitrarily. To make the description concise, not all possible combinations of the technical features in the above embodiments are described. However, as long as there is no contradiction in the combination of these technical features, they should be considered to be within the scope of this specification.

[0164] The above-described embodiments only express several implementation methods of the present application, and the descriptions thereof are relatively specific and detailed, but they cannot be understood as limiting the scope of the present application. It should be pointed out that, for a person of ordinary skill in the art, several variations and improvements can be made without departing from the concept of the present application, and these all belong to the protection scope of the present application. Therefore, the protection scope of the present application shall be subject to the attached claims.

Claims

1. An interface rendering method, characterized in that: The method comprises: Sending an interface display request for a target interface to a server, so that the server returns interface configuration information of the target interface according to the interface display request; the interface configuration information includes skeleton configuration information and component configuration information set; Rendering an interface skeleton of the target interface according to the skeleton configuration information; Generate business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set, and deduplicate and aggregate each business data acquisition request according to the business identifier to obtain target business data acquisition requests corresponding to each business identifier; Sending target service data acquisition requests corresponding to the respective service identifiers to the server, so that the server returns the corresponding target service data according to the respective target service data acquisition requests; Determine, according to the component configuration information set and the target business data, data rendering information corresponding to each data component corresponding to the same business identifier; According to each data rendering information, corresponding data components are rendered in the interface skeleton respectively.

2. The method according to claim 1, characterized in that The component configuration information set includes a plug-in identification list, and the plug-in identification list includes plug-in identifications corresponding to each data component of the target interface; The generating of the business data acquisition requests corresponding to the respective data components of the target interface according to the component configuration information set, deduplicating and aggregating the respective business data acquisition requests according to the business identifiers, and obtaining the target business data acquisition requests corresponding to the respective business identifiers, comprises: Generate business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set; the business data acquisition request carries a corresponding plug-in identifier; Use different plug-in IDs as different business IDs; The business data acquisition requests corresponding to the same business identifier are merged to obtain target business data acquisition requests corresponding to the business identifiers.

3. The method according to claim 1, characterized in that The component configuration information set includes component configuration information corresponding to each data component of the target interface; The determining, according to the component configuration information set and the target business data, data rendering information corresponding to each data component corresponding to the same business identifier includes: The target business data is filtered through a data filter according to the configuration information of each component corresponding to the business identifier corresponding to the target business data, so as to obtain the business data corresponding to each data component corresponding to the same business identifier; Converting the data structure of the business data corresponding to the data component into the data structure indicated by the component configuration information corresponding to the data component through the data converter; Based on the converted business data, the data rendering information corresponding to the data component is obtained.

4. The method according to claim 1, characterized in that The step of rendering corresponding data components in the interface skeleton according to the data rendering information includes: For data rendering information corresponding to any data component, the data rendering information corresponding to the data component is written into an independent cache space corresponding to the data component. In the independent cache space corresponding to the data component, the data component is rendered and displayed in the interface skeleton according to the data rendering information corresponding to the data component.

5. The method according to any one of claims 1 to 4, characterized in that The target interface is a visualization interface of a large visualization screen, and the data component includes at least one of a multidimensional data chart component, a single data component, and a special effect component. The multidimensional data chart component is used to display multidimensional data through a chart, the single data component is used to display single-dimensional data, and the special effect component is used to display data through special effects.

6. An interface rendering method, characterized in that: The method comprises: In response to an interface display request for a target interface sent by a terminal, acquiring interface configuration information of the target interface; the interface configuration information includes skeleton configuration information and component configuration information set; Returning the interface configuration information to the terminal, so that the terminal renders the interface skeleton of the target interface according to the skeleton configuration information, generating business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set, and deduplicating and aggregating each business data acquisition request according to the business identifier corresponding to the business data acquisition request to obtain the target business data acquisition request corresponding to each business identifier; Responding to each target service data acquisition request sent by the terminal, respectively acquiring the corresponding target service data; The target business data is returned to the terminal so that the terminal determines the data rendering information corresponding to each data component corresponding to the same business identifier according to the component configuration information set and the target business data, and renders the corresponding data components in the interface skeleton according to each data rendering information.

7. The method according to claim 6, characterized in that The step of respectively acquiring the corresponding target service data in response to each target service data acquisition request sent by the terminal includes: Processing each target business data acquisition request sent by the terminal in parallel through multi-threading; For any target business data acquisition request, the initial business data is obtained from the database through the data interface corresponding to the business identifier corresponding to the target business data acquisition request, the initial business data is operated to obtain the target business data, the target business data is obtained from the data interface through the reflection mechanism, and the data structure of the target business data is converted into a preset data structure.

8. An interface rendering device, characterized in that: The device comprises: A first request sending module is used to send an interface display request for a target interface to a server, so that the server returns interface configuration information of the target interface according to the interface display request; the interface configuration information includes skeleton configuration information and component configuration information set; A first interface rendering module, used for rendering an interface skeleton of the target interface according to the skeleton configuration information; A request deduplication module is used to generate business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set, and to deduplicate and aggregate each business data acquisition request according to the business identifier to obtain the target business data acquisition request corresponding to each business identifier; A second request sending module, used for sending the target service data acquisition requests corresponding to the respective service identifiers to the server, so that the server returns the corresponding target service data according to the respective target service data acquisition requests; A data analysis module, used to determine data rendering information corresponding to each data component corresponding to the same business identifier according to the component configuration information set and the target business data; The second interface rendering module is used to render corresponding data components in the interface skeleton according to various data rendering information.

9. An interface rendering device, characterized in that: The device comprises: A first request processing module, configured to obtain interface configuration information of a target interface in response to an interface display request sent by a terminal; the interface configuration information includes skeleton configuration information and component configuration information set; A first data return module is used to return the interface configuration information to the terminal, so that the terminal renders the interface skeleton of the target interface according to the skeleton configuration information, generates business data acquisition requests corresponding to each data component of the target interface according to the component configuration information set, and deduplicates and aggregates each business data acquisition request according to the business identifier corresponding to the business data acquisition request to obtain the target business data acquisition request corresponding to each business identifier; A second request processing module, configured to respectively obtain corresponding target service data in response to each target service data acquisition request sent by the terminal; The second data return module is used to return the target business data to the terminal, so that the terminal can determine the data rendering information corresponding to each data component corresponding to the same business identifier according to the component configuration information set and the target business data, and render the corresponding data components in the interface skeleton according to each data rendering information.

10. A computer device comprising a memory and a processor, wherein the memory stores a computer program, characterized in that: When the processor executes the computer program, the steps of the method according to any one of claims 1 to 7 are implemented.

11. A computer-readable storage medium having a computer program stored thereon, characterized in that: When the computer program is executed by a processor, the steps of the method according to any one of claims 1 to 7 are implemented.

12. A computer program product, comprising a computer program, characterized in that When the computer program is executed by a processor, the steps of the method according to any one of claims 1 to 7 are implemented.

Images