CN112558933A

CN112558933A - Component rendering method and device, readable medium and electronic equipment

Info

Publication number: CN112558933A
Application number: CN202011448989.4A
Authority: CN
Inventors: 李岳鹏; 凌艺宾
Original assignee: Beijing ByteDance Network Technology Co Ltd
Current assignee: Beijing ByteDance Network Technology Co Ltd
Priority date: 2020-12-09
Filing date: 2020-12-09
Publication date: 2021-03-26

Abstract

The disclosure relates to a component rendering method, a device, a readable medium and an electronic device. The method comprises the following steps: responding to a component of a second application existing in a current page, and sending a component configuration file acquisition request to a component management platform, wherein the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components; receiving the component configuration file sent by the component management platform, and determining a target component to be rendered of the second application in the current page according to the component configuration information; and acquiring the target component to be rendered from the component management platform, and rendering the target component to be rendered in the current page. By the technical scheme, the loading speed of the components can be increased, and the integral rendering efficiency of the page can be improved. In addition, effective multiplexing of the components can be realized, and the component development efficiency is improved.

Description

Component rendering method and device, readable medium and electronic equipment

Technical Field

The present disclosure relates to the field of computer technologies, and in particular, to a component rendering method, an apparatus, a readable medium, and an electronic device.

Background

At present, the front-end page usually adopts a componentization concept when being developed, the page can be regarded as a container of components, and each page can be composed of one or more components. The components as a single entity may be applied in different pages.

Rendering the components may refer to the process of converting data objects into visualization objects. In the related art, when component rendering is performed, the component loading speed is slow, so that the rendering efficiency of the whole page is affected. Moreover, each component may be developed by different developers, and how to effectively integrate the components and achieve independent development and dynamic combination of the components is an important problem in the field of front-end development.

Disclosure of Invention

This summary is provided to introduce a selection of concepts in a simplified form that are further described below in the detailed description. This summary is not intended to identify key features or essential features of the claimed subject matter, nor is it intended to be used to limit the scope of the claimed subject matter.

In a first aspect, the present disclosure provides a component rendering method, the method comprising: responding to a component of a second application existing in a current page, and sending a component configuration file acquisition request to a component management platform, wherein the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components; receiving the component configuration file sent by the component management platform, and determining a target component to be rendered of the second application in the current page according to the component configuration information; and acquiring the target component to be rendered from the component management platform, and rendering the target component to be rendered in the current page.

In a second aspect, the present disclosure provides a component rendering method, the method comprising: a receiving terminal responds to a component configuration file acquisition request sent by a component with a second application in a current page, wherein the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components; sending the component configuration file to the terminal, so that the terminal determines the target component to be rendered of the second application in the current page according to the component configuration information after receiving the component configuration file, and renders the target component to be rendered in the current page after acquiring the target component to be rendered.

In a third aspect, the present disclosure provides an apparatus for component rendering, the apparatus comprising: a first sending module, configured to send a component configuration file acquisition request to a component management platform in response to a component of a second application existing in a current page, where the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components; a first determining module, configured to receive the component configuration file sent by the component management platform, and determine, according to the component configuration information, a target component to be rendered of the second application in the current page; a rendering module configured to obtain the target component to be rendered from the component management platform and render the target component to be rendered in the current page.

In a fourth aspect, the present disclosure provides an apparatus for component rendering, the apparatus comprising: the terminal comprises a receiving module, a sending module and a receiving module, wherein the receiving module is used for receiving a component configuration file acquisition request sent by the terminal in response to a component of a second application in a current page, the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components; a second sending module, configured to send the component configuration file to the terminal, so that the terminal determines, according to the component configuration information, a target component to be rendered of the second application in the current page after receiving the component configuration file, and renders the target component to be rendered in the current page after obtaining the target component to be rendered.

In a fifth aspect, the present disclosure provides a computer readable medium having stored thereon a computer program which, when executed by a processing apparatus, performs the steps of the method provided by the first aspect of the present disclosure.

In a sixth aspect, the present disclosure provides a computer readable medium having stored thereon a computer program which, when executed by a processing apparatus, performs the steps of the method provided by the second aspect of the present disclosure.

In a seventh aspect, the present disclosure provides an electronic device, comprising: a storage device having a computer program stored thereon; processing means for executing the computer program in the storage means to implement the steps of the method provided by the first aspect of the present disclosure.

In an eighth aspect, the present disclosure provides an electronic device comprising: a storage device having a computer program stored thereon; processing means for executing the computer program in the storage means to implement the steps of the method provided by the second aspect of the present disclosure.

According to the technical scheme, the terminal can respond to the component of the second application in the current page, and sends the component configuration file acquisition request to the component management platform, the second application is different from the first application corresponding to the current page, the component configuration file can be constructed according to the component configuration information of the components, compared with the components published to the component management platform, the space occupied by the component configuration file is relatively small, the target component to be rendered of the second application is determined based on the component configuration file, a large number of components in the component management platform can be not required to be loaded to the local terminal, but only the determined target component to be rendered in the current page is required to be loaded, and the component can be loaded as required. Because the number of the loaded components is greatly reduced, the influence of irrelevant components on the loading speed can be reduced, the component loading speed can be increased, the overall rendering efficiency of the page is improved, and the experience of a user for browsing the page is improved. Moreover, the component developers can release the components to the component management platform after completing the development work of the components, the developers of different components are not influenced mutually, and the independent development of the components can be realized. By publishing the components to the component management platform, each application can acquire the components of other applications to be loaded from the component management platform, so that the multiplexing of the components can be effectively realized, the development efficiency is improved, and the coupling dependence between the components of different applications is reduced. Therefore, by means of the scheme, the loading speed of the components can be increased, the overall rendering efficiency of the page can be improved, effective multiplexing of the components can be achieved, and the component development efficiency is improved.

Additional features and advantages of the disclosure will be set forth in the detailed description which follows.

Drawings

The above and other features, advantages and aspects of various embodiments of the present disclosure will become more apparent by referring to the following detailed description when taken in conjunction with the accompanying drawings. Throughout the drawings, the same or similar reference numbers refer to the same or similar elements. It should be understood that the drawings are schematic and that elements and features are not necessarily drawn to scale. In the drawings:

