astro VS marko

Depending on the stack of the repository you are cloning, you might have to install additional dependencies. For this demo, I'm using my own website, which is a static website built with Astro.js. It which requires to have Node.js installed and Yarn for package manager.

Database: turso [7] or neon postgres [8] with (drizzle orm) or cloudflare durable objects

1. https://github.com/withastro/astro

Maybe a bit too elaborate for your taste, but I've used https://astro.build/ and loved every bit of it.

Astro is an open-source JavaScript framework known for its versatility, performance, and new approach to web development. It enables developers to create fast, modern, content-rich web applications and sites using the "Bring Your Own Framework" (BYOF) model.

Astro was always on my list of things to learn. I've been using Remix and NextJS for a while, and I was interested in trying out a new framework. I decided it would be a good opportunity to build the site with it. This decision turned out to be a great one, as it saved me a lot of money on hosting costs later on.

We are continuing to make building fullstack websites and application with Analog and Angular as seamless as possible, and extending the Angular ecosystem through integrations with Astro, Nx, [Vitest]https://analogjs.org/docs/features/testing/vitest, Storybook, and more.

import { defineDb, defineTable, column } from 'astro:db'; const Visits = defineTable({ columns: { id: column.number({ primaryKey: true }), page: column.text({ default: 'home' }), content: column.text({ default: "none" }), pagination: column.number({ default: 1 }), visitor_ip_hash: column.text(), visitor_user_agent_hash: column.text(), visitor_count: column.number({ default: 1 }) } }); // https://astro.build/db/config export default defineDb({ tables: { Visits } });

Volar originally was Vue3's language support tool for VScode (I don't know about other editors). By today, volar has become a language indipendent framework to create language tools. It might still be a bit early for the dev with skill issues like me to use it and build some tools, but astro and svelte already use Volar to create their language tools.

I did some research and found an Astro template for a blog. Setting it up was easy as pie.

I first heard about Astro a couple of years ago when it became more popular among the JavaScript frameworks ecosystem. At first, it looked like a great framework to build a landing page, maybe a tiny, interactive web app.

SolidJS and Tauri form another potent combination for creating performant, lightweight, and secure experiences. SolidJS is a reactive UI library that is similar to Svelte in the way it compiles away reactivity and updates the DOM directly, but it also incorporates a fine-grained reactivity system reminiscent of libraries like Marko, Knockout, and MobX.

Marko is a huge leap in the right direction. It has streaming, partial hydration, a compiler that optimizes your output, and a small runtime. I’ve also heard through the grapevine that Marko V6 also adds resumability to the framework as well.

Nevertheless, the future of JS frameworks is exciting. As we’ve seen from the data, Astro is doing some things right alongside Qwik. However, more noteworthy frameworks such as Marko and Solid are also paving the path forward with some similar traits and better performance benchmarks. We’ve come back full circle in web development - from PHP/Rails to SPAs and now back to SSR. Maybe we just need to break the cycle.

If you want more, take a look on Marko, fresh, qwik or pug. Dind't tested yet but they look like same as Nunjucks.

And that is a similar feeling to the exploration we've been doing recently. Inspired equal parts from React Server Components and Island solutions like Marko and Astro, Solid has made it's first steps into Partial Hydration.

I haven’t done any serious work with either, but I’ve been following both closely (and have contributed a bit to Astro early on). So this isn’t the hands-on response you specifically asked for, and may not contain new information to you. I’m posting anyway in case it adds context for others.

Qwik City[1] is probably more directly analogous to Astro, Qwik being more analogous to Astro’s integrated renderers. But that highlights one of the key differences.

Astro’s compiler mostly focuses on server rendering of static content (.astro templates, MDX) and bundling client resources along with the logic necessary to hydrate islands. Astro defers to those renderers (and in some cases their own compilers) for any further optimization of the client bundle.

Qwik’s compiler optimizes the component code directly, serializing state into the HTML it renders server-side, for the client bundle to resume from that state. Its output is conceptually similar to Phoenix LiveView (which was mentioned in another sub-thread).

Both are compelling approaches. I think Qwik’s will probably (eventually) have an optimization advantage because that’s a core focus of the client library. Astro will likely have an adoption advantage because it’s client-library-agnostic.

Another framework in the space often gets passed over: Marko[2], which has been doing partial hydration for years at eBay. Marko is probably more similar in approach to Qwik (and as I understand it, getting more similar as they’re going resumable too), but like Astro has its own templating language which enables its compiler optimizations.

Also worth watching SolidJS[3] (whose creator has also worked on Marko), which is tracking partial hydration/resumability on its roadmap. I’m not sure what their approach will look like but there’s quite a lot of insight both in the issue and the creator’s tweets/replies on the topic.

Personally I think there’s a gap between all of these approaches which could leverage type-level analysis to go much further. But that isn’t really feasible when types being available or accurate isn’t a safe assumption.

1: https://qwik.builder.io/qwikcity/overview

2: https://markojs.com/

3: https://www.solidjs.com/

There is no support for newer frameworks like Marko, which have their own file extension (format).