EssentiaRoot
EssentiaRoot es el componente raíz. Monta el canvas y orquesta la cámara, la captura de fondo, la interactividad y el entorno. Todo lo que dibuja Essentia va adentro.
Uso
<script>
import { EssentiaRoot } from 'essentia-core'
</script>
<EssentiaRoot background="#ffffff">
<!-- primitivas visuales y layout -->
</EssentiaRoot>background se aplica a la escena, para que la captura lo vea y un Glass lo refracte. antialias arranca apagado: el antialiasing es del SDF y del MSDF de cada primitiva, y el MSAA cuesta entre un 35 y un 45 % del frame a DPR 2.
Referencia de props
| Prop | Tipo | Default | Descripción |
|---|---|---|---|
class | string | — | |
style | string | — | |
background | string | '#000000' | Color de fondo de la escena (CSS hex o nombre). Se aplica a scene.background para que BackgroundCapture lo capture y Glass lo refracte correctamente. |
envMap | Texture | null | — | Textura de entorno (equirectangular) ya construida. Tiene precedencia sobre environment si ambos se proveen. |
environment | EnvironmentOptions | null | — | Configuración para cargar el environment map automáticamente con <Environment/>. Se ignora si envMap está presente. |
light | Partial<Light> | { direction: [-0.4, 0.7, 0.6], intensity: 1 } | Luz direccional global que comparten todas las primitivas que iluminan (specular y rim del <Glass>). Los campos que faltan toman el default. |
quality | Quality | 'medium' | Calidad por defecto de las primitivas que la heredan: el <Glass> sin prop quality usa esta. 'low' recorta la dispersión, 'high' suma taps al blur. |
maxDpr | number | 2 | Tope del device pixel ratio del canvas y de los render targets (la captura de fondo, la pirámide de blur). En pantallas DPR 3, con 2 se renderiza ~55 % menos de píxeles; Infinity usa el DPR nativo. engine.viewport.dpr refleja el valor efectivo. |
antialias | boolean | false | MSAA del canvas (antialias del WebGLRenderer). Essentia no lo necesita: las primitivas dibujan su forma con un SDF y el texto con MSDF, así que el antialiasing es analítico y el MSAA solo suaviza los bordes geométricos de los quads, que son transparentes. Apagado ahorra un 35–45 % del frame a DPR 2 (resolver y guardar 4 muestras por píxel en cada pasada). Prendelo si dibujás meshes propios con bordes duros (<T.Mesh> sin SDF). |
loading | Snippet | — | Snippet de fallback (3D) que se renderiza dentro del Canvas mientras cualquier descendiente está cargando recursos asíncronos (texturas vía <Image/>, environment maps, etc.). Si está presente, los children se envuelven en <Suspense> y este snippet sustituye el contenido durante la carga. Si no se provee, no hay orquestación de Suspense — los componentes aparecen apenas su recurso propio termina de cargar (sin coordinación global). |
children | Snippet | — | |
ui | Snippet | — |