FIG. 1 is a schematic diagram illustrating one implementation environment in accordance with an example embodiment.

FIG. 2 is a flow diagram illustrating a component rendering method in accordance with an exemplary embodiment.

FIG. 3 is a flowchart illustrating a component rendering method according to another exemplary embodiment.

FIG. 4 is a flow diagram illustrating a component rendering method in accordance with an exemplary embodiment.

FIG. 5 is a flowchart illustrating interaction between a user terminal and a component management platform in a component rendering method according to an example embodiment.

FIG. 6 is a block diagram illustrating a component rendering apparatus according to an example embodiment.

Fig. 7 is a block diagram illustrating a component rendering apparatus according to another exemplary embodiment.

FIG. 8 is a schematic diagram illustrating an electronic device in accordance with an exemplary embodiment.

Detailed Description

Embodiments of the present disclosure will be described in more detail below with reference to the accompanying drawings. While certain embodiments of the present disclosure are shown in the drawings, it is to be understood that the present disclosure may be embodied in various forms and should not be construed as limited to the embodiments set forth herein, but rather are provided for a more thorough and complete understanding of the present disclosure. It should be understood that the drawings and embodiments of the disclosure are for illustration purposes only and are not intended to limit the scope of the disclosure.

It should be understood that the various steps recited in the method embodiments of the present disclosure may be performed in a different order, and/or performed in parallel. Moreover, method embodiments may include additional steps and/or omit performing the illustrated steps. The scope of the present disclosure is not limited in this respect.

The term "include" and variations thereof as used herein are open-ended, i.e., "including but not limited to". The term "based on" is "based, at least in part, on". The term "one embodiment" means "at least one embodiment"; the term "another embodiment" means "at least one additional embodiment"; the term "some embodiments" means "at least some embodiments". Relevant definitions for other terms will be given in the following description.

It should be noted that the terms "first", "second", and the like in the present disclosure are only used for distinguishing different devices, modules or units, and are not used for limiting the order or interdependence relationship of the functions performed by the devices, modules or units.

It is noted that references to "a", "an", and "the" modifications in this disclosure are intended to be illustrative rather than limiting, and that those skilled in the art will recognize that "one or more" may be used unless the context clearly dictates otherwise.

The names of messages or information exchanged between devices in the embodiments of the present disclosure are for illustrative purposes only, and are not intended to limit the scope of the messages or information.

An application scenario of the present disclosure is first introduced. FIG. 1 is a schematic diagram illustrating one implementation environment in accordance with an example embodiment. As shown in fig. 1, the implementation environment may include a user terminal 101, a component management platform 102, a component developer terminal 103. Various applications may be installed in the user terminal 101, and a user may browse a page of the application through the user terminal 101. After the component developer completes the component development work, the component developer may publish the component to the component management platform 102 through the component developer terminal 103. The user terminal 101 and the component developer terminal 103 may be terminal devices such as a mobile phone, a tablet computer, and a personal computer, and fig. 1 illustrates the user terminal 101 as a mobile phone and the component developer terminal 103 as a personal computer. The component management platform 102 may be a component management server, a cloud server, and the like. The user terminal 101 and the component developer terminal 103 are both communicatively coupled to the component management platform 102, and may communicate in any manner, such as 3G, 4G, 5G, NB-IOT, eMTC, LTE-a, near field communication, wired communication, and so on.

Fig. 2 is a flow diagram illustrating a component rendering method that may be applied to a terminal, such as the user terminal 101 shown in fig. 1, according to an example embodiment. As shown in fig. 2, the method may include S201 to S203.

In S201, in response to the component of the second application existing in the current page, a component configuration file acquisition request is sent to the component management platform.

And the second application is different from the first application corresponding to the current page. At present, more and more applications are installed in a terminal used by a user, and certain relevance exists between the applications, and other components of one or more applications may be integrated in a page of the application. For example, the first application corresponding to the current page is application a, and in addition to the components of application a, components of second applications such as application B and application C may be integrated into the current page.

In response to the presence of the component of the second application in the current page, the user terminal 101 may send a component profile obtaining request to the component management platform 102, the component profile obtaining request requesting to obtain a component profile to determine which components of the second application need to be rendered through the component profile.

The component configuration file may be constructed according to component configuration information of a plurality of components, and in the present disclosure, the component configuration information may be determined by the component management platform 102 according to component codes of the components issued to the component management platform 102.

After determining the component configuration information of the component, the component management platform 102 may form the component configuration information of the plurality of components into a file, i.e., the component configuration file described above. The present disclosure is not particularly limited with respect to the number of component configuration information included in the component configuration file. Moreover, as the component developer continuously publishes the component to the component management platform 102, the component configuration file may be dynamically updated, that is, when a new component is published to the component management platform 102, the component management platform 102 may analyze and determine the component configuration information of the new component and add the component configuration information to the component configuration file.

In S202, the component configuration file sent by the component management platform is received, and the target component to be rendered of the second application in the current page is determined according to the component configuration information.

After receiving the component configuration file acquisition request sent by the user terminal 101, the component management platform 102 may send the component configuration file to the user terminal 101, and the user terminal 101 may receive the component configuration file.

After receiving the component configuration file sent by the component management platform 102, the user terminal 101 may determine a target component to be rendered of the second application in the current page according to the component configuration information included in the component configuration file, that is, determine which components of the second application need to be rendered according to the received component configuration file. In an optional embodiment, the application a corresponding to the current page may provide an analysis module, and the analysis module may analyze the page structure of the current page when the application a runs, and determine a target component to be rendered of the second application suitable for the current page according to the page structure. The number of target components to be rendered is not particularly limited in the present disclosure, and may be one or more.

In S203, the target component to be rendered is acquired from the component management platform, and the target component to be rendered is rendered in the current page.

