We consider this rendertron and prerender io review ongoing. After all they are both constantly making updates to their middleware. If you have any comments feel free to email us or comment below.
You’ll also notice we/I use the words “we” & “I” interchangeably – this is because I’m a snob :-p
In this breakdown of Rendertron and prerender io we will discuss the advantages of both, as our clients use one or the other, we have also run individual SEO tests for both.
The problem these two middlewares are trying to solve is huge and truly awesome. However, they both are not without issues, which we will dive into later.
In partial Javascript, it is rather terrible for SEO. Search engines tend to have trouble rendering front end Javascript, or at least it’s a drawn out process with uncertain consequences.
Free Weekly SEO Newsletter
Hey! I’m Scott, I’ve been an SEO consultant for nearly 10 years. Get on my weekly newsletter to get..
- Weekly SEO updates, keep up with the latest and greatest.
- How we grow websites from zero to millions of visitors
- A bunch of SEO tips and Tricks you won’t find anywhere else test
TL;DR: Prerender io & Rendertron Quick Overview
Server Side rendering is likely the way to go, however if you or your team has already created a Javascript based web app, prerendering is worth testing before making an entirely new application.
SEO, in our option, is a test based marketing approach. It’s pretty unlikely you’ll get it right the first time, especially when creating custom technology.
Don’t expect your traffic to explode after installing either one of these two middlewares. Rather, consider it a step in the right direction.
Prerender.io Review
Pros for the Search Engines:
- Has humans you can ask questions to.
- Fairly clear documentation.
- Currently our preferred choice.
Cons:
- You gotta pay, at least for large scale applications with quite a few visitors. However for smaller web apps they have free usage.
Rendertron Review
Pros for the Search Engines:
- Open source
- Google claims its the best thing since sliced bread
Cons:
- We didn’t care for the documentation.
Rendertron & Prerender io – How it Works
A pretty common question about prerender io and Rendertron, these two pieces of middleware is ‘how does it work’?
Really simply, when Googlebot (or whichever Search Engine you prefer) visits your website it crawls your website.
This is a pretty common navigation issue, you’ll notice when we scroll over one of the menu item it gives a pretty nice list of items and links a search engine can crawl:
However when we change the useragent and load the page as Googlebot, you’ll notice all these links disappear:
If you are actively trying to rank the inner pages on this menu, this is a terrible mistake for Search Engine Optimization.
Effectively, you are creating extra steps and Google or other search engines may have trouble ‘seeing’ or crawling the inner pages.
If Googlebot cannot crawl the inner pages, you’ll have a much harder time ranking them.
Server-Side Rendering: Why is it better for Search Engine Optimization
This is largely my opinion, but I find it just causes a lot less issues to focus on programming languages that do no have rendering issues in the first place.
Frankly, I do not believe rendertron, prerender io, or any individual software is to blame, rather its the implementation and nature of the programming language.
100% of the clients that I’ve worked with that did not use javascript in the first place don’t encounter many of the same issues I find with Javascript websites.
I’m trying to say, the software engineer likely unknowing caused an issue with your app or website 😀
With any type of custom software, there are going to be issues. If you use Javascript, search engines and their crawlers will inevitably be an issue. It’s kinda the nature of the programming language.
What is the end Goal of Prerendering Javascript?
The end goal of rendering is to create a “1 to 1” ratio with HTML. In other words, you want your Javascript website to perform just as strongly as a standard HTML page that renders on the server.
Javascript is kind of a Black Box….
Javascript, at least from a search engine optimization perspective, you never really know what it is up to. Hence the black box metaphor, you can’t really see inside, lots of guessing.
Even front end / client-side Javascript, after Google crawlers index you page and you see it fully cached. When we have made updates to said ‘Javascript’ pages, in our experience, they take longer to index.
How does Prerendering Rendertron or Prerender.io middleware help again?
Effectively when Google and other search engines of your choice crawl the page, they serve a prerendered / fully formed version of the page. Whereas client-side the user sees whatever you originally programmed.
Meaning all the Javascript stuff that was questionable, is now crawlable and GoogleBot can see 100% of the code.
You are limiting the amount of work search engines have to do, you are serving a page that is in pure HTML, nothing to render.
It’s fewer steps for crawlers.
How does this affect content marketing?
Really the terms “content marketing” and “SEO” are interchangeable. If your blog or large scale content website or web app is depended on content marketing, you better make sure it is rendering properly.
Otherwise some % of the effort to write or produce content will likely be wasted.
How to Test Prerender io and Rendertron
Since we are Search Engine focused, we are going to discuss how to see if the prerendering is working from a SEO perspective.
Meaning is the code loading in a more “Search Engine Friendly” way.
Here is what you do.
- In Chrome (or Opera) inspector (right click and click ‘inspect element’ for the non-coders)
- Choose ‘Network’ then click the gear icon.
- Most importantly, change the user agent to Googlebot, I’d probably test all three options, Smartphone, Desktop and regular Googlebot.
- Then RELOAD / REFRESH THE PAGE – lots of people skip this step.
- After that ‘view source’ and make sure the code you are worried about is showing up.
Why is it important to ‘View Source’ in client-side Browser (ideally Chrome)
For the non-programmers we are talking about this option when you right click on Chrome, Opera, or and client-side browser:
This option:
Doing so, will allow you to check the page’s code and server-side rendering. In short, look for elements that you are worried about, or visuals that just don’t look right when you load the page as Googlebot.
Which Programming Languages Can You Use them for?
Any client side rendering language, ie Javascript. Meaning React JS, Vuejs, Angular JS, etc.
Common Questions We Didn’t Quite Cover
Is there a prerender io or Rendertron alternative?
Currently the only other prerendering middleware I am aware of is puppeteer. However I have yet to test it in a live environment or testing scenario.
Again, no experience here but Angular Universal is another option to research.
What type of servers do they work on?
Both Rendertron & Prerender.io should be fine on nginx, AWS, firebase, apache, etc.
Why is server-side rendering better again? Vs rendered HTML?
In our option, Javascript can be a bit of a black box, meaning you are never really sure what is going on.
For example, there are times when Google turns off its rendered indexing. Meaning if you update Javascript based content and Google is pushing out a major update, Google might not crawl your client side javascript.
Meaning, you make updates, and nothing happens until Google gets their act together. In 2021, Google had all types of indexing problems, we doubt it will be the last time something like this happens.
How do we know Search Engines turn off javascript indexing to be true?
Because when we ran SEO tests with our associates.
You make up a keyword and hide it from somewhere on your site.
Frankly this is where rendertron & prerender.io can help, ideally they avoid this issue all together.
If you can use javascript to concatenate something like this (forgive my meh programming, but it should get the message across):
“<p>dfjid + aasde + fdekd</p>”
This should index if rendered indexing is up and running. You’ll be able to google “dfjidaasdefdekd” and the only result that shows up.
If you don’t show up for a few weeks, then you know something fishy is going on with rendered indexing.
Hat tip to Ted Kubaitis for inventing this method.
What if you have a different user and Search Engine experience?
It is possible you want search engines and a user to have a different experience. For example, you might want to hide javascript based ads from Google.
Meaning, Google sees one thing, and the end user sees another.
To be frank, we are not 100% certain on the implementation, but have had clients successfully do this.
Final Thoughts on Prerender.io or Rendertron
I think we summed it up in the TL;DR didn’t read section of this article, however is what you should consider:
- Are you programming the app from scratch? If so, you should consider another programming language like next.js that already takes care of a lot of the issues mentioned in this article. Or another language that is server side.
- Is Your app or website already created? If your javascript app is already created it is a great first step to debugging and ideniting possible search engine issues. Don’t expect traffic to explode upon installation. If rendering is an issue, likely there are more issues you are unaware of.
- Which one should you go with? Prerender.io has better docs an support, rendertron is open source if you are on a budget and already have a large scale website. Probably prerender.io if you have any type of budget.
Agree or disagree? Got any questions? Feel free to reach out to us or comment below.