Theme configuration method, device and equipment

Abstract

The embodiment of the invention discloses a theme configuration method, device and equipment. According to the scheme, the method comprises the steps of defining rendering rule configuration based on a theme configuration layer to obtain a rendering rule list; collecting design data corresponding to the current theme configuration; based on rendering rules contained in the rendering rule list, performing rendering logic calculation on the design data to generate a corresponding semantic structure result set; and according to the semantic structure result set, generating a corresponding semantic structure entity for executing theme rendering.

Description

Technical Field

[0001] This specification relates to the field of Internet technology, and in particular to methods, apparatus and devices for configuring the subject. Background Technology

[0002] In modern front-end development, theme configuration has become an important part of achieving interface consistency and customizability in order to adapt to diverse business scenarios and brand needs.

[0003] Traditional solutions provide a set of predefined design tokens, allowing developers to quickly configure the overall visual style of an application by adjusting basic variables such as color, font, and spacing.

[0004] In practical applications, developers modify the design token values ​​to set the basic parameters of the theme according to the business requirements, thereby matching the business needs. For business design specifications that include more detailed or specific style requirements, if the predefined design tokens cannot provide corresponding variable support, developers typically need to delve directly into the implementation code of specific components and manually add or override style rules to meet these customization requirements.

[0005] Therefore, in collaborative development projects, different developers may be responsible for different functional modules or pages. When they encounter similar gaps in component styling, they usually write custom styling code independently for their respective component parts.

[0006] Therefore, a more universal and stable solution is needed for theme configuration. Summary of the Invention

[0007] This specification provides one or more embodiments of a theme configuration method, apparatus, device, and storage medium to address the following technical problem: the need for a more universal and stable solution for theme configuration.

[0008] To solve the above-mentioned technical problems, one or more embodiments of this specification are implemented as follows: This specification provides a theme configuration method according to one or more embodiments, including: Based on the theme configuration layer, the rendering rule configuration is defined to obtain a list of rendering rules; Collect the design data corresponding to the current theme configuration; Based on the rendering rules contained in the rendering rule list, the design data is subjected to rendering logic calculations to generate a corresponding semantic structure result set. Based on the semantic structure result set, a corresponding semantic structure entity is generated for performing theme rendering.

[0009] This specification provides a subject configuration device according to one or more embodiments, comprising: The rule configuration definition module, based on the theme configuration layer, defines the rendering rule configuration and obtains a list of rendering rules; The design data acquisition module collects design data corresponding to the current theme configuration. The rendering calculation module performs rendering logic calculations on the design data based on the rendering rules included in the rendering rule list, and generates a corresponding semantic structure result set. The theme rendering module generates corresponding semantic structure entities based on the semantic structure result set, which are used to perform theme rendering.

[0010] This specification provides one or more embodiments of a subject configuration device, comprising: At least one processor; and, A memory communicatively connected to the at least one processor; wherein, The memory stores instructions executable by the at least one processor, which, when executed by the at least one processor, enable the at least one processor to: Based on the theme configuration layer, the rendering rule configuration is defined to obtain a list of rendering rules; Collect the design data corresponding to the current theme configuration; Based on the rendering rules contained in the rendering rule list, the design data is subjected to rendering logic calculations to generate a corresponding semantic structure result set. Based on the semantic structure result set, a corresponding semantic structure entity is generated for performing theme rendering.

[0011] This specification provides one or more embodiments of a non-volatile computer storage medium storing computer-executable instructions, wherein the computer-executable instructions are configured as follows: Based on the theme configuration layer, the rendering rule configuration is defined to obtain a list of rendering rules; Collect the design data corresponding to the current theme configuration; Based on the rendering rules contained in the rendering rule list, the design data is subjected to rendering logic calculations to generate a corresponding semantic structure result set. Based on the semantic structure result set, a corresponding semantic structure entity is generated for performing theme rendering.

[0012] The above-described at least one technical solution adopted in one or more embodiments of this specification can achieve the following beneficial effects: Based on the rendering rule list and semantic structure, the style rendering logic is abstracted into configurable rules, enabling developers to define global style rules without delving into component code. This ensures the independence and controllability of the rendering process and decouples rendering from business customization.

[0013] By centrally managing rendering rules, the practice of different developers repeatedly writing custom styles in their respective modules is avoided, reducing the risk of style fragmentation. Global rules are defined and distributed at the theme configuration layer, ensuring a unified visual style across the entire application, thereby improving the maintainability and consistency of theme configuration.

[0014] When business requirements change, simply adjusting or adding rules in the rendering rule list allows for rapid response to customized needs, without requiring modifications to component implementations. This supports smooth evolution of theme configurations, reduces iteration costs, and enhances scalability and flexibility. Furthermore, in collaborative projects, runtime global rule distribution prevents style overriding conflicts and configuration breakdown issues caused by an increase in the number of developers. Theme configurations remain stable, reducing the risk of code corruption and avoiding configuration breakdown and collaboration degradation.

[0015] Developers no longer need to manually handle style gaps for each component. Instead, they rely on predefined semantic structure entities for rendering, reducing repetitive work, accelerating the development process, and improving development efficiency. Attached Figure Description

[0016] To more clearly illustrate the technical solutions in the embodiments or prior art of this specification, the drawings used in the description of the embodiments or prior art will be briefly introduced below. Obviously, the drawings described below are only some embodiments recorded in this specification. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0017] Figure 1 A flowchart illustrating a theme configuration method provided in one or more embodiments of this specification; Figure 2 A system flowchart illustrating a topic configuration method in an application scenario, provided for one or more embodiments of this specification. Figure 3 This is a schematic diagram illustrating the construction process of a directed computation graph in one or more embodiments of this specification, for use in an application scenario. Figure 4 A schematic diagram of a directed computation graph in an application scenario provided for one or more embodiments of this specification; Figure 5 A schematic diagram of the structure of a subject configuration device provided in one or more embodiments of this specification; Figure 6This is a schematic diagram of the structure of a subject configuration device provided for one or more embodiments of this specification. Detailed Implementation

[0018] This specification provides methods, apparatus, devices, and storage media for configuring the subject.

[0019] To enable those skilled in the art to better understand the technical solutions in this specification, the technical solutions in the embodiments of this specification will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this application, and not all embodiments. Based on the embodiments of this specification, all other embodiments obtained by those skilled in the art without creative effort should fall within the scope of protection of this application.

[0020] Figure 1 This is a flowchart illustrating a subject configuration method provided in one or more embodiments of this specification. This method can be applied to different business domains, such as front-end development, internet finance, e-commerce, instant messaging, gaming, and government services. The process can be executed by computing devices in the corresponding domain (e.g., servers for front-end development). Certain input parameters or intermediate results in the process can be manually adjusted to help improve accuracy.