After determining the target component to be rendered for the second application, the user terminal 101 may obtain the target component to be rendered from the component management platform 102. Thus, in the present disclosure, the user terminal 101 may determine the target component to be rendered suitable for the current page according to the component configuration file, and only load the target component to be rendered, without loading a large number of components published to the component management platform 102, so as to implement the on-demand loading of the components.

Moreover, for component developers, independent development of components can be realized, and after the development work of the components is completed, the components are issued to the component management platform 102, so that developers of different components are not influenced mutually. By publishing the components to the component management platform 102, each application can acquire the components of other applications to be loaded from the component management platform 102, so that the reuse of the components can be effectively realized, and the development efficiency is improved.

Optionally, before sending the component configuration file acquisition request to the component management platform in response to the component of the second application existing in the current page in S201, the component rendering method applied to the terminal provided by the present disclosure may further include:

under the condition that the rendering of the component of the first application in the current page is completed, if the component to be rendered exists in the current page, the component of the second application exists in the current page.

In general, in order to improve the browsing experience of a user, the front-end page aims to have short first-screen time, the first-screen time is time consumed for displaying a first-screen page, and the total rendering time of one page is longer than the first-screen time. For the case that a component of a second application is integrated in a current page, in order to shorten the first screen time, a component of a first application corresponding to the current page is usually rendered first, and after the rendering of the component of the first application is completed, the component of the second application is loaded.

For example, the current page browsed by the user is a page of an application a, the user terminal 101 may obtain a component of the application a from a server corresponding to the application a, and after rendering of the component of the application a is completed, if the current page is not completely rendered, a component of a second application may exist in the current page. It is to be noted that the number of the second applications and the number of the components to be rendered are not particularly limited by the present disclosure, and may be one or more.

In the present disclosure, the component configuration file may be constructed by the component management platform 102 according to the component configuration information of a plurality of components, and the component management platform 102 may construct the component configuration file by:

in response to receiving a component issued to a component management platform, analyzing a component code of the received component to obtain component configuration information of the component; and constructing the component configuration information of the plurality of components into a component configuration file.

After the component development work is completed, component developers of each application can issue components to the component management platform 102 through the component developer terminal 103, and the component management platform 102 can be used to store the components and analyze component codes of the components, for example, the component codes can be analyzed in an AST (Abstract Syntax Tree) mode, so as to analyze component configuration information of the components. The component code may be JavaScript, CSS (Cascading Style Sheets) code for the component. For example, the component configuration information of the component may include a component package identification (packageId), a component package name (packageName), a component package version (version), a component package download address (URL, Uniform Resource Locator), a version grayscale policy of the component, a version status of the component (status), component Type information (Type), rendering location information of the component (selector), and the like. The component management platform 102 may construct component configuration information for a plurality of components as a component configuration file.

In one embodiment, the component management platform 102 may construct the component configuration information of the component whose version state is the visible state or the grayscale state as a component configuration file, i.e., the component configuration file may include the component configuration information of the component whose version state is the visible state or the grayscale state, which is published to the component management platform 102.

The version state of the component can be defined by a component developer when the component is developed, and can be a visible state, a gray state or an invisible state. The module is in a visible state, namely all user terminals can load the module, in an invisible state, namely the user terminals cannot load the module, in a gray state, namely part of the user terminals can load the module, the part of the user terminals can be calibrated in advance, and the module in the gray state can be a module in a new version, so that part of users can use the module firstly, and the problem that the new version is unstable to influence the use of a large number of users can be avoided.

In another embodiment, the component management platform 102 may construct the component configuration information of the component of which the version status is the visible status or the grayscale status and which the first application subscribes to in advance as the component configuration file, that is, the component configuration file may include the component configuration information of the component of which the version status published to the component management platform 102 is the visible status or the grayscale status and which the first application subscribes to in advance and which the current page corresponds to.

In this embodiment, each application may subscribe to a required component in advance according to its own requirement, and the component management platform 102 may generate a component configuration file corresponding to each application for a component subscribed in advance by a different application. Illustratively, for example, the component management platform 102 stores therein the component configuration information of 1000 components, and the application a subscribes to 200 components in advance, then the component configuration file corresponding to the application a may include the component configuration information of the 200 components to which the application a subscribes in advance. For example, application B subscribes to 300 components in advance, the component configuration file corresponding to application B may include the component configuration information of the 300 components to which it subscribes in advance. It should be noted that the above numerical values are merely examples and do not limit the embodiments of the present disclosure.

Therefore, each application can subscribe the components required by the application in advance, the acquired component configuration file does not comprise all the component configuration information of the components in a visible state or a gray state, but the component configuration information of the components meeting the requirements of the application, and when the target component to be rendered is determined according to the component configuration file, the efficiency can be improved, and the influence of irrelevant components is reduced.

Fig. 3 is a flowchart illustrating a component rendering method according to another exemplary embodiment, which may be applied to a terminal, and as shown in fig. 3, the method may include S301 to S308, where determining a target component to be rendered of a second application in a current page according to component configuration information in S202 may include S303 to S305, and S203 may include S306 to S308.

In S301(201), in response to a component of the second application existing in the current page, a component configuration file acquisition request is sent to the component management platform.

The specific implementation manner of S301 is the same as that mentioned in S201, and is not described herein again.

In S302, the component configuration file sent by the component management platform is received.

In S303, page structure information of the current page is acquired.

The page structure information of the current page may be a DOM (Document Object Model) structure of the current page.

In S304, in the component configuration file, rendering position information that matches position information of a portion to be rendered in the current page is determined according to the page structure information.

In S305, a component corresponding to rendering position information that matches position information of a portion to be rendered in the current page is determined as a target component to be rendered.

The component configuration information may include rendering position information of the component, and the rendering position information may include coordinate information of the component rendered in the page. According to the page structure information of the current page, the position information of the part to be rendered, namely the position information of the part which is not rendered in the current page, can be determined.

For example, each piece of component configuration information included in the component configuration file may be traversed, and if rendering position information in the currently traversed piece of component configuration information matches with position information of a portion to be rendered in the current page, that is, is consistent, a piece corresponding to the piece of component configuration information is a piece suitable for the current page and needs to be rendered for the current page, the piece may be determined as a target piece to be rendered.

