Live data from Hacker News

Astro: Ship Less JavaScript

astro.build

11–20 of 171 posts

Re: Astro: Ship Less JavaScript

#12
post #2

:wave: Hey everyone, one of the Astro creators here! Happy to talk Astro or answer any questions you have about what we're building. Our README has a bunch more info that we couldn't fit into the release post: https://github.com/snowpackjs/astro

How well do web components fit into astro pages? Do you get the same kind of partial hydration/load on first view semantics with them as it looks like you can do with React/Vue/Svelte components?

Not yet, Lit has support for SSR in prerelease and we've experimented with supporting it. Once it's ready it will be included. In the meantime you can of course use web components (with any framework) like you normally would, just without SSR.

Tracking issue for Lit support: https://github.com/snowpackjs/astro/issues/109

Re: Astro: Ship Less JavaScript

#13
post #2

:wave: Hey everyone, one of the Astro creators here! Happy to talk Astro or answer any questions you have about what we're building. Our README has a bunch more info that we couldn't fit into the release post: https://github.com/snowpackjs/astro

Hey! Do you have any live demos or real(ish) apps made with Astro that we could check out?

There are a few sites in the wild already built with Astro that you can check out:

- https://www.snowpack.dev/ - https://divriots.com/

Re: Astro: Ship Less JavaScript

#14

I read "how astro works" but I don't really get it. How can this work for dynamic content? Does it render every possible scenario? What if data changes?

Currently you build a static site like you do with Gatsby or Jekyll or any other static site generator. In the future it will support dynamic server rendering.

Re: Astro: Ship Less JavaScript

#16

I read "how astro works" but I don't really get it. How can this work for dynamic content? Does it render every possible scenario? What if data changes?

Currently you build a static site like you do with Gatsby or Jekyll or any other static site generator. In the future it will support dynamic server rendering.

Ok so it is a static site generator. Wasn't really obvious from the landing page.

Doesn't almost every large front end framework have a static site generator? I think Vue for example has it built in for example.

Why would anyone use this over the already existing one in their current ecosystem?

Re: Astro: Ship Less JavaScript

#17

I read "how astro works" but I don't really get it. How can this work for dynamic content? Does it render every possible scenario? What if data changes?

Check out the islands architecture info, or search around for info on partial hydration. It's similar to how things worked in the jQuery days--you serve up plain old HTML and have a JS function that runs on page load to attach all the event handlers (onclick, etc.) to your dynamic elements (i.e. 'hydrating' the static HTML into dynamic HTML + JS components). The thing with frameworks like Astro is that they try to automate and manage all of that hydration for you, which is nice because for complex sites with lots of different components it becomes a huge, error prone chore to manually wire things up.

edit: Island architecture background info: https://jasonformat.com/islands-architecture/

Re: Astro: Ship Less JavaScript

#18

Earlier quoted context omitted.

How well do web components fit into astro pages? Do you get the same kind of partial hydration/load on first view semantics with them as it looks like you can do with React/Vue/Svelte components?

Not yet, Lit has support for SSR in prerelease and we've experimented with supporting it. Once it's ready it will be included. In the meantime you can of course use web components (with any framework) like you normally would, just without SSR. Tracking issue for Lit support: https://github.com/snowpackjs/astro/issues/109

Very cool! Yeah I wish SSR was more of a thing in the web component world. Someday soon hopefully!

Re: Astro: Ship Less JavaScript

#19

Earlier quoted context omitted.

Currently you build a static site like you do with Gatsby or Jekyll or any other static site generator. In the future it will support dynamic server rendering.

Ok so it is a static site generator. Wasn't really obvious from the landing page. Doesn't almost every large front end framework have a static site generator? I think Vue for example has it built in for example. Why would anyone use this over the already existing one in their current ecosystem?

I can't speak for every frameworks' SSG tool but most of them load a full SPA on the client and have poor performance. Go pick out a random website for Gatsby's showcase page and see how much JS is loaded (spoiler: a lot).

Astro focuses on partial hydration where you only load the JS for the specific components that need to run in the client. Very few tools and none of the framework SSG's that I'm aware of do this.

There's also a variety of other features that Astro brings, the blog post talks about them.

Re: Astro: Ship Less JavaScript

#20

Earlier quoted context omitted.

Not yet, Lit has support for SSR in prerelease and we've experimented with supporting it. Once it's ready it will be included. In the meantime you can of course use web components (with any framework) like you normally would, just without SSR. Tracking issue for Lit support: https://github.com/snowpackjs/astro/issues/109

Very cool! Yeah I wish SSR was more of a thing in the web component world. Someday soon hopefully!

Stencil support is being worked on too: https://github.com/snowpackjs/astro/pull/266
Post reply on HN