[0021] Figure 1 The process may include the following steps: S102: Based on the theme configuration layer, define the rendering rule configuration to obtain a list of rendering rules.

[0022] The theme configuration layer refers to the central management system located above the application architecture. It is responsible for uniformly defining, managing, and distributing the design specifications and visual themes for the entire application. It connects the design system and business components to ensure that all interface elements follow a unified visual language.

[0023] The theme configuration layer has several functions, including: centralized management of design specifications: uniformly storing design variables such as color, font, spacing, and rounded corners to ensure design consistency; dynamic theme switching: supporting runtime theme switching (e.g., light / dark mode, brand theme switching, etc.) without restarting the application; rule calculation and distribution: processing the design data of components according to rules, generating and distributing rendering rules to each component.

[0024] By defining rendering rules through theme configuration layers, style decay can be prevented. A unified configuration source ensures that all components receive consistent rendering rules, avoiding style inconsistencies caused by different developers writing their own rules. Furthermore, it decouples design and development; the design team can adjust the appearance by modifying configurations, while the development team focuses on business logic implementation. This provides a unified design and implementation standard for multiple development teams, reducing communication costs.

[0025] The theme configuration layer can take several forms. For example, it can be a configuration provider layer, which wraps the application root node with React's ConfigProvider component and passes theme configurations to child components through the context. Similar functionality can also be achieved using other technology stacks such as Vue.js and Angular. Taking React as an example, the ConfigProvider layer is the concrete carrier of the theme configuration layer in its technical implementation. It is a component layer specifically providing configuration information, encapsulating configuration management and distribution logic to provide a unified and accessible configuration service to all components in the application.

[0026] The ConfigProvider layer can centrally manage scattered configuration information, decouple it from business logic, and achieve configuration encapsulation and isolation; it supports global configuration and local overriding, allowing specific components or modules to use custom configurations, and achieving configuration inheritance and overriding; it can also manage the configuration lifecycle, managing the loading, updating, caching and invalidation of configurations; and through the context mechanism, it allows child components to access configurations without explicit passing, achieving cross-component configuration sharing.

[0027] Rendering rule configuration refers to a declarative configuration system that describes how components should be rendered in different states through a predefined set of rules. These rules map the component's design data into specific visual representations and behavioral characteristics, achieving separation of rendering logic from component structure. Through rendering rule configuration, design specifications (such as colors, fonts, spacing, etc.) can be transformed into executable rendering rules, thus obtaining a list of rendering rules.

[0028] Figure 2This document provides a system flowchart illustrating a theme configuration method for one or more embodiments in an application scenario. Based on the theme configuration layer, it defines the attribute rendering rules for individual components and the global rendering rules for multiple components. Using React as an example, specific attribute rendering rules are set through RenderProps configuration. RenderProps is a design pattern in React for logic reuse and dynamic rendering. It allows components to delegate their state, data, or capabilities to the user through a function-type property (e.g., named render or used as a children function), allowing the user to decide how to render the content.

[0029] There are two types of rendering rule configurations: attribute rendering rule configurations for a single component and global rendering rule configurations for multiple components. Components are the executors of rendering rule configurations, transforming abstract configuration rules into concrete visual representations. Component types can include configuration management components, content rendering components, and auxiliary / utility components. Configuration management components carry and manage configuration rules, serving as the technical implementation carrier of the design system. They can include global configuration providers (e.g., ConfigProvider, ThemeProvider) and local configuration containers (e.g., PageConfig, SectionConfig). Content rendering components are the actual users of configuration rules, performing specific rendering based on the received rules. They can include basic atomic components (the smallest, indivisible unit of the interface, such as buttons, input boxes, icons, labels, and separators), composite components (composed of multiple atomic components to implement specific functional units, such as forms, cards, navigation menus, dialog boxes, and notification prompts), and layout components (not containing specific content, primarily responsible for organizing the arrangement of other components in space, such as grid systems, flexible layout containers, panels, drawers, and modal containers).

[0030] Taking React as an example, global rendering rule configuration, also known as global renderProps configuration, refers to the unified rendering rule configuration for the entire application or collection of components. It is defined and managed uniformly through a configuration provider layer (such as ConfigProvider), affecting the rendering behavior of all related components in the application. For example, in the global configuration of a brand theme, the main brand color, secondary color, and neutral color scheme in the color system are configured; the font family and font size hierarchy in the font system are configured; the base spacing and spacing multiple in the spacing system are configured; and the basic rounded corners and component rounded corners in the rounded corner system are configured. Another example is in the global configuration of interaction behavior, which configures the animation duration in the animation duration specification, the hover rules in the state feedback rules, the focus style in focus management, and the disabled style in the disabled state.

[0031] Attribute rendering rule configuration, also known as renderProps configuration, refers to specific rendering rule configurations for a single component instance. Passed directly through the component's attribute interface, it only affects the rendering behavior of that specific component. Its priority is usually higher than the global rendering rule configuration. When the two conflict, the attribute rendering rule configuration takes precedence and can directly override the global rendering rule configuration. For example, in the attribute configuration of a button component, you could update the main color by overriding color rules, add a new size by specifying a particular size, add a new hover animation by adding a new animation effect, add a new left-side icon by using a custom icon, and add a new vibration effect by using specific interactive feedback.

[0032] The global rendering rule configuration and the attribute rendering rule configuration are aggregated to obtain a rendering rule list. During the configuration aggregation process, the global rendering rule configuration and the attribute rendering rule configuration can be directly combined; however, this approach may result in rule conflicts between different rendering rule configurations.

[0033] Based on this, the global rendering rule configuration and property rendering rule configuration are standardized and grouped according to configuration type, resulting in multiple configuration groups. The purpose of standardization is to convert the rendering rule configuration into a standardized intermediate format, ensuring data structure consistency. For the key-value pairs corresponding to each rendering rule in the global and property rendering rule configurations (typically, a rendering rule corresponds to one or more key-value pairs, and each key-value pair corresponds to a single configuration item), corresponding identifiers are added to the configuration items. For example, the identifier `source: 'global'` is added to the configuration item corresponding to the global rendering rule configuration, and the identifier `source: 'property'` is added to the configuration item corresponding to the property rendering rule configuration, thus distinguishing them. Simultaneously, the configuration item format needs to be standardized to ensure that each configuration item contains the required fields, such as at least four basic fields: name, value, source, and priority.

[0034] Configuration types can be preset, and the names of each configuration item are matched to group the configuration items in each rendering rule, resulting in multiple configuration groups. For example, these could include a mouse click (onClick) group. For each configuration group, conflict resolution is performed based on the corresponding configuration priority. If a single configuration group contains only a single rendering rule, it can be directly retained. If a single configuration group contains multiple rendering rules, conflict resolution is required according to priority, and configuration items with lower priority are deleted. Generally speaking, property rendering rule configurations have higher priority than global rendering rule configurations. For example, in the onClick group, there are two members: the first member: { name: 'onClick', value: global click function, source: 'global'}; the second member: { name: 'onClick', value: property click function, source: 'property'}. Since source: 'property' has higher priority, this group ultimately retains the property click function and deletes the global click function.