It is worth mentioning that the present disclosure is not particularly limited with respect to the number of portions to be rendered and the number of target components to be rendered. If the number of the parts to be rendered in the current page is multiple, the target component to be rendered corresponding to each part to be rendered can be determined. In addition, when traversing the component configuration information in the component configuration file, traversing can be performed in sequence, and for the same part to be rendered in the current page, if a plurality of components are matched with the position information of the part to be rendered, the component corresponding to the last traversed component configuration information can be used as a target component to be rendered.

In S306, a component acquisition request is sent to the component management platform.

After determining the target component to be rendered, the user terminal 101 may obtain the target component to be rendered from the component management platform 102. The user terminal 101 may send a component obtaining request to the component management platform 102, where the component obtaining request is used to request to obtain a target component to be rendered.

In S307, in the case of acquiring the target component to be rendered, a load completion event is triggered.

The component management platform 102 may send the target component to be rendered to the user terminal 101 after receiving the component acquisition request sent by the user terminal 101. After receiving the target component to be rendered, the user terminal 101 is equivalent to loading the target component to be rendered, and at this time, may trigger a loading completion event, where the loading completion event is used to represent that the target component to be rendered has been loaded.

In S308, in response to the load completion event, the target component to be rendered is rendered in the current page at the rendering opportunity indicated by the component type information of the target component to be rendered.

The load completion event may indicate that the target component to be rendered has been loaded locally to the user terminal 101, at which time the target component to be rendered may be rendered in the current page. The component configuration information may include component type information, where the component type information may be used to indicate rendering timing of a component, and when the target component to be rendered is rendered, rendering may be performed according to the rendering timing indicated by the component type information of the target component to be rendered.

Rendering opportunities may be different for different components, and may include, for example, immediate rendering, delayed rendering, triggered rendering. The immediate rendering refers to rendering the component on the current page immediately after the component is loaded, the delayed rendering refers to rendering the component on the page after the component is loaded for a preset time, and the triggered rendering refers to rendering the component on the page in response to a preset event.

By the technical scheme, the component corresponding to the rendering position information matched with the position information of the part to be rendered in the current page is determined as the target component to be rendered, so that which components need to be loaded in the current page can be accurately determined, the components can be loaded as required, and the component loading speed is increased. Each application can acquire the target component to be rendered of other applications needing to be loaded from the component management platform, so that the reuse of the components can be effectively realized, and the development efficiency is improved. And moreover, the target component to be rendered is rendered in the current page according to the rendering opportunity indicated by the component type information of the target component to be rendered, so that accurate rendering of the target component to be rendered can be ensured.

In addition, the component rendering method applied to the terminal provided by the present disclosure may further include:

monitoring the rendering condition of a target component to be rendered in the current page; and/or

And after the target component to be rendered is rendered, monitoring the running condition of the target component to be rendered in the current page.

In this disclosure, the browsing experience of the user is more concerned by the first application corresponding to the current page, and therefore, the user terminal 101 running the first application may monitor the rendering condition of the target component to be rendered in the current page, where the rendering condition may include whether the target component to be rendered starts to be rendered at the rendering time indicated by the component type information, and whether normal rendering is completed after the target component to be rendered starts to be rendered. If the rendering condition of the target component to be rendered is abnormal, for example, rendering is not started at the rendering time, or rendering is not completed normally after the rendering is started, the user terminal 101 may send the rendering abnormal condition to the server corresponding to the first application, so that the first application may perform real-time monitoring on the rendering condition of the page itself.

After the target component to be rendered is rendered, the user terminal 101 may monitor an operation condition of the target component to be rendered in the current page, where the operation condition may include whether the target component to be rendered is reported incorrectly in the operation process, and if the operation of the target component to be rendered in the current page is abnormal, the user terminal 101 may send the abnormal operation condition to a server corresponding to the first application, so that the first application may perform real-time monitoring on the operation condition of the own page.

The user terminal 101 may monitor a rendering condition of the target component to be rendered in the current page, or a running condition of the target component to be rendered, and preferably, may monitor the rendering condition and the running condition of the target component to be rendered at the same time. Therefore, the first application corresponding to the current page focuses more on the browsing experience of the user, the component developer only needs to be responsible for independently developing the components, and the first application corresponding to the current page can monitor the rendering condition and/or the running condition of the components in the page in real time.

FIG. 4 is a flow diagram illustrating a component rendering method that may be applied to a component management platform, such as component management platform 102 shown in FIG. 1, in accordance with an exemplary embodiment. As shown in fig. 4, the method may include S401 and S402.

In S401, the receiving terminal responds to a component configuration file acquisition request sent by a component in which the second application exists in the current page.

Wherein the terminal may be the user terminal 101 shown in fig. 1. The second application is different from the first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components.

In S402, the component configuration file is sent to the terminal, so that the terminal determines the target component to be rendered of the second application in the current page according to the component configuration information after receiving the component configuration file, and renders the target component to be rendered in the current page after obtaining the target component to be rendered.

Optionally, the component configuration file is constructed by: in response to receiving a component issued to a component management platform, parsing a component code of the received component to obtain the component configuration information of the component; constructing the component configuration information for a plurality of components as the component configuration file.

Optionally, the constructing the component configuration information of the plurality of components as the component configuration file includes: constructing the component configuration information of the component with the version state being the visible state or the gray state as the component configuration file; or, the version state is a visible state or a gray state, and the component configuration information of the component subscribed in advance by the first application is constructed as the component configuration file.

With regard to the method in the above-mentioned embodiment, the specific implementation of each step has been described in detail in the embodiment of the method on the terminal side, and will not be elaborated here.

Fig. 5 is a flowchart illustrating interaction between the user terminal 101 and the component management platform 102 in a component rendering method according to an exemplary embodiment. As shown in FIG. 5, the method may include S501-S514.

In S501, in response to the presence of a component of the second application in the current page, the user terminal 101 sends a component profile acquisition request to the component management platform 102.

In S502, the component management platform 102 receives a component profile acquisition request sent by the user terminal 101.

