wandres.dev
POR QUÉ SOLID · grano fino vs VDOM

Cuándo elegir Solid y cuándo NO

Los casos donde Solid brilla y los casos donde React, Svelte o Astro encajan mejor: un árbol de decisión honesto para elegir con criterio de arquitecto, no por moda.

⏱ 13 min

Ningún framework es la respuesta correcta a todo, y presentarlo así es hacerle un flaco favor. Solid es excepcional en un conjunto concreto de problemas y una elección discutible en otros. Esta lección cierra el nivel con la pregunta que de verdad importa: dadas tus restricciones —equipo, plataforma, tipo de app—, ¿es Solid la herramienta acertada, o lo es React, Svelte o Astro? Decidir con criterio vale más que cualquier benchmark, y ese criterio —no la lista de features— es lo que separa a un ingeniero de un coleccionista de frameworks.

🎯 Al terminar esta lección sabrás
  • Reconocer los casos donde Solid es la mejor opción.
  • Reconocer los casos donde otra herramienta encaja mejor.
  • Aplicar un árbol de decisión guiado por restricciones.
  • Ver a Solid como una opción entre varias, no como una religión.

Donde Solid brilla

Solid rinde al máximo cuando la interfaz es intensamente interactiva y el rendimiento del render importa de verdad. Su grano fino convierte en trivial lo que en otros modelos exige optimización constante.

📊

UI en tiempo real

Dashboards, tablas vivas, editores, visualizaciones: miles de nodos que cambian de forma independiente y frecuente.

🪶

Bundle mínimo

Cuando cada kilobyte cuenta —móvil, mercados con red lenta, widgets embebidos— el runtime diminuto marca diferencia.

🎛️

Estado complejo y granular

Muchos fragmentos de estado que se actualizan por separado; los stores de grano fino escalan sin memoización manual.

🧠

Equipos que quieren claridad

Grupos hartos de closures obsoletas y arrays de dependencias, que valoran un modelo predecible y directo.

La regla práctica: cuanto más cambie tu UI por segundo y más nodos independientes tenga, más se inclina la balanza hacia Solid. Una lista de mil filas donde cada celda tiene su propio valor es su terreno ideal, porque cambiar una celda toca un único nodo.

// Cada celda atada a su dato: actualizar una no recorre las otras 999.
<For each={filas()}>
  {(fila) => <Celda valor={fila.precio} />}
</For>

El reverso también es cierto y conviene decirlo en voz alta: si tu “lista de mil filas” en realidad tiene veinte y cambia dos veces por minuto, esa ventaja no la va a notar nadie. Solid brilla cuando el rendimiento del render es un problema real y medible; inventarse uno para justificar la elección es tan poco riguroso como ignorarlo cuando de verdad existe.

Donde otra herramienta encaja mejor

La honestidad exige lo contrario: hay contextos donde elegir Solid sería remar contracorriente, y otra herramienta te dará más por menos.

📱

Móvil nativo → React

Si necesitas iOS y Android nativos con una sola base, React Native no tiene equivalente maduro en Solid.

👥

Escala de contratación → React

Cuando el factor decisivo es contratar rápido y encontrar talento y librerías para todo, el ecosistema de React pesa más que el rendimiento.

📄

Sitio de contenido → Astro

Blogs, documentación, marketing: mayormente estático con islas de interactividad. Astro sirve HTML sin JavaScript por defecto.

🧡

DX de compilador → Svelte

Si buscas la mínima sintaxis y no te atan al modelo de signals-como-funciones, Svelte 5 con runes ofrece grano fino con otra ergonomía.

Fíjate en el patrón: en tres de los cuatro casos, lo que decide no es una carencia técnica de Solid, sino el contexto —una plataforma (móvil), un recurso (talento disponible) o la naturaleza del proyecto (contenido)—. Solid pierde esas comparaciones por razones ajenas a su calidad como framework, y reconocerlo es justo lo contrario de descartarlo: es la condición para usarlo donde de verdad rinde.

Un vistazo comparativo antes del árbol de decisión; cada fila responde a una restricción distinta, no a un ranking absoluto de “mejor a peor”.

Herramienta Punto fuerte Elígela cuando
Solid Grano fino y runtime mínimo La UI es intensa y el render pesa
React Ecosistema y React Native Necesitas escala de talento o móvil nativo
Svelte 5 DX de compilador con runes Quieres mínima sintaxis y grano fino
Astro HTML por defecto e islas El proyecto es mayormente contenido

El árbol de decisión

La elección no se hace por preferencia estética, sino recorriendo restricciones de arriba abajo. Este árbol resume el criterio.

