SEO, Google Lighthouse

I would think of Lighthouse similar to how I think of TypeScript errors. If it finds something, it’s likely a problem I want to fix. If it succeeds, that doesn’t necessarily mean that I won’t have any type-related issues. I would think of your Lighthouse score as the starting point to find easy to spot issues. But having a 100% SEO score on Lighthouse doesn’t mean there couldn’t be a lot of opportunities for improvement. In fact, I believe they have some recommended manual steps that they list out, which of course don’t effect your score.

SEO with/without Pre-Rendering

Jeroen and I discussed this question of SEO with pre-rendered vs. non-pre-rendered SPA apps in this episode of Elm Radio:

What I consistently hear from SEO experts is that Google supports it (though some other search engines don’t yet), but you can still pay a penalty where there is a lag before they index new pages. So it’s generally considered to be helpful to pre-render pages. Also, I haven’t tested it, but I would imagine certain services might not go to the trouble to execute JS in order to extract meta tags (OpenGraph, Twitter card tags, etc.) to present a nice link preview. Maybe my intuition is wrong there and every service consistently runs JS to extract meta tags, but I would guess that it’s more flaky without pre-rendering.

Also note that you’re talking about a delay for adding head tags beyond parsing and running JS. It sounds like you’ll have an additional delay of waiting for server responses before you can add your head tags. I’m not sure if this would cause any problems, but it’s worth doing some testing to make sure you don’t get flaky results because of this. elm-pages solves this with StaticHttp.

Extracting the SEO API from elm-pages

You’re more than welcome to use the SEO API and JS code, for personal use or in other frameworks. Here’s how it adds head tags:

And here’s where it serializes the Elm data types to JSON:

Note that it does have some things that are specific to elm-pages, like the canonicalSiteUrl, but you could find another way to set that.

1 Like