In S503, the component management platform 102 transmits the component profile to the user terminal 101.

In S504, the user terminal 101 receives the component configuration file transmitted by the component management platform 102.

In S505, the user terminal 101 acquires page structure information of the current page.

In S506, the user terminal 101 determines rendering position information that matches position information of a portion to be rendered in the current page according to the page structure information in the component configuration file.

In S507, the user terminal 101 determines a component corresponding to rendering position information that matches position information of a portion to be rendered in the current page as a target component to be rendered.

In S508, the user terminal 101 sends a component acquisition request to the component management platform 102.

In S509, the component management platform 102 receives the component acquisition request sent by the user terminal 101.

In S510, the component management platform 102 transmits the target component to be rendered to the user terminal 101.

In S511, the user terminal 101 triggers a load complete event when acquiring the target component to be rendered.

In S512, in response to the loading completion event, the user terminal 101 renders the target component to be rendered in the current page according to the rendering opportunity indicated by the component type information of the target component to be rendered.

In S513, the user terminal 101 monitors the rendering condition of the target component to be rendered in the current page.

In S514, the user terminal 101 monitors the operation condition of the target component to be rendered in the current page after the target component to be rendered is rendered.

Specific embodiments of the various steps shown in fig. 5 have been set forth above in detail. It should be noted that fig. 5 is merely an example, and is an alternative embodiment of the component rendering method provided in the present disclosure.

Based on the same inventive concept, the present disclosure also provides a component rendering apparatus, and fig. 6 is a block diagram of a component rendering apparatus according to an exemplary embodiment, which may be applied to a terminal, such as the user terminal 101 shown in fig. 1, and as shown in fig. 6, the apparatus 600 may include:

a first sending module 601, configured to send a component configuration file obtaining request to a component management platform in response to a component of a second application existing in a current page, where the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of multiple components;

a first determining module 602, configured to receive the component configuration file sent by the component management platform, and determine, according to the component configuration information, a target component to be rendered for the second application in the current page;

a rendering module 603 configured to obtain the target component to be rendered from the component management platform and render the target component to be rendered in the current page.

By adopting the device, the terminal can respond to the component of the second application in the current page and send the component configuration file acquisition request to the component management platform, the second application is different from the first application corresponding to the current page, the component configuration file can be constructed according to the component configuration information of a plurality of components, compared with the plurality of components published to the component management platform, the occupied space of the component configuration file is relatively small, the target component to be rendered of the second application is determined based on the component configuration file, a large number of components in the component management platform can be not required to be loaded to the local terminal, but only the determined target component to be rendered in the current page is required to be loaded, and the component can be loaded as required. Because the number of the loaded components is greatly reduced, the influence of irrelevant components on the loading speed can be reduced, the component loading speed can be increased, the overall rendering efficiency of the page is improved, and the experience of a user for browsing the page is improved. Moreover, the component developers can release the components to the component management platform after completing the development work of the components, the developers of different components are not influenced mutually, and the independent development of the components can be realized. By publishing the components to the component management platform, each application can acquire the components of other applications to be loaded from the component management platform, so that the multiplexing of the components can be effectively realized, the development efficiency is improved, and the coupling dependence between the components of different applications is reduced. Therefore, by means of the scheme, the loading speed of the components can be increased, the overall rendering efficiency of the page can be improved, effective multiplexing of the components can be achieved, and the component development efficiency is improved.

Optionally, the apparatus 600 may further include: a second determining module, configured to, in response to a component of a second application existing in a current page, before the first sending module 601 sends a component configuration file obtaining request to a component management platform, determine that a component of the second application exists in the current page if a component to be rendered exists in the current page under a condition that component rendering of the first application in the current page is completed.

Optionally, the component configuration information includes rendering position information of the component; the first determining module 602 includes: the obtaining sub-module is configured to obtain page structure information of the current page; a first determining submodule configured to determine rendering position information matched with position information of a portion to be rendered in the current page according to the page structure information in the component configuration file; a second determining submodule configured to determine a component corresponding to rendering position information that matches position information of a portion to be rendered in the current page as the target component to be rendered.

Optionally, the rendering module 603 includes: a sending submodule configured to send a component obtaining request to the component management platform, where the component obtaining request is used for requesting to obtain the target component to be rendered; the trigger submodule is configured to trigger a loading completion event under the condition that the target component to be rendered is obtained, wherein the loading completion event is used for representing that the target component to be rendered is loaded; a rendering submodule configured to render the target component to be rendered in the current page at a rendering opportunity indicated by the component type information of the target component to be rendered in response to the load completion event.

Optionally, the apparatus 600 may further include: a first monitoring module configured to monitor a rendering condition of the target component to be rendered in the current page; and/or the second monitoring module is configured to monitor the running condition of the target component to be rendered in the current page after the target component to be rendered is rendered.

With regard to the apparatus in the above embodiments, the specific implementation of each module has been described in detail in the embodiments related to the method on the terminal side, and will not be elaborated here.

Fig. 7 is a block diagram illustrating a component rendering apparatus that may be applied to a component management platform, such as the component management platform 102 shown in fig. 1, and the apparatus 700 may include, as shown in fig. 7, according to another exemplary embodiment:

a receiving module 701, configured to receive a component configuration file acquisition request sent by a terminal in response to a component in which a second application exists in a current page, where the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components;

a second sending module 702, configured to send the component configuration file to the terminal, so that the terminal determines, according to the component configuration information, a target component to be rendered of the second application in the current page after receiving the component configuration file, and renders the target component to be rendered in the current page after obtaining the target component to be rendered.

Optionally, the component configuration file is constructed by: a parsing module configured to, in response to receiving a component issued to a component management platform, parse a component code of the received component to obtain the component configuration information of the component; a build module configured to build the component configuration information for a plurality of components as the component configuration file.

Optionally, the building module includes: the first construction submodule is configured to construct the component configuration information of the component with the version state being the visible state or the gray state into the component configuration file; or, the second constructing submodule is configured to construct the component configuration information of the component of which the version state is the visible state or the gray state and which the first application subscribes in advance as the component configuration file.

