Astro

You possibly can’t even take a look at code or documentation for Astro (publicly) but — it’s an in-progress concept — however you’ll be able to watch a video of Fred displaying it off to Feross.

I gotta admit: it seems superior. I’m bullish on two main components of this:

Jamstack is a good suggestion. Producing static, pre-rendered, minimal (or no) JavaScript pages is sensible. Elements are a good suggestion. Crafting interfaces from composable elements is the proper abstraction. JavaScript does it greatest proper now due to issues like ES Modules, template literals, net elements, deeply developed tooling, and many others.

I’m a fan of Eleventy additionally, and this appears like Eleventy in a method, besides that I don’t like all of the templating languages as a lot as I like JavaScript elements.

Right here’s a listing of some fascinating facets:

Like Vue has .vue information and Svelte has .svelte information, Astro has .astro information in a singular format. I like the way it enforces JavaScript-at-the-top in a Frontmatter-like format.It doesn’t change different JavaScript libraries. It’s like a site-builder framework on prime of them. You possibly can actually use React and JSX elements, or Vue information, or Svelte information, together with utilizing that library’s state administration options. You import them in your Astro information.It has the-filesystem-is-the-default-router, like Subsequent.It has scoped-CSS-by-default like Vue’s <model scoped>, that means it doesn’t even want CSS Modules because you get all of the profit anyway.It ships no JavaScript to the front-end in any respect, until you particularly opt-in to it (or use its :seen syntax, which injects simply sufficient JavaScript to lazy load extra as wanted).It embraces the thought of Islands Structure — the concept most websites are composed of static content material with solely components of interactive/dynamic content material.The thought of solely requesting JavaScript for interactive elements if they’re seen (by way of IntersectionObserver) is a first-class citizen of the framework — Kinda like loading=”lazy” for something interactive.They credit score Marko (the HTML/JavaScript-kind hybrid language) proper on the homepage (for “asking the query”). Jogs my memory of approaches like Alpine or htmx.It sneaks MDX (or the like) in there, that means you’ll be able to writer content material in Markdown (good) however sneak <Elements /> in there too (additionally good).

I fairly like that it doesn’t have this complete, It is a new factor! You prefer it! Previous issues are dangerous! New issues are good! form of vibe. As an alternative, it has a We’re gonna steal each final good concept we are able to from what got here earlier than, and lean on what the native net does greatest vibe which, in flip, makes me consider Baldur Bjarnason’s “Which kind of novelty-seeking net developer are you?” article

Dangerous:

That is the primary type of novelty-seeking net developer. The sort that sees historical past solely as a litany of errors and that new issues should be good as a result of they’re new. Why would anyone make a brand new factor until it was an enchancment on the established order? Ergo, it should be an enchancment on the established order.

Good:

That is the opposite type of novelty-seeking net developer, one who seeks to construct on the historical past and nature of the net as a substitute of attempting to rework it.

The put up Astro appeared first on CSS-Tips.

You possibly can help CSS-Tips by being an MVP Supporter.