Island Architecture

y Astro

Stiven Castillo

@stivencastillo_

Once upon a time

historia

http://site.com/home.html

http://site.com/about.html

Sinple Page Application

SPA

Es una aplicación web ó un sitio web que cabe en una sola página con el propósito de dar una experiencia más fluida a los usuarios, como si fuera una aplicación de escritorio.

Server Side Rendering

SSR

Es una técnica que se basa en la posibilidad de poder renderizar el HTML de nuestros componentes en cadenas de texto en la parte servidor y no en tiempo de ejecución

Lazy Loading

Island Architecture

Arquitectura basada en islas

Search input

Menu

carousel

Banner

Filter

Products

Viewport

Pros

• El JS enviado al cliente solo contiene lo necesario
• Performance
• SEO, al igual que el SSR, todo el contenido que se envia al cliente es estático y es good pa'l SEO.
• Se prioriza contenido importante
• Basado en componentes, como cualquier framework js moderno.
• Podría usar cualquier librería js para los componentes.

Cons

• Concepto relativamente nuevo
• No es adecuada para páginas altamente interactivas como redes sociales.
• Implementación en sistemas existentes

Astro

Astro es un constructor de sitios estáticos capaz de generar páginas HTML estáticas ligeras utilizando componentes de interfaz de usuario construidos en otros frameworks como React, Preact, Svelte, Vue y otros.

Caracteristicas

• Basado en islas de componentes
• Server-first API design
• Cero JS, por defecto
• Preparado para el cualquier entorno
• Personalizable
• Agnóstico para la interfaz de usuario

Basado en MPA

Multi Page Application

Let's code

Conclusiones