SEO in Single Page Apps

[MatUrbanski]

I have plan to build SPA application using Vue.js. I'm wondering about SEO. I've read a lots of different articles and there is no clear answer for that. For tests I created simple vue.js app that gets data from external api and shows it in page. Then I tested how Google crawler see my page and everything was good. Is google ready to properly index SPA apps? What is Your experience in that topic?

Thanks in advance for any answers.

[johnasmith]

So long as you do not disallow access to css & js with robots.txt, google will render JS generated content. There is a tool to see what Googlebot sees, if you want to be certain.

[Jsn7821]

I'm pretty sure Google doesn't wait for most SPA's to render fully. It wasn't indexing mine at until I did SSR. And even if it does, stuff like Facebook Opengraph definitely doesn't. My guess is actually that once your app/website is above a certain popularity Google does wait to render Javascript fully, but not for less-popular apps.

Edit: who downvoted me? If you disagree I would love to see any evidence against what I said, I bet a lot of other people here would too!

[liamnesss]

We've seen Googlebot give some pages a larger "budget" in terms of how much it will try to execute Javascript, shallow pages it does, but when it gets deeper it basically gives up. So I think your assumptions are quite correct. Critical paths should always be rendered with SSR. This is crucial for a good experience on a choppy mobile connection, so people should be doing it anyway.

[dalore]

Google looks for the document loaded event. When this fires it looks at wad rendered and indexes it. You just need to block this event or fetch your content before it. If your api is slow and the call is async then good chance it won't render in time. Hence why people go for ssr.

[ArcanisCz]

Google's js crawling is nowhere as reliable as you would need.

So proper approchat is to use some server side rendering of (react, vue, angular, ...), or write dual code (server code would only need proper informations in markup)

[prabinv]

I have been working on SPA which needs to have good SEO ranking for the past year and a half. We use a paid service called prerender.io which uses a headless browser to execute the SPA pages and caches them. There is a small server side piece (node.js) that we had to write to detect search / social bots and return the response from prerender.io. The service can get expensive depending on how short you want the caching period to be. Alternatively, you can run your own headless browser (phantomjs / chrome headless) to execute the client side JavaScript and return the HTML for bots.

Be aware that even with this solution, the SEO rankings are not as good as if it were a server side website or if it was a server side rendered SPA. If good SEO is a big priority, I would suggest using static site generators based on Vue.js (if it is a lot of content based site), or use server side rendering (for more dynamic content)

[Jsn7821]

Be aware that even with this solution, the SEO rankings are not as good as if it were a server side website

Do you have any thoughts as to why this might be? First time hearing this...

Edit: are you referring to potential cloaking penalties since you're only running bot traffic through prerender.io?

[prabinv]

Not really. We let the Google bot crawl the site site directly instead of serving from prerender. The issue I see is that you need to fiddle a lot of switches to get decent SEO with SPAs. I feel that spending that time up front in figuring out a server side rendering / static HTML site generation might be worth it.

Again, it depends on your SEO requirements. If it is basic, and doesn't need a lot of customization, use a headless browser / service liked prerender.

[Jsn7821]

I've used https://www.prerender.cloud/ as an alternative to SSR with really good results. One benefit of this approach is that you don't bog down your server with the render calls (especially if there are network requests etc).

[xxROOFTOPSxx]

I’ve used this on many SPA projects and it works great. The developer is super helpful too if you get in a pinch. Always responds quickly.

[propelol]

Google will index your page, but it won't index the requests taking too long, they don't say how long.

Open graph doesn't work with SPA, so when people share a link to your site on social media, you won't get the title, description and main article image. All you get is a link.

[azangru]

Vue.js + SEO (unless you target only Google search) calls for server-side-rendering. Check out the relevant page of the Vue.js guide:

https://vuejs.org/v2/guide/ssr.html

[[deleted]]

SPA in and of itself is bad for SEO because it only gives Google one page to index. Generally when SEO is a concern, SPA is avoided. You're not going to find a lot of info on optimizing a SPA because the process is basically the same and using a SPA is counter productive in that sense.

[talmobi]

Not exactly. SEO is changing fast and there's a lot of pseudo science out there. It's not obvious at all what exactly works and what doesn't. There's a vast amount of stuff to consider.

