Used vue.js with laravel and my site is not SEO friendly anymore

3 points by etattva 7 years ago | 17 comments

I implemented vue.js on my site for pagination and filter. Now I realize that the page loads with filters and the data is fetched via AJAX. Do a view source and AJAX content is not displayed. This affects the site indexing and ability to rank. I do not want to go for SSR. What could be my options here? Should I ditch vue.js?

romanovcode 7 years ago |

You use SPA and then are surprised that it negatively impacts your SEO? What did you think would happen?

If you want good SEO ditch SPA. If you want SPA and SEO you must have both - client-side rendering and server-side rendering.

xcubic 7 years ago |

You can mix both! Depeneding on how you implemented vuejs, you can render the list on the server on a blade template and send it to the cliente. There, you let vue do the pagination/filters/etc.

etattva 7 years ago |

With all these discussion, my question to this group is that should I stick with vue.js ? I was using data tables and developer advocated vue.js being much better and flexible, which I agree but then these SEO challenges. If I am on laravel framework, what options do I have to implement pagination and filter conditions in SEO friendly manner. I have seen some sites using Ajax but they change the url by incrementing a variable in the url.

quantummkv 7 years ago |

If you want to keep your SEO ranks without SSR, ditch any client side rendering framework and go back to blade templates.

etattva 7 years ago | |

How do I allow filtering to be done on client side? I am comparing with cargurs, aamozn wayfair, how to get that filter option on left and still keep content. I was think load content first and then load filter on left. This is what amazon does

quantummkv 7 years ago | | |

Use javascript. Display all the data at the first load. Then make make ajax calls with the filter data to the server, filter and process the results there and replace the original content on the client side with innerHTML().

Bashmaistora 7 years ago | | |

On a small side project, I load the initial results with the template and then do filtering and additional searching with js. This allows me to be SEO friendly, while still having nice filtering functionality.

steve_taylor 7 years ago |

> I do not want to go for SSR.

SSR and SPA aren't mutually exclusive. Vue.js supports the ability to server-side render and hydrate the HTML with your SPA once it has loaded. It's the best of both worlds.

https://ssr.vuejs.org/

antoineMoPa 7 years ago |

I think that google now uses a headless browser. Unless your page loads in too much time, nothing should change on the SEO side if you have the same content at the same place.

detaro 7 years ago | |

From what I've heard they do, but not for all of it. The bulk of the crawling is still done without it, and some subset of pages (probably based on some detection of "this site requires JS") is crawled with the more expensive, JS-enabled crawler too.

xcubic 7 years ago | |

That is not true. As far as I know, google does execute js but does not wait for ajax calls.

etattva 7 years ago | | |

In google webmaster I saw the error when ran "fetch as google". It had issues with Ajax calls.

tuananh 7 years ago | | |

source please!

codegeek 7 years ago |

Do the routing through laravel and then in the blade template, just pass the data along in a vue component.

TigerHimself 7 years ago |

SPA and SEO are not compatible. SPA is good for apps, backends, admins ...

dragonwriter 7 years ago | |

A SPA supporting deep linking and an access model that provides unauthenticated access to public content should, in principle, be able to be made indistinguishable from a set of classic webpages with the public portion of the app content, from an SEO perspective, at least if one takes the JS rendering ability of the search bot(s) of concern into account.

stefkors 7 years ago |

Perhaps setting up nuxt could work?