[0035] The remaining rendering rule configurations in each configuration group are processed for format conversion and sorting to obtain a rendering rule list. At this point, all configuration items are converted to array format and sorted by type. For example, after grouping by event handler, renderer, validator, etc., within the same type, they are sorted alphabetically by name field. Simultaneously, during the sorting process, auxiliary fields added during intermediate processing (such as source, priority) can be removed, retaining only the fields required by the business logic.

[0036] S104: Collect the design data corresponding to the current theme configuration.

[0037] Theme configuration refers to a series of design specifications parameters set for the business scenario or user needs that require the current theme to be applied. It includes core elements that affect the visual presentation and interactive experience of the interface, such as color, font, spacing, rounded corners, shadows, and animations.

[0038] Design data refers to the collection of all dynamic information that affects the rendering result of a component. It includes configuration parameters passed in from the outside (referred to as external properties) and state information maintained by the component itself (referred to as internal state).

[0039] Specifically, such as Figure 2 As shown, for each component configured for the current theme, the external properties it receives and its own internal state are determined. Continuing with React as an example, external properties are also called external props, and internal state is also called internal state.

[0040] External properties are read-only data passed from a parent component to a child component, used to configure the child component's behavior, content, and appearance. For example, external properties might be basic configuration class properties, configuring the button type, size, shape, whether it's disabled, whether to show loading status, icon name, and button text for a button component. Or, for a form input component, external properties might configure the tooltip text, maximum input length, whether to show a clear button, whether it's read-only, whether to autofocus, and validation rules.

[0041] Internal state is variable data managed and maintained within a component, used to record dynamic information about the component that changes over time. For example, still for a button component, its internal state is configured with information such as whether the mouse is hovering over the button, whether it is pressed (active state), whether it has focus (when navigating with the keyboard), the state of the ripple animation, the X coordinate of the ripple center, the Y coordinate of the ripple center, and whether the ripple animation is playing.

[0042] By aggregating external attributes and internal states, the design data corresponding to the current theme configuration is obtained. Similar to rendering rule configuration, direct combination may lead to conflicts between data.

[0043] Based on this, external attributes and internal states are standardized. The purpose of standardization is to convert design data into a standardized intermediate format, ensuring data structure consistency. For each configuration item contained in external attributes and internal states (an external attribute or internal state can include one or more configuration items), corresponding identifiers are added. For example, the identifier `source: 'props'` is added to the configuration item corresponding to an external attribute, and the identifier `source: 'state'` is added to the configuration item corresponding to an internal state, thus distinguishing them. Simultaneously, data types need to be standardized, converting special values ​​(such as null, undefined, and empty strings) into uniform placeholder identifiers, and recording the original value of each attribute for easy rollback or debugging later.

[0044] Based on the business rules corresponding to the current theme configuration, the dependencies between external attributes and internal states are determined (referred to as the first dependency here for clarity). Business rules are pre-defined for different theme configurations. These business rules describe the logical relationships, constraints, and dynamic behaviors between configuration items in the current theme configuration. These rules may include conditional dependencies and derivations, data constraints and validity, source priority and conflict resolution, mutual exclusion and coexistence relationships, etc.

[0045] Conditional dependencies and inferences are used to describe how the value of one configuration item affects the default value or optional state of another configuration item. For example, the rule is: when the value of attribute B is true, the default value of attribute C is 1. This describes the triggering and assignment relationship between configuration items B (condition) and C (result).

[0046] Data constraints and validity are used to specify the conditions, allowed ranges, or formats that configuration values ​​must meet. For example, the rule might be: the value of attribute D (size) must be selected from ['small', 'medium', 'large'].

[0047] Source priority and conflict resolution are used to determine which value to adopt when the same configuration item receives different values ​​from different sources (such as global configuration and component properties). For example, the rule is: the component's own properties have higher priority than the global default configuration.

[0048] Mutual exclusion and coexistence are used to specify which configuration items cannot be effective at the same time, or which must be set simultaneously. For example, the rule is: when enabling pagination mode, the number of items per page attribute must also be provided, or attribute E (corresponding to mode A) and attribute F (corresponding to mode B) cannot both be true, etc.

[0049] Business rules allow analysis to identify the primary dependencies between configuration items in each design data set. Based on these dependencies, data cleansing is performed on external attributes and internal states through data type validation and business rule validation. Data type validation utilizes data type-related rules and relationships to check if the values ​​of each design data set conform to the expected data type, converting or marking non-conforming values ​​as invalid. Business rule validation uses business rules to verify that all primary dependencies are satisfied, check for data combinations that violate business constraints, and verify the rationality of conditional calculation results. Abnormal relationships, data, and calculation results are converted or marked as invalid.

[0050] For the cleaned design data, deduplication and merging can be performed to merge attributes from different sources that have the same meaning.

[0051] External attributes and internal states undergo format conversion and sorting processes to obtain the corresponding design data. Format conversion may include removing processing markers (such as those added during standardization), while sorting can group data by type or function and add data version and validation information. After obtaining the design data, a data summary can also be generated.

[0052] S106: Based on the rendering rules contained in the rendering rule list, perform rendering logic calculations on the design data to generate a corresponding semantic structure result set.

[0053] Rendering logic calculation refers to the process of generating a set of style rules that describe the visual style and interactive behavior of a component by traversing the rendering rule list based on the design data received by the component (including the external attributes and internal states mentioned above) and using deterministic algorithms such as rule matching, priority determination, conflict resolution, and data transformation.

[0054] Specifically, the rendering rules in the rendering rule list are traversed. For each individual rendering rule, rendering logic calculations are performed based on its corresponding design data to obtain the corresponding style rule fragments. A style rule fragment refers to a finite set of attribute-value pairs output by the function corresponding to a single rendering rule after calculation based on its corresponding design data during the rendering logic calculation process. It describes a portion of the component's visual style or interactive behavior. It is the basic unit constituting a complete set of style rules. Generally speaking, each style rule fragment is responsible for defining a specific aspect of the component's appearance or behavior. For example, for the rendering rule for "button type," when the button type in the design data is detected to be "primary," the output color-related style rule fragments include: background color attribute: value "brand primary blue"; text color attribute: value "white"; border color attribute: value "brand primary blue". For example, regarding the rendering rules for "hover state", when the hover state in the design data is detected to be "true", the output state-related style rule fragments include: background color darkening property: value "20%"; shadow addition property: value "0 4px 12px rgba(0,0,0,0.15)"; mouse pointer property: value "pointer".