With regard to the apparatus in the above embodiment, the specific implementation manner of each module has been described in detail in the embodiment of the method on the component management platform side, and will not be elaborated here.

Referring now to fig. 8, a schematic diagram of an electronic device (e.g., the user terminal or component management platform of fig. 1) 800 suitable for implementing embodiments of the present disclosure is shown. The terminal device in the embodiments of the present disclosure may include, but is not limited to, a mobile terminal such as a mobile phone, a notebook computer, a digital broadcast receiver, a PDA (personal digital assistant), a PAD (tablet computer), a PMP (portable multimedia player), a vehicle terminal (e.g., a car navigation terminal), and the like, and a stationary terminal such as a digital TV, a desktop computer, and the like. The electronic device shown in fig. 8 is only an example, and should not bring any limitation to the functions and the scope of use of the embodiments of the present disclosure.

As shown in fig. 8, an electronic device 800 may include a processing means (e.g., central processing unit, graphics processor, etc.) 801 that may perform various appropriate actions and processes in accordance with a program stored in a Read Only Memory (ROM)802 or a program loaded from a storage means 808 into a Random Access Memory (RAM) 803. In the RAM 803, various programs and data necessary for the operation of the electronic apparatus 800 are also stored. The processing apparatus 801, the ROM 802, and the RAM 803 are connected to each other by a bus 804. An input/output (I/O) interface 805 is also connected to bus 804.

Generally, the following devices may be connected to the I/O interface 805: input devices 806 including, for example, a touch screen, touch pad, keyboard, mouse, camera, microphone, accelerometer, gyroscope, etc.; output devices 807 including, for example, a Liquid Crystal Display (LCD), speakers, vibrators, and the like; storage 808 including, for example, magnetic tape, hard disk, etc.; and a communication device 809. The communication means 809 may allow the electronic device 800 to communicate wirelessly or by wire with other devices to exchange data. While fig. 8 illustrates an electronic device 800 having various means, it is to be understood that not all illustrated means are required to be implemented or provided. More or fewer devices may alternatively be implemented or provided.

In particular, according to an embodiment of the present disclosure, the processes described above with reference to the flowcharts may be implemented as computer software programs. For example, embodiments of the present disclosure include a computer program product comprising a computer program carried on a non-transitory computer readable medium, the computer program containing program code for performing the method illustrated by the flow chart. In such an embodiment, the computer program may be downloaded and installed from a network through the communication means 809, or installed from the storage means 808, or installed from the ROM 802. The computer program, when executed by the processing apparatus 801, performs the above-described functions defined in the methods of the embodiments of the present disclosure.

It should be noted that the computer readable medium in the present disclosure can be a computer readable signal medium or a computer readable storage medium or any combination of the two. A computer readable storage medium may be, for example, but not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination of the foregoing. More specific examples of the computer readable storage medium may include, but are not limited to: an electrical connection having one or more wires, a portable computer diskette, a hard disk, a Random Access Memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing. In the present disclosure, a computer readable storage medium may be any tangible medium that can contain, or store a program for use by or in connection with an instruction execution system, apparatus, or device. In contrast, in the present disclosure, a computer readable signal medium may comprise a propagated data signal with computer readable program code embodied therein, either in baseband or as part of a carrier wave. Such a propagated data signal may take many forms, including, but not limited to, electro-magnetic, optical, or any suitable combination thereof. A computer readable signal medium may also be any computer readable medium that is not a computer readable storage medium and that can communicate, propagate, or transport a program for use by or in connection with an instruction execution system, apparatus, or device. Program code embodied on a computer readable medium may be transmitted using any appropriate medium, including but not limited to: electrical wires, optical cables, RF (radio frequency), etc., or any suitable combination of the foregoing.

In some embodiments, the clients, servers may communicate using any currently known or future developed network Protocol, such as HTTP (HyperText Transfer Protocol), and may interconnect with any form or medium of digital data communication (e.g., a communications network). Examples of communication networks include a local area network ("LAN"), a wide area network ("WAN"), the Internet (e.g., the Internet), and peer-to-peer networks (e.g., ad hoc peer-to-peer networks), as well as any currently known or future developed network.

The computer readable medium may be embodied in the electronic device; or may exist separately without being assembled into the electronic device.

The computer readable medium carries one or more programs which, when executed by the electronic device, cause the electronic device to: responding to a component of a second application existing in a current page, and sending a component configuration file acquisition request to a component management platform, wherein the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components; receiving the component configuration file sent by the component management platform, and determining a target component to be rendered of the second application in the current page according to the component configuration information; and acquiring the target component to be rendered from the component management platform, and rendering the target component to be rendered in the current page.

Alternatively, the computer readable medium carries one or more programs which, when executed by the electronic device, cause the electronic device to: a receiving terminal responds to a component configuration file acquisition request sent by a component with a second application in a current page, wherein the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components; sending the component configuration file to the terminal, so that the terminal determines the target component to be rendered of the second application in the current page according to the component configuration information after receiving the component configuration file, and renders the target component to be rendered in the current page after acquiring the target component to be rendered.

Computer program code for carrying out operations for the present disclosure may be written in any combination of one or more programming languages, including but not limited to an object oriented programming language such as Java, Smalltalk, C + +, and conventional procedural programming languages, such as the "C" programming language or similar programming languages. The program code may execute entirely on the user's computer, partly on the user's computer, as a stand-alone software package, partly on the user's computer and partly on a remote computer or entirely on the remote computer or server. In the case of a remote computer, the remote computer may be connected to the user's computer through any type of network, including a Local Area Network (LAN) or a Wide Area Network (WAN), or the connection may be made to an external computer (for example, through the Internet using an Internet service provider).

