Category: Static Site Generators

Categories
JavaScript Static Site Generators

Static Site Generator Opinions

Eleventy looks good for actual simplicity and genuine static sites.

Nuxt

Nuxt Update 2.13

19 June 2020: Now supports target: static to actually build a static site.

TL;DR: up to and including 2.12 do not support writing fully-static HTML without client side JS. It gets part the way there whereby you don’t need a Node server, however there’s still 150kb+ of client JS.

A coming version should support a ‘static’ directive to avoid that.

Just dabbled with this for potential client project. Seems powerful for apps and SPA, and it apparently does SSG and SSR; HOWEVER their definition of a static generated site means static files, but the page rendering is still done with JS!

I found issues on their Github, and log running RFCs to discuss making real static HTML files that have the content actually rendered there are built time, but still nothing implemented as of April 2020.

It’s pretty frustrating TBH, because if the result is static content on the page I’m not sure why the JS community cannot fathom writing it into the HTML file and not into a JS render function.

You’d lose the power of the SPA.

Whoever

Yeah, that’s fine. The browser is really good at navigating pages. If they are static HTML they will be super fast, the routing is automatic, the whole thing is super portable and SEO friendly.

Gridsome & Eleventy

These are probably the best of the non-React JS ones to try next.

Gridsome uses GraphQL and if you know that might offer power for fetching data.

Eleventy looks like it probably can with Data sources that use functions/async funcs to fetch data for build. If you were iterating on a site could you separate fetching API data from each build so you have more control about when that runs?

Categories
Static Site Generators

VuePress

I gave VuePress the 101 Hello World run through.

Dev experience was fine, and running vuepress dev was nice enough, however seems like it doesn’t actually generate static sites. The build command creates an index.html, but it still references webpack powered JS files to actually setup the styles and templates. You can’t just dump that output on a static host like S3 or Github pages.

Others reported the same issue on Github and the answer seemed to be to install some lightweight node http server, but that’s not a solution. I can’t run a server on S3 or Cloudfront?

Surely the point is that you end up with simple fucking HTML files, and not needing to run node on a server?!

And even if I wanted to piggy back on an existing server, that node process couldn’t listen to port 443 if it’s already in use by Nginx or whatever. So what, I need to provision a whole new real server?

And (2) even if I did that the code sent to the browser still includes a lot of JS it has to parse, so much of the perf benefit is lost.

No thank you VuePress, I do not think we’ll be doing business together!