[0055] like Figure 2 As shown, the calculation process for rendering rules involves executing each rendering rule sequentially according to its order (e.g., rule addition order, priority order, type order, etc.). After each rendering rule is executed, the process continues to iterate and execute the next rendering rule in the same order until all rules are executed.

[0056] The style rule fragments corresponding to each rendering rule are combined to obtain a style rule set. The style rule set contains multiple style rule fragments, which are combined according to a certain rule to obtain the style rule set.

[0057] During the combination process, the style rule fragments corresponding to the rendering rules are grouped according to their scope identifiers, resulting in multiple rule fragment groups. The scope identifier describes the scope of the style rule fragment (including global styles, component styles, child component styles, etc.). Of course, based on requirements, the rule fragment groups can be further subdivided according to style type (e.g., layout styles, appearance styles, interaction styles, animation styles, etc.) to obtain more detailed rule fragment groups.

[0058] The system combines style rule fragments within a single rule fragment group and handles conflicts. During combination, style declarations (attribute-value pairs) are extracted and their format standardized, and multiple declarations of the same attribute are detected to identify potential conflicts. For identified conflicts, they are handled based on the priority of the source rendering rule; that is, the higher the priority of the source rendering rule, the more likely the corresponding attribute is preserved.

[0059] By identifying the scope identifiers corresponding to each rule fragment group, the hierarchical relationship between each rule fragment group is determined, and the style properties corresponding to the style rule fragments are inherited according to the hierarchical relationship. Specifically, for inheritable style properties (such as font and color), the rules of the parent group are applied to the child groups, while for non-inheritable properties, the original rules of each group are maintained. Of course, if some inheritable style properties already have corresponding values ​​in the child groups, then inheritance is unnecessary.

[0060] Style rule fragments are combined according to their hierarchical relationship to obtain a style rule set. During combination, style rules are organized according to their scope order, usually global-parent-child, and then converted to a standard format before being output as a style rule set.

[0061] Based on a predefined semantic structure, a corresponding semantic structure result set is generated according to the set of style rules. The semantic structure result set refers to the set of style rules calculated by the component based on the rendering logic, which is then merged with the component's predefined semantic structure (a DOM structure description with clear functional roles and hierarchical relationships) to form a structured data set containing complete visual styles, interactive behaviors, and content information. This set can be directly input into the rendering engine for interface drawing.

[0062] For example, the predefined semantic structure for the button component includes the following: Button component (role: interactive control, type: main operation button) - Icon container (role: decorative element, position: left) -Text label (role: content display, accessibility label: "submit") - Background container (role: visual container, interactive area) In the semantic structure, the button component is at the highest level, while the icon container, text label, and background container are at the same level and are lower than the level of the button component.

[0063] For a set of style rules, the style rule fragments contained therein are not structured language. Through this semantic structure, it is finally formed into a set of semantic structure results, which the rendering engine can directly read and render.

[0064] Of course, in addition to style rule fragments describing visual styles (including color, font, spacing, border, shadow, etc.), the style rule set can also include accessibility attributes, data attributes, conditional rendering directives, event handling configurations, etc. Accessibility attributes can include ARIA attributes (e.g., aria-label, role, etc.), screen reader tips, focus management attributes, etc.; data attributes can include event tracking data attributes (e.g., data-track-id, etc.), test identifiers (e.g., data-testid), business tag attributes, etc.; conditional rendering directives can include whether to display a certain child element, whether to enable a certain interactive state, dynamic content replacement rules, etc.; event handling configurations can include feedback methods for specific interactions, conditional event binding, etc.

[0065] S108: Generate a corresponding semantic structure entity based on the semantic structure result set, for use in performing theme rendering.

[0066] Semantic structural entities refer to the concrete instantiation of a semantic structural result set in a specific runtime environment. Semantic structural entities transform the abstract descriptions within the semantic structural result set into a collection of interface elements with actual form and function that can be directly processed by the rendering engine through platform-specific APIs.

[0067] After creating semantic structure entities, styles are precisely applied to each entity. This involves parsing the style rule set, converting it into a platform-specific style format, applying it to the semantic structure entities, and handling style inheritance and cascading relationships.

[0068] Based on the hierarchical relationship between semantic structure entities, parent-child references between entities are established. By calculating layout constraints and positions and establishing communication channels between components, a complete rendering tree structure is generated. The rendering engine then parses this rendering tree structure and performs theme rendering.

[0069] Of course, before the rendering tree structure is generated, interactive behavior binding can be performed. By parsing the interactive behavior description, event handling functions are created, and these functions are then bound to the entity's event system. Gesture recognition and focus management are also configured. Accessibility configuration is performed simultaneously, including setting accessibility attributes, ARIA attributes, and screen reader tips.

[0070] Based on the rendering rule list and semantic structure, the style rendering logic is abstracted into configurable rules, enabling developers to define global style rules without delving into component code. This ensures the independence and controllability of the rendering process and decouples rendering from business customization.

[0071] By centrally managing rendering rules, the practice of different developers repeatedly writing custom styles in their respective modules is avoided, reducing the risk of style fragmentation. Global rules are defined and distributed at the theme configuration layer, ensuring a unified visual style across the entire application, thereby improving the maintainability and consistency of theme configuration.

[0072] When business requirements change, simply adjusting or adding rules in the rendering rule list allows for rapid response to customized needs, without requiring modifications to component implementations. This supports smooth evolution of theme configurations, reduces iteration costs, and enhances scalability and flexibility. Furthermore, in collaborative projects, runtime global rule distribution prevents style overriding conflicts and configuration breakdown issues caused by an increase in the number of developers. Theme configurations remain stable, reducing the risk of code corruption and avoiding configuration breakdown and collaboration degradation.

[0073] Developers no longer need to manually handle style gaps for each component. Instead, they rely on predefined semantic structure entities for rendering, reducing repetitive work, accelerating the development process, and improving development efficiency.

[0074] In one or more embodiments of this specification, the linear traversal of the rendering rule list is used above. When the design data changes, all rules need to be recalculated, which may result in duplicate calculations and waste of computing resources.

[0075] Based on this, for each rendering rule, the second dependency relationship is extracted, and a dependency matrix is ​​generated. When extracting dependencies, static dependency analysis can be performed first to parse the computation functions and conditional expressions of each rendering rule, thereby extracting directly dependent variable names by combining business rules and data type rules. Then, implicit dependency identification is performed to identify indirect dependencies between rules for the second dependency relationship (e.g., the output of rule A is referenced by the conditional expression of rule B), thus improving the dependency identification. Finally, dependency verification is performed to ensure that all referenced variables have corresponding data sources (including the outputs of other rendering rules).

[0076] Different dependencies have different dependency types, including strong dependencies, weak dependencies, and conditional dependencies. Different numerical values ​​are used to represent different dependency types. For example, 0 indicates no dependency, 1 indicates a weak dependency, 2 indicates a strong dependency, and 3 indicates a conditional dependency. Thus, all dependencies can be represented by a dependency matrix, reducing data storage pressure.

