In low-code or extensible front-end development, developers often need to choose between "custom components" and "custom plugins." This article analyzes the two from the perspectives of definition, applicable scenarios, development cost, and maintenance, helping teams make a reasonable choice.

1. Definitions and Characteristics

Type	Definition	Core Characteristics
Custom Component	A reusable front-end UI component that can be directly dragged into or called on a page	- Can render UI directly - Can compose other components - Closely tied to page state
Custom Plugin	A module that extends platform capabilities or business logic and can be triggered in specific scenarios	- Usually does not render UI directly - Primarily handles logic or events - Can be shared by multiple components or pages

2. Applicable Scenarios

Custom Components

• Functional modules that require visual presentation, such as form controls, lists, and charts
• Complex and reusable UI used in multiple scenarios
• Scenarios that need to respond to user interaction and dynamically update page state

Custom Plugins

• Capability extension or business logic processing, such as data validation, permission checks, and external API calls
• Functions that are independent and do not rely on a specific page layout
• Functions that can be reused across multiple components or processes when conditions allow

3. Development and Maintenance Costs

Type	Development Cost	Maintenance Cost
Custom Component	Medium to high: involves UI, interaction, and state management	Medium: UI changes require synchronized updates to pages using the component
Custom Plugin	Low to medium: mainly focused on logic implementation	Low: logic is independent and changes have limited impact

4. Selection Recommendations

1. Presentation-focused -> Component
   If the core requirement is visual display, user interaction, or page layout, prefer a custom component.

2. Logic-focused -> Plugin
   If the core requirement is data processing, business logic, or function reuse, prefer a custom plugin.

3. Combined scenarios
   When both UI and logic are important, package the logic as a plugin and the UI as a component. Then let components and plugins call each other to achieve reuse and decoupling.
   Avoid writing large amounts of business logic directly inside components, which increases maintenance cost.

5. Summary

• Custom Components: Best for functionality closely related to UI and interaction, with a focus on presentation and state
• Custom Plugins: Best for independent logic and capability extension, with a focus on reuse and decoupling
• Best practice: Separate UI from logic. Let components call plugins to achieve flexible reuse and maintainability

Next Steps

• For UI extension: see the Component Guide
• For scenario extension: see the Plugin Guide
• For capability invocation: see the API Overview
• Mobile component reference: Mobile Component Reference
• Web component reference: Web Component Reference
• Mobile plugin reference: Mobile Plugin Reference
• Web plugin reference: Web Plugin Reference
• Mobile API: Mobile API
• Web API: Web API