flowchart TD
A[Cuanta interactividad necesito] -->|poca, es contenido| ASTRO[Astro con islas]
A -->|mucha| B[Necesito movil nativo]
B -->|si| REACT[React y React Native]
B -->|no| C[El rendimiento del render es critico]
C -->|si| D[Prefiero signals explicitos]
D -->|si| SOLID[Solid]
D -->|no| SVELTE[Svelte 5]
C -->|no| E[El ecosistema o el equipo mandan]
E -->|si| REACT
E -->|no| SOLID
style ASTRO fill:#fab387,color:#11111b
style REACT fill:#89b4fa,color:#11111b
style SVELTE fill:#f38ba8,color:#11111b
style SOLID fill:#a6e3a1,color:#11111b

Léelo como una conversación con tus restricciones, no como una sentencia. La mayoría de proyectos reales tienen una restricción dominante —una plataforma obligada, un equipo con experiencia previa, un presupuesto de bytes— y esa restricción suele decidir más que cualquier diferencia de rendimiento en abstracto.

Conviven mejor de lo que parece

Presentar la elección como una guerra es un error de bulto: en 2026 estas herramientas se combinan con naturalidad. Astro puede hospedar islas de Solid y de React en la misma página; puedes incrustar un componente Solid en una app existente con una sola llamada a render; y el propio ecosistema converge, porque Svelte 5 adoptó reactividad de grano fino con sus runes y la propuesta de signals de TC39 empuja ese modelo hacia el estándar del lenguaje.

import { render } from "solid-js/web";
import Widget from "./Widget";

// Montar una isla de Solid dentro de cualquier pagina, sin tocar el resto.
render(() => <Widget />, document.getElementById("panel"));

Esto habilita una estrategia realista y a menudo la más sensata: adoptar Solid por incrementos. No hace falta reescribir una aplicación entera para aprovechar su rendimiento donde más duele —la tabla que se congela, el editor que va a tirones, el gráfico que se repinta sesenta veces por segundo—. Aíslas ese fragmento crítico en una isla Solid, mides la diferencia, y dejas el resto del sistema exactamente como estaba. La decisión “Solid o no” rara vez es total: casi siempre es “¿dónde, dentro de este sistema, paga Solid su coste de aprendizaje?”.

📝
La frontera se difumina

La divisoria clásica entre virtual DOM y grano fino se está borrando: Svelte 5, Vue con su modo Vapor y los signals de Angular avanzan hacia el mismo modelo que Solid popularizó. Elegir hoy es menos una apuesta a ciegas sobre qué paradigma ganará y más decidir quién ejecuta mejor una idea que ya ganó el debate técnico. Solid es, para muchos, la expresión más pura de ese modelo.

En la práctica, esto convierte “qué framework elijo” en una pregunta menos dramática de lo que parece en los debates online. Rara vez apuestas el proyecto entero a una carta: eliges un default para el grueso de la aplicación y te reservas el derecho de meter una isla de otra tecnología donde tenga sentido. La pregunta madura no es cuál gana en abstracto, sino con cuál pierdes menos cuando te equivocas.

⚠️
El coste de oportunidad es real

Elegir Solid en un equipo que solo sabe React tiene un coste: curva de aprendizaje, menos respuestas en foros, alguna librería que tendrás que envolver tú. Ese coste puede valer la pena de sobra por el rendimiento y la claridad, pero cuéntalo en la decisión en vez de descubrirlo a mitad del proyecto.

Elige por restricciones, no por hype

La madurez técnica no es saber qué framework es mejor, sino saber que la pregunta está mal planteada. Mejor ¿para qué, con qué equipo, bajo qué restricciones? Solid tiene una tesis fuerte y coherente —reactividad de grano fino, sin virtual DOM, runtime mínimo— y cuando tu problema encaja con esa tesis, es difícil de superar: rendimiento casi de DOM manual con la ergonomía de un framework moderno. Pero un framework no compensa un equipo que no lo domina, ni una plataforma que no lo soporta, ni un proyecto que en realidad era un sitio estático. La decisión de arquitecto no consiste en enamorarse de una herramienta, sino en cartografiar tus restricciones con honestidad y escoger la que menos fricción genera contra ellas. A veces esa herramienta es Solid; a veces es React, Svelte o Astro. Reconocer cuándo NO es Solid demuestra que lo entiendes de verdad — y ese criterio es lo que separa a quien colecciona frameworks de quien construye software que dura.

⚔️ Decide un caso real
  1. Elige un proyecto que conozcas y escribe su restricción dominante: plataforma, equipo o presupuesto de bytes.
  2. Recorre el árbol de decisión con esa restricción por delante y anota dónde acabas.
  3. Argumenta en tres frases por qué Solid sería o no la elección, sin mencionar la palabra “rápido”.
  4. Repite el ejercicio invirtiendo una restricción y observa cómo cambia la respuesta.
  5. Formula en una frase qué restricción tendría que cambiar para invertir tu veredicto; si no encuentras ninguna, tu decisión es sólida.