The flowchart and block diagrams in the figures illustrate the architecture, functionality, and operation of possible implementations of systems, methods and computer program products according to various embodiments of the present disclosure. In this regard, each block in the flowchart or block diagrams may represent a module, segment, or portion of code, which comprises one or more executable instructions for implementing the specified logical function(s). It should also be noted that, in some alternative implementations, the functions noted in the block may occur out of the order noted in the figures. For example, two blocks shown in succession may, in fact, be executed substantially concurrently, or the blocks may sometimes be executed in the reverse order, depending upon the functionality involved. It will also be noted that each block of the block diagrams and/or flowchart illustration, and combinations of blocks in the block diagrams and/or flowchart illustration, can be implemented by special purpose hardware-based systems which perform the specified functions or acts, or combinations of special purpose hardware and computer instructions.

The modules described in the embodiments of the present disclosure may be implemented by software or hardware. The name of a module does not in some cases constitute a limitation of the module itself, and for example, the first sending module may also be described as a "component profile acquisition request sending module".

The functions described herein above may be performed, at least in part, by one or more hardware logic components. For example, without limitation, exemplary types of hardware logic components that may be used include: field Programmable Gate Arrays (FPGAs), Application Specific Integrated Circuits (ASICs), Application Specific Standard Products (ASSPs), systems on a chip (SOCs), Complex Programmable Logic Devices (CPLDs), and the like.

In the context of this disclosure, a machine-readable medium may be a tangible medium that can contain, or store a program for use by or in connection with an instruction execution system, apparatus, or device. The machine-readable medium may be a machine-readable signal medium or a machine-readable storage medium. A machine-readable medium may include, but is not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any suitable combination of the foregoing. More specific examples of a machine-readable storage medium would include an electrical connection based on one or more wires, a portable computer diskette, a hard disk, a Random Access Memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing.

Example 1 provides, in accordance with one or more embodiments of the present disclosure, a component rendering method, the method comprising: responding to a component of a second application existing in a current page, and sending a component configuration file acquisition request to a component management platform, wherein the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components; receiving the component configuration file sent by the component management platform, and determining a target component to be rendered of the second application in the current page according to the component configuration information; and acquiring the target component to be rendered from the component management platform, and rendering the target component to be rendered in the current page.

Example 2 provides the method of example 1, before sending the component profile acquisition request to the component management platform in response to the component of the second application being present in the current page, the method further comprising: and under the condition that the rendering of the component of the first application in the current page is completed, if the component to be rendered exists in the current page, determining that the component of the second application exists in the current page.

Example 3 provides the method of example 1, the component configuration information including rendering location information of the component, according to one or more embodiments of the present disclosure; the determining a target component to be rendered of the second application in the current page according to the component configuration information includes: acquiring page structure information of the current page; in the component configuration file, determining rendering position information matched with position information of a part to be rendered in the current page according to the page structure information; and determining a component corresponding to the rendering position information matched with the position information of the part to be rendered in the current page as the target component to be rendered.

Example 4 provides the method of example 1, wherein the component configuration file includes component configuration information of a component whose version state is a visible state or a grayscale state, which is published to the component management platform, or the component configuration file includes component configuration information of a component whose version state is a visible state or a grayscale state, which is published to the component management platform, and to which the first application subscribes in advance.

Example 5 provides the method of example 1, the obtaining the target component to be rendered from the component management platform and rendering the target component to be rendered in the current page, including: sending a component acquisition request to the component management platform, wherein the component acquisition request is used for requesting to acquire the target component to be rendered; under the condition that the target component to be rendered is obtained, triggering a loading completion event, wherein the loading completion event is used for representing that the target component to be rendered is loaded completely; and in response to the loading completion event, rendering the target component to be rendered in the current page according to the rendering opportunity indicated by the component type information of the target component to be rendered.

Example 6 provides the method of example 1, further comprising, in accordance with one or more embodiments of the present disclosure: monitoring the rendering condition of the target component to be rendered in the current page; and/or monitoring the running condition of the target component to be rendered in the current page after the target component to be rendered is rendered.

Example 7 provides, in accordance with one or more embodiments of the present disclosure, a component rendering method, the method comprising: a receiving terminal responds to a component configuration file acquisition request sent by a component with a second application in a current page, wherein the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components; sending the component configuration file to the terminal, so that the terminal determines the target component to be rendered of the second application in the current page according to the component configuration information after receiving the component configuration file, and renders the target component to be rendered in the current page after acquiring the target component to be rendered.

Example 8 provides the method of example 7, the component configuration file being constructed by: in response to receiving a component issued to a component management platform, parsing a component code of the received component to obtain the component configuration information of the component; constructing the component configuration information for a plurality of components as the component configuration file.

Example 9 provides the method of example 8, the constructing the component configuration information for a plurality of components as the component configuration file, comprising: constructing the component configuration information of the component with the version state being the visible state or the gray state as the component configuration file; or, the version state is a visible state or a gray state, and the component configuration information of the component subscribed in advance by the first application is constructed as the component configuration file.

Example 10 provides, in accordance with one or more embodiments of the present disclosure, an apparatus for component rendering, the apparatus comprising: a first sending module, configured to send a component configuration file acquisition request to a component management platform in response to a component of a second application existing in a current page, where the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components; a first determining module, configured to receive the component configuration file sent by the component management platform, and determine, according to the component configuration information, a target component to be rendered of the second application in the current page; a rendering module configured to obtain the target component to be rendered from the component management platform and render the target component to be rendered in the current page.

Example 11 provides, in accordance with one or more embodiments of the present disclosure, a component rendering apparatus, the apparatus comprising: the terminal comprises a receiving module, a sending module and a receiving module, wherein the receiving module is used for receiving a component configuration file acquisition request sent by the terminal in response to a component of a second application in a current page, the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components; a second sending module, configured to send the component configuration file to the terminal, so that the terminal determines, according to the component configuration information, a target component to be rendered of the second application in the current page after receiving the component configuration file, and renders the target component to be rendered in the current page after obtaining the target component to be rendered.

Example 12 provides a computer readable medium having stored thereon a computer program that, when executed by a processing apparatus, performs the steps of the method of any one of examples 1-9, according to one or more embodiments of the present disclosure.

Example 13 provides, in accordance with one or more embodiments of the present disclosure, an electronic device, comprising: a storage device having a computer program stored thereon; processing means for executing the computer program in the storage means to carry out the steps of the method of any one of examples 1-6.

