> For the complete documentation index, see [llms.txt](https://docs.avonnicomponents.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.avonnicomponents.com/lwc-components/getting-started/the-maintenance-advantage.md).

# The Maintenance Advantage

Why building on packaged components beats from-scratch code, whether a human or an AI writes it.

There are two ways to get a data table with sorting and inline editing into Salesforce. Write it from scratch, by hand or with an AI assistant, and own every line. Or write about 30 lines of markup on top of a packaged component. **Both look identical in the demo. They age very differently.**

{% hint style="info" %}

#### LWC Components vs. building from scratch

The written comparison is [LWC Components vs. building from scratch](https://www.avonni.app/product/lwc-components-vs-building-from-scratch), and the [Salesforce LWC cost calculator](https://www.avonni.app/product/lwc-cost-calculator) puts a number on owning the code yourself.
{% endhint %}

## Side by side

|                                              | 🛠️ From-scratch code                         | ✨ Built on Avonni LWC                         |
| -------------------------------------------- | --------------------------------------------- | --------------------------------------------- |
| A data table with sorting and inline editing | Hundreds to thousands of lines of custom code | About 30 lines of markup and configuration    |
| Where the complexity lives                   | In your codebase                              | In the managed package                        |
| Who maintains it                             | You                                           | Avonni, with every release                    |
| When Salesforce updates                      | Re-test and patch your custom code            | Update the package; your markup keeps working |
| Evolving it later                            | Dig through the old code first                | Change a few attributes                       |

***

## A thin layer on a deep layer

Every interface splits into two layers. The **deep layer** is the hard part: rendering, sorting, drag-and-drop, accessibility, keyboard navigation, edge cases. The **thin layer** is what makes it yours: which fields, which query, which actions, which colors.

From-scratch code makes you own both layers. Building on this library, you only own the thin one:

<table><thead><tr><th width="260"></th><th></th></tr></thead><tbody><tr><td>🛡️ <strong>The deep layer is ours</strong></td><td>The machinery lives inside the packaged <code>avonni-*</code> components: tested, versioned, and updated by Avonni with every release. You never debug it, and you never re-test it when Salesforce changes.</td></tr><tr><td>✍️ <strong>The thin layer is yours</strong></td><td>What lands in your component stays small enough to read in one sitting. Small code is easy to review, easy to hand over, and easy to change six months later.</td></tr></tbody></table>

***

## It compounds with AI

AI assistants multiply how fast code gets written. The real question is **what** they write. Pointed at a blank file, an assistant multiplies from-scratch code, and with it your maintenance debt. Pointed at this library, it multiplies configuration: the same speed, without the ownership cost. Small, declarative markup is also what assistants update most reliably later.

{% hint style="success" %}
The library ships an **MCP server** and an **agent skill** so Claude Code, Cursor, and GitHub Copilot write `avonni-*` markup from the real component catalog. Setup takes minutes.

<a href="/lwc-components/build-with-ai/overview.md" class="button secondary" data-icon="wand-magic-sparkles">Discover Build with AI</a>
{% endhint %}

***

## Where to see it

The 15 Data Driven Components are where the contrast is starkest: data table, kanban, scheduler, pivot table, timeline, tree, map, and more, each replacing what would otherwise be a serious custom build. The 46 Core Components do the same for the building blocks around them.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

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

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.avonnicomponents.com/lwc-components/getting-started/the-maintenance-advantage.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

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.