SEO Optimization And Vue.js — An Article I Published On Smashing Magazine

A short story about tight deadlines, car websites and online magazines

Paolo Mioni
HCEverything
3 min readMay 22, 2019

--

Photo by Curtis MacNewton on Unsplash

Several months ago now I was the lead developer on the website for a new model by a major car manufacturer. Deadlines were tight as hell and the design was very complex and full of experimental stuff, so we chose to develop it in Vue.js. It was the only sensible option for us given that the site had many transitions between pages, complex animations and whatever gets thrown in a site that has to impress the end user and the client these days.

Problem was, the site had many sub-pages (it was not a SPA), every page and many of each page’s content needed to be shareable via Twitter and Facebook, and all of the content of the pages was supposed to get indexed by Google. There was really no time (or budget, for that matter) to set up server-side rendering, as we hadn’t adopted Nuxt from the start. After all Nuxt was then still in its infancy, so to speak. We checked all literature about Googlebot and JavaScript, and it seemed pretty evident to us that, if we did it right, Google would have indexed the whole site without pre-rendering. The SEO consultants would have none of that, and said that pre-rendering was a must to achieve the best results.

In the end, since the go-live was supposed to be in less than a month, development had started and there was no way we could integrate Nuxt in the development process in time, we decided to go ahead without pre-rendering, see what happened, and fix stuff later if needed.

Within a few days of the go-live, the site got indexed by Google for minor phrases, and Google was picking text content that was being rendered by Vue. Within a few months, the site was ranking first for all major searches related to that car model. I was very happy that we were proven right, however since everyone was still pre-rendering sites and Nuxt was becoming all the rage (we adopted it too for newer projects, but for reasons other than SEO) I was left wanting to know the exact state of the art in the matter.

So I devised an experiment to see what Googlebot actually did on a website which was loading content in all sorts of weird ways, to check what happened and how it would be indexed. I created a website in Vue, filled it with text about Infinite Jest, which is one of my favourite books, and made sure that some content was loaded dynamically and also from external web services. Once the experiment was over, I wrote an article about it and other experiences I’ve had with indexing of Vue.js sites. A few busy months passed, then I finally had time to review it and have it checked by an SEO specialist friend of mine. I submitted it to Smashing Magazine, they liked it, and so here it is:

Let me know what you think in the comments. Or comment the real article directly.

Vue.js development

Our company, HCE.IT, specializes in Vue.js development. We have a competent team of developers who can tackle any project, including PWAs and web apps. We have delivered major projects for big brands. Click here if you need Vue.js development.

--

--

Paolo Mioni
HCEverything

CTO and co-founder at HCE.IT: lover of front-end development, complex technical problems and noisy electric guitars.