Example 14 provides, in accordance with one or more embodiments of the present disclosure, an electronic device, comprising: a storage device having a computer program stored thereon; processing means for executing the computer program in the storage means to carry out the steps of the method of any one of examples 7-9.

The foregoing description is only exemplary of the preferred embodiments of the disclosure and is illustrative of the principles of the technology employed. It will be appreciated by those skilled in the art that the scope of the disclosure herein is not limited to the particular combination of features described above, but also encompasses other embodiments in which any combination of the features described above or their equivalents does not depart from the spirit of the disclosure. For example, the above features and (but not limited to) the features disclosed in this disclosure having similar functions are replaced with each other to form the technical solution.

Further, while operations are depicted in a particular order, this should not be understood as requiring that such operations be performed in the particular order shown or in sequential order. Under certain circumstances, multitasking and parallel processing may be advantageous. Likewise, while several specific implementation details are included in the above discussion, these should not be construed as limitations on the scope of the disclosure. Certain features that are described in the context of separate embodiments can also be implemented in combination in a single embodiment. Conversely, various features that are described in the context of a single embodiment can also be implemented in multiple embodiments separately or in any suitable subcombination.

Although the subject matter has been described in language specific to structural features and/or methodological acts, it is to be understood that the subject matter defined in the appended claims is not necessarily limited to the specific features or acts described above. Rather, the specific features and acts described above are disclosed as example forms of implementing the claims. With regard to the apparatus in the above-described embodiment, the specific manner in which each module performs the operation has been described in detail in the embodiment related to the method, and will not be elaborated here.

Claims

1. A method of component rendering, the method comprising:

responding to a component of a second application existing in a current page, and sending a component configuration file acquisition request to a component management platform, wherein the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components;

receiving the component configuration file sent by the component management platform, and determining a target component to be rendered of the second application in the current page according to the component configuration information;

and acquiring the target component to be rendered from the component management platform, and rendering the target component to be rendered in the current page.

2. The method of claim 1, wherein prior to sending a component profile get request to the component management platform in response to the presence of a component of the second application in the current page, the method further comprises:

and under the condition that the rendering of the component of the first application in the current page is completed, if the component to be rendered exists in the current page, determining that the component of the second application exists in the current page.

3. The method of claim 1, wherein the component configuration information includes rendering location information of a component;

the determining a target component to be rendered of the second application in the current page according to the component configuration information includes:

acquiring page structure information of the current page;

in the component configuration file, determining rendering position information matched with position information of a part to be rendered in the current page according to the page structure information;

and determining a component corresponding to the rendering position information matched with the position information of the part to be rendered in the current page as the target component to be rendered.

4. The method of claim 1,

the component configuration file comprises component configuration information of a component of which the version state published to the component management platform is a visible state or a gray state, or the component configuration file comprises component configuration information of a component of which the version state published to the component management platform is a visible state or a gray state and to which the first application subscribes in advance.

5. The method of claim 1, wherein the obtaining the target component to be rendered from the component management platform and rendering the target component to be rendered in the current page comprises:

sending a component acquisition request to the component management platform, wherein the component acquisition request is used for requesting to acquire the target component to be rendered;

under the condition that the target component to be rendered is obtained, triggering a loading completion event, wherein the loading completion event is used for representing that the target component to be rendered is loaded completely;

and in response to the loading completion event, rendering the target component to be rendered in the current page according to the rendering opportunity indicated by the component type information of the target component to be rendered.

6. The method of claim 1, further comprising:

monitoring the rendering condition of the target component to be rendered in the current page; and/or

7. A method of component rendering, the method comprising:

a receiving terminal responds to a component configuration file acquisition request sent by a component with a second application in a current page, wherein the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components;

sending the component configuration file to the terminal, so that the terminal determines the target component to be rendered of the second application in the current page according to the component configuration information after receiving the component configuration file, and renders the target component to be rendered in the current page after acquiring the target component to be rendered.

8. The method of claim 7, wherein the component configuration file is constructed by:

in response to receiving a component issued to a component management platform, parsing a component code of the received component to obtain the component configuration information of the component;

constructing the component configuration information for a plurality of components as the component configuration file.

9. The method of claim 8, wherein constructing the component configuration information for the plurality of components as the component configuration file comprises:

constructing the component configuration information of the component with the version state being the visible state or the gray state as the component configuration file; alternatively, the first and second electrodes may be,

and constructing the component configuration information of the components of which the version states are visible states or gray states and which are subscribed by the first application in advance as the component configuration file.

10. An apparatus for component rendering, the apparatus comprising:

a first sending module, configured to send a component configuration file acquisition request to a component management platform in response to a component of a second application existing in a current page, where the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components;

a first determining module, configured to receive the component configuration file sent by the component management platform, and determine, according to the component configuration information, a target component to be rendered of the second application in the current page;

a rendering module configured to obtain the target component to be rendered from the component management platform and render the target component to be rendered in the current page.

11. An apparatus for component rendering, the apparatus comprising:

the terminal comprises a receiving module, a sending module and a receiving module, wherein the receiving module is used for receiving a component configuration file acquisition request sent by the terminal in response to a component of a second application in a current page, the second application is different from a first application corresponding to the current page, and the component configuration file is constructed according to component configuration information of a plurality of components;

a second sending module, configured to send the component configuration file to the terminal, so that the terminal determines, according to the component configuration information, a target component to be rendered of the second application in the current page after receiving the component configuration file, and renders the target component to be rendered in the current page after obtaining the target component to be rendered.

12. A computer-readable medium, on which a computer program is stored, which, when being executed by processing means, carries out the steps of the method of any one of claims 1 to 6, or which, when being executed by processing means, carries out the steps of the method of any one of claims 7 to 9.

13. An electronic device, comprising:

a storage device having a computer program stored thereon;

processing means for executing the computer program in the storage means to carry out the steps of the method according to any one of claims 1 to 6.

14. An electronic device, comprising:

a storage device having a computer program stored thereon;

processing means for executing the computer program in the storage means to carry out the steps of the method according to any one of claims 7 to 9.