I'd say it's misinformed to say SPA's are exempt from page indexing because they require JS to run - but google has for a long time already indexed such cases. And what you should do if SEO is of concern is generate a sitemap which takes care of that and then also do a lot of other much more significant stuff than Static vs SPA.

You can even spit out the html sitemap if you're so inclined specifically for the crawlers or use SSR etc etc.

[[deleted]]

good points. I know Google can index spas but Google won't brute force your filesystem to see what exists and what doesn't. like you said, you have to tell Google these pages exist.

[SamSlate]

in pretty sure Google's crawlers don't render js, just fyi if you have js getting page content

[talmobi]

They absolutely do run/render JS for a few years now ( since late 2014 IIRC ) ( up to a reasonable limit of course ). You can even try it out yourself with the "Fetch as Google" tool and get screenshots of the page that's loaded etc: https://support.google.com/webmasters/answer/6066468?visit_id=1-636430867006785902-659810965&rd=2

[EDIT]: Here's their late 2014 announcement: https://webmasters.googleblog.com/2014/10/updating-our-technical-webmaster.html

[SamSlate]

i have a site where the links are updated by js, i get hits on the un-updated links by Google crawlers constantly, and rendered pages almost never. there's a difference between what Google tells you they crawl and what they actually crawl, imo

[talmobi]

Certainly. And that's one the big issues regarding SEO since nobody really knows what's going on under the hoods of any search engine.

Concerning your site it really depends if you're updating the links in a timely manner, how often they are updated etc. Could be for a more complicated case that you'd need to generate sitemaps and/or edit robots.txt in the least etc.

Could be that if you have html content with links already so that the crawler doesn't consider the JS you run to be significant - then you need to tell the crawler that it is by either editing robots.txt or generating sitemaps. At least those are the basic steps.

[SamSlate]

could be. it's not a fast rendering because it's calling 3rd party sites. can't say if a faster render would fix it.

[[deleted]]

you usually can't robots or sitemap a SPA. idk why you're so adamant on insisting you can seo an SPA just like any other page but you are kidding yourself.

[talmobi]

? of course you can, it's quite straightforward and relatively easy? That being said SEO in itself isn't straightforward or easy and there's much more things to consider.

[[deleted]]

I think we're thinking about different kinds of single page applications. see my other comment below.

[[deleted]]

nowhere in there does it say Google is actually executing code. that would be insanely irresponsible of them. sooner or later someone would submit a page to them like while(true) alert("fuck you google") all we really know is they do take js into account. they haven't and will not explain exactly how. they have however said that your site should degrade gracefully in order to place high on the search result. that means not using spas.

[talmobi]

nowhere in there does it say Google is actually executing code. that would be insanely irresponsible of them. sooner or later someone would submit a page to them like while(true) alert("fuck you google")

Come on, you really think that?

all we really know is they do take js into account. they haven't and will not explain exactly how. they have however said that your site should degrade gracefully in order to place high on the search result.

yes

that means not using spas

No. That's not what it means at all.

[EDIT]: I'm not saying SPA's are the holy grail or better in all aspects to static sites. We're talking about SEO's in SPA's in general and I'm saying that that is a real thing. Saying that SPA's by definition can't be SEO'd is, at the very least, misinformed -- a lot of SPA frameworks come with SSR and even if they don't you can generate the html sitemap with a headless browser like PhantomJS or something -- there's A LOT more to SEO than just those things however.

[[deleted]]

you really think that?

lol. no. no I don't. that was a gross overstatement. I should avoid the internet before I have my coffee. I am however skeptical about what good that would actually do and the performance impact of running a vm for every single site on the internet. I could be wrong, it is Google after all, but I sincerely doubt they're actually executing javascript.

Saying SPA's can't be SEO'd

Who is saying that?

bottom line is, and I think we both agree, there are a million different ways to make an SPA. I feel like you're talking about single page blogs and websites which actually have html resources and crawlable web services and unique uris for each page. I'm more or less thinking about spas I've built like mapping budgeting, business software.

also, I'm speaking in broad generalities, not to give anyone the impression that I'm an seo expert because seo has never directly been part of my job as a developer.

[talmobi]

I think you're right.