# Dynamic vs. Flow Components

Avonni offers two no-code solutions to customize Salesforce UIs. Both build great experiences without code, but they're designed for different places. This guide helps you pick the right one.

***

## The Fundamental Difference: Where Will You Build?

Choosing between the two products comes down to one question: **where** are you building your UI?

### Are You Customizing *Directly* on a Salesforce Lightning Page?

📄 **Use Case:** You're in the Lightning App Builder, creating custom sections, layouts, or interfaces on App Pages, Record Pages, or Home Pages.

🎯 **Your Goal:** Build reusable UI elements, dashboards, record views, or data visualizations that live *on the page itself* — outside of any Flow process.

✅ **Then Choose:** [**Avonni Dynamic Components**](/dynamic-components/welcome.md)

> Optimized for performance, reusability across multiple pages, and native reactivity directly within the Lightning Page environment.

### Are You Customizing Screens *Inside* a Salesforce Flow?

📄 **Use Case:** You're in Flow Builder, creating a guided multi-step process, a wizard, an approval workflow, or any task that navigates through screens.

🎯 **Your Goal:** Enhance the visual appearance and interactivity of screens *presented during that Flow*.

✅ **Then Choose:** [**Avonni Components for Flows**](https://app.gitbook.com/s/1FUd4apB9YHgCEMUFbVb/)

> Designed to integrate seamlessly with Flow Builder, leveraging Flow variables and logic within the Flow runtime.

{% hint style="info" %}

#### In Short

If your work is *inside Flow Builder*, use **Components for Flows**. If your work is *on a Lightning Page*, use **Dynamic Components**
{% endhint %}

***

## Dynamic Components: Key Strengths

| Strength                            | Description                                          |
| ----------------------------------- | ---------------------------------------------------- |
| **📄 Lightning Page Customization** | Build unique App, Record, & Home Pages               |
| **♻️ Reusable**                     | Build once, deploy across many pages                 |
| **⚡ Performance**                   | Optimized for fast loading directly on pages         |
| **🔗 Native Reactivity**            | Components update automatically — no formulas needed |
| **🎨 Full Layout & Style Control**  | Design complex interfaces visually                   |
| **📊 Data Visualization**           | Ideal for dashboards, charts, interactive tables     |

***

## Components for Flows: Key Strengths

| Strength                  | Description                                        |
| ------------------------- | -------------------------------------------------- |
| ➡️ Guided Processes       | Perfect for multi-step wizards and forms           |
| 📝 Enhanced Flow Screens  | Make your Flow interactions visually appealing     |
| 🤖 Flow Logic Integration | Works seamlessly with Flow variables and decisions |
| ✅ Structured Data Input   | Great for controlled data entry steps              |

***

## At a Glance: Quick Comparison

| Feature         | Dynamic Components (Pages) | Components for Flows   |
| --------------- | -------------------------- | ---------------------- |
| **Environment** | Lightning App Builder      | Flow Builder           |
| **Reusability** | High (Across Pages)        | Low (Single Flow)      |
| **Reactivity**  | Native / Visual            | Formulas / Variables   |
| **Performance** | Optimized for Pages        | Optimized within Flow  |
| **Layout**      | Full Control               | Limited by Flow Screen |

***

## Using Them Together: Best of Both Worlds

You *can* — and should — combine them!

**Launch Flows from Pages:** Use an Avonni Dynamic Component on a Lightning Page to trigger a Flow (via "Open Flow Dialog/Panel" or "Execute Flow" interactions).

This gives you the custom UI and performance of Dynamic Components *plus* the process automation power of Flows.

***

## ⚠️ A Common Mistake: Building Full Apps in Flow Screens

One of the most frequent mistakes we see is using Flow Screen Components to build entire application pages — dashboards, multi-tab record views, or data-heavy layouts — instead of guided processes.

Flow Screens work well for wizards, intake forms, and approval workflows. They were **not designed to be the layout engine for a full page**.

{% hint style="warning" %}

#### **What happens when you try**

**Performance degrades.** Every component on a Flow Screen loads within the Flow runtime, adding overhead that isn't present on a Lightning Page.

**You lose reusability.** A Dynamic Component built once can be dropped onto any page. A Flow Screen layout is locked to that specific Flow.

**Maintenance gets painful.** Flow Screens don't support the same reactivity. You end up writing formulas and decision elements that Dynamic Components handle automatically.

**The real cost is time.** Teams typically realize the problem 3–6 months in, after significant effort. Rebuilding at that point means redoing work that could have been avoided.
{% endhint %}

### When Flow Screens Are the Right Choice

Flow Screens are the right tool when your users are following a **defined path**:

* Multi-step wizards (case intake, employee onboarding, quote generation)
* Approval workflows with user input at specific stages
* Guided data entry where the next screen depends on previous answers
* Quick actions that collect a few fields and run automation

{% hint style="info" %}

#### **Rule of thumb**

If your screen doesn't have a "Next" button and users aren't moving through steps, you probably want Dynamic Components instead
{% endhint %}

### The Best Pattern: Use Both Together

Most Salesforce orgs benefit from installing both packages:

1. **Build your page layouts** (dashboards, record pages, app pages) → **Dynamic Components**
2. **Trigger Flows from those pages** → "Open Flow Dialog" or "Open Flow Panel" interactions
3. **Build the guided process** (wizard, form, approval step) → **Flow Screen Components**

Each product does what it was designed for. Pages load fast, layouts are reusable, guided processes stay clean.

***

## Do I Need to Install Both Packages?

Yes, in most cases. They are separate packages on the AppExchange, each with its own license.

| You need to...                           | Install this         |
| ---------------------------------------- | -------------------- |
| **Build custom Lightning Pages**         | Dynamic Components   |
| **Enhance Flow Screens**                 | Components for Flows |
| **Build pages AND run guided processes** | Both                 |

{% hint style="success" %}

#### Tip

There is **no conflict** between the two packages. They coexist without issues and share the same Component Builder interface
{% endhint %}

***

## Conclusion

Choose based on **WHERE** you need the custom UI:

* Need to enhance **Lightning Pages**? → **Dynamic Components**
* Need to improve screens **inside a Flow**? → **Components for Flows**
* Need both? → **Install both** and let each product do what it does best


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.avonnicomponents.com/dynamic-components/getting-started/dynamic-vs.-flow-components.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.