> ## Documentation Index
> Fetch the complete documentation index at: https://www.mintlify.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Los componentes personalizados parpadean o no aparecen en el código fuente de la página

> Los componentes de React personalizados en Mintlify se renderizan en el navegador después de que se carga la página, por lo que no están en el HTML inicial. Usa componentes integrados para el contenido que debe renderizarse en el servidor.

Si un componente de React que escribiste tú mismo aparece un momento después de que se carga el resto de una página de Mintlify, o su contenido falta cuando ves el código fuente de la página, este es el comportamiento esperado. Mintlify renderiza los componentes personalizados solo en el navegador.

<div id="why-custom-components-are-not-in-the-initial-html">
  ## Por qué los componentes personalizados no están en el HTML inicial
</div>

Los componentes personalizados se ejecutan solo en el navegador. El HTML renderizado en el servidor omite los componentes que defines con `export` en un archivo MDX y los componentes que importas por nombre desde un snippet, como `import { MyComponent } from "/snippets/my-component.jsx"`. Después de que se carga la página, el navegador renderiza esos componentes en su lugar.

Los snippets MDX que importas como contenido, como `import MySnippet from "/snippets/my-snippet.mdx"`, se renderizan en el servidor como el resto de la página.

Como resultado:

* El código fuente de la página y el HTML inicial no incluyen el contenido del componente.
* Los visitantes pueden ver que el componente aparece de repente o desplaza el diseño después de que se muestra el resto de la página.
* Es posible que los motores de búsqueda no indexen completamente el contenido del componente.

<div id="use-built-in-components-for-content-that-must-render-on-the-server">
  ## Usa componentes integrados para el contenido que debe renderizarse en el servidor
</div>

La mayoría de los [componentes integrados](/docs/es/components), incluidos los que se indican a continuación, se renderizan en el servidor y aparecen en el HTML inicial. Si usas un componente personalizado para diseño o contenido estático, reemplázalo por un componente integrado o un [snippet MDX](/docs/es/create/reusable-snippets). Por ejemplo:

* Usa [tarjetas](/docs/es/components/cards) y [columnas](/docs/es/components/columns) para cuadrículas de enlaces o funcionalidades.
* Usa [pestañas](/docs/es/components/tabs), [acordeones](/docs/es/components/accordions) y [pasos](/docs/es/components/steps) para organizar el contenido.
* Usa [avisos](/docs/es/components/callouts) para destacar información.

Reserva los componentes personalizados para elementos interactivos que necesitan estado o API del navegador. Consulta [Componentes de React](/docs/es/customize/react-components) para saber cómo crearlos y conocer otras consideraciones.


## Related topics

- [Vista general de automatizaciones](/docs/es/automations/index.md)
- [React](/docs/es/customize/react-components.md)
- [Páginas](/docs/es/organize/pages.md)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.