[0077] Nodes are obtained based on rendering rules, and directed edges are generated based on the dependency matrix to construct a directed computation graph. Rendering rules are essentially transformation functions of "design data - style rule fragments," which need to be converted into computable nodes. The second dependency matrix represents the relationships between nodes, thus constructing the directed computation graph.

[0078] Specifically, Figure 3 This specification provides a schematic diagram of the construction process of a directed computation graph in one or more embodiments, illustrating an application scenario. During the construction of the directed computation graph, nodes are generated according to rendering rules, and these nodes are categorized and their corresponding attributes are defined. The categorization types can include data nodes, mapping nodes, computation nodes, condition nodes, and composite nodes. Data nodes represent data content; mapping nodes directly map design data to style values ​​(e.g., color = props.color); computation nodes calculate new values ​​based on multiple inputs (e.g., width = containerWidth*0.8); condition nodes contain branch nodes with if-else logic; and composite nodes merge style rule fragments output by multiple rules.

[0079] Meanwhile, node attributes include: unique identifier (generated based on rule name and scope), computation function (converts the rule's JavaScript function into a pure function form), input interface (defining the data types and formats accepted by the node), output interface (defining the data types and formats generated by the node), and metadata (node ​​computation cost, caching strategy, side effect flags, etc.).

[0080] Based on the dependency matrix, directed edges are generated between the nodes to construct an initial computational graph. Nodes with a second dependency in the dependency matrix are then connected to construct the initial computational graph.

[0081] Cyclic dependency detection is performed on the initial computation graph, and corresponding cyclic dependency handling strategies are executed based on the detection results to obtain an intermediate computation graph. During cyclic dependency detection, the Tarjan algorithm or Kosaraju algorithm is used to find strongly connected components in the graph. Specific dependency cycle paths are identified within each strongly connected component, thus identifying the dependency cycles. Based on the nature of the dependency cycles, they are classified into direct cycles (e.g., direct cycles in ABA), indirect cycles (e.g., multi-node cycles in ABCA), and conditional cycles (cycles formed only under specific conditions), thereby outputting a list of cyclic dependencies containing the path and node information of the cycles.

[0082] When implementing circular dependency handling strategies, various methods can be selected based on requirements. For example, a node in the loop can be marked as "delayed computation," and the default value can be used during the first computation, with the result updated after the computation is completed. For convergent numerical computation loops, the maximum number of iterations and the convergence threshold can be set. Conditional dependency loops can be split into multiple acyclic subgraphs and computed separately according to the conditions. For logical loops that are difficult to handle automatically, they can be marked as requiring manual intervention.

[0083] For the intermediate computation graph, priorities are assigned based on node attributes, and execution conditions are defined for each node based on these priorities, resulting in a directed computation graph. Typically, priorities can be assigned based on the node type in the node attributes; for example, priorities from highest to lowest are: data nodes, condition nodes, mapping nodes, computation nodes, and composite nodes. Execution conditions include setting trigger conditions, condition expressions, and execution strategies. Trigger conditions include immediate execution when there are no external dependencies or dependencies are ready, delayed execution after a specific event or condition is met, and lazy execution only when the result is needed. The generation of condition expressions is triggered when the corresponding design data changes for computation nodes, and when the variables in the condition expression change for condition nodes. Execution strategies include synchronous execution, asynchronous execution, and parallel execution.

[0084] By assigning priorities and execution conditions to each node, the directed computation graph becomes more complete, making it easier to use and judge the computation graph in the future.

[0085] Figure 4 This diagram illustrates a directed computation graph in one or more embodiments of this specification, representing a simple directed graph. In this graph, D1 (data node) `props.color` stores the color attribute, D2 (data node) `state.isHovered` stores the hover state, and D3 (data node) `props.size` stores the size attribute. Rule A of N1 (mapping node) directly maps `props.color` to a style color value. Rule B of N2 (condition node) determines the background color based on `state.isHovered` (e.g., true for light color, false for dark color). Rule C of N3 (computation node) calculates the width based on `props.size` (e.g., width = props.size * 10). Rule D of N4 (combination node) combines the results of rules A and B to generate a style rule fragment containing the color and background color. Rule E of N5 (combination node) combines the results of rules C and D to generate the final style rule fragment.

[0086] For a directed computation graph, independent sub-regions are identified, and the directed computation graph is reconstructed in parallel based on the sub-computation graphs corresponding to each sub-region. By identifying independent parts of the graph, parallel computation is possible to improve performance. The independent sub-regions are folded, forming completely independent sub-computation graphs with no dependencies between them.

[0087] During parallel refactoring, different sub-computation graphs are merged into a single parallel computation task for horizontal merging, or consecutive computation steps are merged into a single computation unit for vertical merging. At this time, corresponding merging nodes are created, including a parallel start node (to mark the starting point of parallel computation), a data distribution node (to distribute input data to each parallel branch), a result collection node (to collect the results of each parallel branch), and a parallel end node (to mark the end of parallel computation and synchronize the results). Once the design data is confirmed to be updated, the specified style rule fragments to be updated are determined based on the directed computation graph, and the update action is executed. When the design data is updated, it is not necessary to recalculate all rendering rules. Instead, the affected rendering rules are determined based on the directed computation graph, and the corresponding style rule fragments are determined based on these rendered rules. These are then used as the specified style rule fragments, and the update action is executed.

[0088] Furthermore, the design data itself, as a high-dimensional set of key-value pairs, may increase in dimensionality as system complexity increases. In this case, updating the design data might require updating a large number of specified pattern rule fragments when using directed computation graphs, thus diminishing its computational efficiency.

[0089] Based on this, if the update level of the design data is higher than the preset level, feature extraction and cluster analysis are used to determine the feature distance values ​​between the updated current design data and several preset standard design data. The update level of the design data can be determined by the number and magnitude of updated values ​​in the design data. Feature extraction can be performed by learning the low-dimensional representation of the design data through an autoencoder, thereby extracting its corresponding low-dimensional features. Cluster analysis algorithms can be used, such as K-Means algorithm and density-based noisy applied spatial clustering algorithm (DBSCAN). The preset standard design data are pre-selected, representative standard design data that can represent the relatively common or relatively standard design logic under their corresponding theme configuration.

[0090] The standard design data with the lowest feature distance value is selected as the baseline design data for the current design data. The closer the feature distance value, the closer the current design data is to the standard design data, and the closer its final presentation effect is to the standard design data. This standard design data is then used as the baseline design data, and the semantic structure result set corresponding to the standard design data is obtained.

[0091] Based on the directed computation graph, the style rule fragments to be updated in the current design data relative to the baseline design data are determined, and the update action is performed based on the semantic structure result set of the baseline design data. At this point, the design data before the update is no longer used as the comparison content; instead, more standardized and closer standard design data is selected, and the update is performed based on its corresponding semantic structure result set, thereby reducing the computational cost during the update process.

[0092] Based on the same idea, one or more embodiments of this specification also provide apparatus and devices corresponding to the above methods, such as... Figure 5 , Figure 6 As shown.

[0093] Figure 5 This specification provides a schematic diagram of the structure of a subject configuration device according to one or more embodiments, the device comprising: The rule configuration definition module 502 defines the rendering rule configuration based on the theme configuration layer, and obtains a list of rendering rules; Design data acquisition module 504 collects design data corresponding to the current theme configuration; The rendering calculation module 506 performs rendering logic calculations on the design data based on the rendering rules included in the rendering rule list, and generates a corresponding semantic structure result set. The theme rendering module 508 generates a corresponding semantic structure entity based on the semantic structure result set, which is used to perform theme rendering.

[0094] Optionally, the rule configuration definition module 502 defines the attribute rendering rule configuration for a single component and the global rendering rule configuration for multiple components based on the theme configuration layer; The global rendering rule configuration and the attribute rendering rule configuration are aggregated to obtain a rendering rule list.

[0095] Optionally, the rule configuration definition module 502 standardizes the global rendering rule configuration and the attribute rendering rule configuration, and groups them according to the configuration type to obtain multiple configuration groups; For each configuration group, conflict resolution is performed based on the corresponding configuration priority. The remaining rendering rule configurations in each configuration group are processed for format conversion and sorting to obtain a list of rendering rules.

[0096] Optionally, the design data acquisition module 504 configures each component corresponding to the current topic, determines the external attributes it receives, and its own internal state; The external attributes and the internal states are aggregated to obtain the design data corresponding to the current theme configuration.

[0097] Optionally, the design data acquisition module 504 standardizes the external attributes and the internal states; Based on the business rules corresponding to the current topic configuration, determine the first dependency relationship between the external attribute and the internal state; Based on the first dependency relationship, data cleaning is performed on the external attributes and the internal state through data type verification and business rule verification. The external attributes and internal states are formatted and sorted to obtain the corresponding design data.

[0098] Optionally, the rendering calculation module 506 traverses the rendering rules contained in the rendering rule list, and for a single rendering rule, performs rendering logic calculations based on its corresponding design data to obtain the corresponding style rule fragment. The style rule fragments corresponding to each rendering rule are combined to obtain a style rule set; Based on the predefined semantic structure, a corresponding semantic structure result set is generated according to the set of style rules.

[0099] Optionally, the rendering calculation module 506 performs grouping processing based on the scope identifier included in the style rule fragments corresponding to the rendering rules, to obtain multiple rule fragment groups; The style rule fragments contained in a single rule fragment group are grouped together, and conflict resolution is performed. By using the scope identifiers corresponding to each rule fragment group, the hierarchical relationship of each rule fragment group is determined, and the style attributes corresponding to the style rule fragments are inherited according to the hierarchical relationship. According to the hierarchical relationship, the style rule fragments are combined to obtain a style rule set.

[0100] Optionally, the apparatus method further includes a design data update module 510; The design data update module 510 extracts the second dependency relationship between each rendering rule and generates a dependency relationship matrix for the rendering rules. Nodes are obtained according to the rendering rules, and directed edges are generated according to the dependency matrix to construct a directed computation graph; The design data is determined to be updated. Based on the directed computation graph, the specified style rule fragment to be updated is determined, and the update action is performed.

[0101] Optionally, the design data update module 510 generates nodes according to the rendering rules, and classifies the nodes and defines their corresponding node attributes. Based on the dependency matrix, directed edges are generated between the nodes to construct an initial computation graph; Cyclic dependency detection is performed on the initial computation graph, and the corresponding cyclic dependency handling strategy is executed according to the detection results to obtain the intermediate computation graph; For the intermediate computation graph, priorities are assigned according to the node attributes, and execution conditions are defined for each node based on the priorities to obtain a directed computation graph. For the directed computation graph, mutually independent sub-regions are identified, and the directed computation graph is reconstructed in parallel according to the sub-computation graphs corresponding to each sub-region.

[0102] Optionally, if the update degree of the design data is higher than a preset degree, the design data update module 510 determines the feature distance value between the updated current design data and a plurality of preset standard design data through feature extraction and cluster analysis. The standard design data with the lowest feature distance value is selected as the benchmark design data for the current design data; Based on the directed computation graph, the style rule fragments to be updated in the current design data relative to the baseline design data are determined, and the update action is performed based on the semantic structure result set of the baseline design data.

[0103] Figure 6 This specification provides a schematic diagram of the structure of a subject configuration device according to one or more embodiments, the device comprising: At least one processor; and, A memory communicatively connected to the at least one processor; wherein, The memory stores instructions executable by the at least one processor, which, when executed by the at least one processor, enable the at least one processor to: Based on the theme configuration layer, the rendering rule configuration is defined to obtain a list of rendering rules; Collect the design data corresponding to the current theme configuration; Based on the rendering rules contained in the rendering rule list, the design data is subjected to rendering logic calculations to generate a corresponding semantic structure result set. Based on the semantic structure result set, a corresponding semantic structure entity is generated for performing theme rendering.

[0104] Based on the same idea, one or more embodiments of this specification also provide a non-volatile computer storage medium corresponding to the above method, storing computer-executable instructions, wherein the computer-executable instructions are configured as follows: Based on the theme configuration layer, the rendering rule configuration is defined to obtain a list of rendering rules; Collect the design data corresponding to the current theme configuration; Based on the rendering rules contained in the rendering rule list, the design data is subjected to rendering logic calculations to generate a corresponding semantic structure result set. Based on the semantic structure result set, a corresponding semantic structure entity is generated for performing theme rendering.

[0105] In the 1990s, improvements to a technology could be clearly distinguished as either hardware improvements (e.g., improvements to the circuit structure of diodes, transistors, switches, etc.) or software improvements (improvements to the methodology). However, with technological advancements, many methodological improvements today can be considered direct improvements to the hardware circuit structure. Designers almost always obtain the corresponding hardware circuit structure by programming the improved methodology into the hardware circuit. Therefore, it cannot be said that a methodological improvement cannot be implemented using hardware physical modules. For example, a Programmable Logic Device (PLD) (such as a Field Programmable Gate Array (FPGA)) is such an integrated circuit whose logic function is determined by the user programming the device. Designers can program and "integrate" a digital system onto a PLD themselves, without needing chip manufacturers to design and manufacture dedicated integrated circuit chips. Furthermore, nowadays, instead of manually manufacturing integrated circuit chips, this programming is mostly implemented using "logic compiler" software. Similar to the software compiler used in program development, the original code before compilation must also be written in a specific programming language, called a Hardware Description Language (HDL). There are many HDLs, such as ABEL (Advanced Boolean Expression Language), AHDL (Altera Hardware Description Language), Confluence, CUPL (Cornell University Programming Language), HDCal, JHDL (Java Hardware Description Language), Lava, Lola, MyHDL, PALASM, and RHDL (Ruby Hardware Description Language). Currently, the most commonly used are VHDL (Very-High-Speed ​​Integrated Circuit Hardware Description Language) and Verilog. Those skilled in the art should also understand that by simply performing some logic programming on the method flow using one of these hardware description languages ​​and programming it into an integrated circuit, the hardware circuit implementing the logical method flow can be easily obtained.

[0106] The controller can be implemented in any suitable manner. For example, it can take the form of a microprocessor or processor and a computer-readable medium storing computer-readable program code (e.g., software or firmware) executable by the (micro)processor, logic gates, switches, application-specific integrated circuits (ASICs), programmable logic controllers, and embedded microcontrollers. Examples of controllers include, but are not limited to, the following microcontrollers: ARC 625D, Atmel AT91SAM, Microchip PIC18F26K20, and Silicon Labs C8051F320. A memory controller can also be implemented as part of the control logic of the memory. Those skilled in the art will also recognize that, in addition to implementing the controller in purely computer-readable program code form, the same functionality can be achieved by logically programming the method steps to make the controller take the form of logic gates, switches, application-specific integrated circuits, programmable logic controllers, and embedded microcontrollers. Therefore, such a controller can be considered a hardware component, and the means included therein for implementing various functions can also be considered as structures within the hardware component. Alternatively, the means for implementing various functions can be considered as both software modules implementing the method and structures within the hardware component.

[0107] The systems, devices, modules, or units described in the above embodiments can be implemented by computer chips or entities, or by products with certain functions. A typical implementation device is a computer. Specifically, a computer can be, for example, a personal computer, laptop computer, cellular phone, camera phone, smartphone, personal digital assistant, media player, navigation device, email device, game console, tablet computer, wearable device, or any combination of these devices.

[0108] For ease of description, the above devices are described in terms of function, divided into various units. Of course, in implementing this specification, the functions of each unit can be implemented in one or more software and / or hardware components.

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

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

[0111] These computer program instructions may also be stored in a computer-readable storage medium that can direct a computer or other programmable data processing device to function in a particular manner, such that the instructions stored in the computer-readable storage medium produce an article of manufacture including instruction means, which are implemented in a process Figure 1 One or more processes and / or boxes Figure 1 The function specified in one or more boxes.

[0112] These computer program instructions may also be loaded onto a computer or other programmable data processing equipment to cause a series of operational steps to be performed on the computer or other programmable equipment to produce a computer-implemented process, thereby providing instructions that execute on the computer or other programmable equipment for implementing the process. Figure 1 One or more processes and / or boxes Figure 1 The steps of the function specified in one or more boxes.

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

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

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

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

[0117] This specification can be described in the general context of computer-executable instructions that are executed by a computer, such as program modules. Generally, program modules include routines, programs, objects, components, data structures, etc., that perform a specific task or implement a specific abstract data type. This specification can also be practiced in distributed computing environments, where tasks are performed by remote processing devices connected via a communication network. In distributed computing environments, program modules can reside in local and remote computer storage media, including storage devices.

[0118] The various embodiments in this specification are described in a progressive manner. Similar or identical parts between embodiments can be referred to mutually. Each embodiment focuses on describing the differences from other embodiments. In particular, the embodiments of apparatus, devices, and non-volatile computer storage media are basically similar to the method embodiments, so the descriptions are relatively simple; relevant parts can be referred to the descriptions of the method embodiments.

[0119] The foregoing has described specific embodiments of this specification. Other embodiments are within the scope of the appended claims. In some cases, the actions or steps recited in the claims may be performed in a different order than that shown in the embodiments and may still achieve the desired result. Furthermore, the processes depicted in the drawings do not necessarily require the specific or sequential order shown to achieve the desired result. In some embodiments, multitasking and parallel processing are possible or may be advantageous.

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

Claims

1. A theme configuration method, comprising: Based on the theme configuration layer, the rendering rule configuration is defined to obtain a list of rendering rules; Collect the design data corresponding to the current theme configuration; Based on the rendering rules contained in the rendering rule list, the design data is subjected to rendering logic calculations to generate a corresponding semantic structure result set. Based on the semantic structure result set, a corresponding semantic structure entity is generated for performing theme rendering.

2. The method as described in claim 1, based on the theme configuration layer, defines the rendering rule configuration to obtain a rendering rule list, specifically including: Based on the theme configuration layer, the property rendering rules for a single component and the global rendering rules for multiple components are defined. The global rendering rule configuration and the attribute rendering rule configuration are aggregated to obtain a rendering rule list.

3. The method as described in claim 2, wherein the global rendering rule configuration and the attribute rendering rule configuration are aggregated to obtain a rendering rule list, specifically including: The global rendering rule configuration and the attribute rendering rule configuration are standardized and grouped according to configuration type to obtain multiple configuration groups; For each configuration group, conflict resolution is performed based on the corresponding configuration priority. The remaining rendering rule configurations in each configuration group are processed for format conversion and sorting to obtain a list of rendering rules.

4. The method as described in claim 1, specifically including: collecting design data corresponding to the current theme configuration, includes: Configure each component corresponding to the current theme, determine the external attributes it receives, and its own internal state; The external attributes and the internal states are aggregated to obtain the design data corresponding to the current theme configuration.

5. The method as described in claim 4, wherein the external attributes and the internal state are aggregated to obtain the design data corresponding to the current theme configuration, specifically includes: The external attributes and the internal states are standardized. Based on the business rules corresponding to the current topic configuration, determine the first dependency relationship between the external attribute and the internal state; Based on the first dependency relationship, data cleaning is performed on the external attributes and the internal state through data type verification and business rule verification. The external attributes and internal states are formatted and sorted to obtain the corresponding design data.

6. The method as described in claim 1, wherein rendering logic calculations are performed on the design data based on the rendering rules included in the rendering rule list to generate a corresponding semantic structure result set, specifically including: Iterate through the rendering rules in the rendering rule list, and for each individual rendering rule, perform rendering logic calculations based on its corresponding design data to obtain the corresponding style rule fragment. The style rule fragments corresponding to each rendering rule are combined to obtain a style rule set; Based on the predefined semantic structure, a corresponding semantic structure result set is generated according to the set of style rules.

7. The method as described in claim 6, wherein the style rule fragments corresponding to each rendering rule are combined to obtain a style rule set, specifically including: Grouping is performed based on the scope identifiers included in the style rule fragments corresponding to the rendering rules, resulting in multiple rule fragment groups; The style rule fragments contained in a single rule fragment group are grouped together, and conflict resolution is performed. By using the scope identifiers corresponding to each rule fragment group, the hierarchical relationship of each rule fragment group is determined, and the style attributes corresponding to the style rule fragments are inherited according to the hierarchical relationship. According to the hierarchical relationship, the style rule fragments are combined to obtain a style rule set.

8. The method of claim 6, further comprising: For the aforementioned rendering rules, the second dependency relationship between each rendering rule is extracted, and a dependency relationship matrix is ​​generated; Nodes are obtained according to the rendering rules, and directed edges are generated according to the dependency matrix to construct a directed computation graph; The design data is determined to be updated. Based on the directed computation graph, the specified style rule fragment to be updated is determined, and the update action is performed.

9. The method as described in claim 8, wherein nodes are obtained according to the rendering rules, and directed edges are generated according to the dependency matrix to construct a directed computation graph, specifically including: Nodes are generated according to the rendering rules, and the nodes are classified and their corresponding node attributes are defined. Based on the dependency matrix, directed edges are generated between the nodes to construct an initial computation graph; Cyclic dependency detection is performed on the initial computation graph, and the corresponding cyclic dependency handling strategy is executed according to the detection results to obtain the intermediate computation graph; For the intermediate computation graph, priorities are assigned according to the node attributes, and execution conditions are defined for each node based on the priorities to obtain a directed computation graph. For the directed computation graph, mutually independent sub-regions are identified, and the directed computation graph is reconstructed in parallel according to the sub-computation graphs corresponding to each sub-region.

10. The method of claim 8, wherein the specified style rule fragment to be updated is determined according to the directed computation graph, and the update action is performed, specifically includes: If the update level of the design data is higher than the preset level, then feature distance values ​​between the updated current design data and multiple preset standard design data are determined through feature extraction and cluster analysis. The standard design data with the lowest feature distance value is selected as the benchmark design data for the current design data; Based on the directed computation graph, the style rule fragments to be updated in the current design data relative to the baseline design data are determined, and the update action is performed based on the semantic structure result set of the baseline design data.

11. A theme configuration device, comprising: The rule configuration definition module, based on the theme configuration layer, defines the rendering rule configuration and obtains a list of rendering rules; The design data acquisition module collects design data corresponding to the current theme configuration. The rendering calculation module performs rendering logic calculations on the design data based on the rendering rules included in the rendering rule list, and generates a corresponding semantic structure result set. The theme rendering module generates corresponding semantic structure entities based on the semantic structure result set, which are used to perform theme rendering.

12. The apparatus of claim 11, wherein the rule configuration definition module defines, based on the theme configuration layer, the attribute rendering rule configuration corresponding to a single component and the global rendering rule configuration corresponding to multiple components; The global rendering rule configuration and the attribute rendering rule configuration are aggregated to obtain a rendering rule list.

13. The apparatus of claim 12, wherein the rule configuration definition module standardizes the global rendering rule configuration and the attribute rendering rule configuration, and groups them according to the configuration type to obtain multiple configuration groups; For each configuration group, conflict resolution is performed based on the corresponding configuration priority. The remaining rendering rule configurations in each configuration group are processed for format conversion and sorting to obtain a list of rendering rules.

14. The apparatus of claim 11, wherein the design data acquisition module configures each component corresponding to the current topic, determines the external attributes it receives, and its own internal state; The external attributes and the internal states are aggregated to obtain the design data corresponding to the current theme configuration.

15. The apparatus of claim 14, wherein the design data acquisition module performs standardized processing on the external attributes and the internal state; Based on the business rules corresponding to the current topic configuration, determine the first dependency relationship between the external attribute and the internal state; Based on the first dependency relationship, data cleaning is performed on the external attributes and the internal state through data type verification and business rule verification. The external attributes and internal states are formatted and sorted to obtain the corresponding design data.

16. The apparatus of claim 11, wherein the rendering calculation module traverses the rendering rules contained in the rendering rule list, and for a single rendering rule, performs rendering logic calculations based on its corresponding design data to obtain the corresponding style rule fragment; The style rule fragments corresponding to each rendering rule are combined to obtain a style rule set; Based on the predefined semantic structure, a corresponding semantic structure result set is generated according to the set of style rules.

17. The apparatus of claim 16, wherein the rendering calculation module performs grouping processing based on the scope identifier included in the style rule fragments corresponding to the rendering rules, to obtain multiple rule fragment groups; The style rule fragments contained in a single rule fragment group are grouped together, and conflict resolution is performed. By using the scope identifiers corresponding to each rule fragment group, the hierarchical relationship of each rule fragment group is determined, and the style attributes corresponding to the style rule fragments are inherited according to the hierarchical relationship. According to the hierarchical relationship, the style rule fragments are combined to obtain a style rule set.

18. The apparatus of claim 16, wherein the apparatus method further comprises a design data update module; The design data update module extracts the second dependency relationship between each rendering rule and generates a dependency relationship matrix for the rendering rules. Nodes are obtained according to the rendering rules, and directed edges are generated according to the dependency matrix to construct a directed computation graph; The design data is determined to be updated. Based on the directed computation graph, the specified style rule fragment to be updated is determined, and the update action is performed.

19. The apparatus of claim 18, wherein the design data update module generates nodes according to the rendering rules, and classifies the nodes and defines their corresponding node attributes; Based on the dependency matrix, directed edges are generated between the nodes to construct an initial computation graph; Cyclic dependency detection is performed on the initial computation graph, and the corresponding cyclic dependency handling strategy is executed according to the detection results to obtain the intermediate computation graph; For the intermediate computation graph, priorities are assigned according to the node attributes, and execution conditions are defined for each node based on the priorities to obtain a directed computation graph. For the directed computation graph, mutually independent sub-regions are identified, and the directed computation graph is reconstructed in parallel according to the sub-computation graphs corresponding to each sub-region.

20. The apparatus of claim 18, wherein if the degree of update of the design data is higher than a preset degree, the design data update module determines the feature distance value between the updated current design data and a plurality of preset standard design data through feature extraction and cluster analysis; The standard design data with the lowest feature distance value is selected as the benchmark design data for the current design data; Based on the directed computation graph, the style rule fragments to be updated in the current design data relative to the baseline design data are determined, and the update action is performed based on the semantic structure result set of the baseline design data.

21. A theme configuration device, comprising: At least one processor; as well as, A memory communicatively connected to the at least one processor; wherein, The memory stores instructions executable by the at least one processor, which, when executed by the at least one processor, enable the at least one processor to: Based on the theme configuration layer, the rendering rule configuration is defined to obtain a list of rendering rules; Collect the design data corresponding to the current theme configuration; Based on the rendering rules contained in the rendering rule list, the design data is subjected to rendering logic calculations to generate a corresponding semantic structure result set. Based on the semantic structure result set, a corresponding semantic structure entity is generated for performing theme rendering.

Images