Google bots are caching my page in its "Loading..." state

help
1

I’ve run into a strange issue that I’m having trouble figuring out how to solve. I’ve used Google Webmaster Tools to upload my sitemap, register my site, and I’m using Prerender for caching. My site’s landing page has some featured products:

<template name="featuredProds">
  <div class="container-fluid">
    {{#unless Template.subscriptionsReady}}
      {{> loading item="Products"}}
    {{else}}
      ...

And my loading helper looks like this:

<template name="loading">
  <div class="content-load" style="{{style}}">
    <i class="fa fa-spinner fa-pulse"></i> Loading {{item}}
  </div>
</template>

So in the Google search results, I get this:

1640×592 102 KB

Also, looking at Google Webmaster’s “Fetch As Google > Rendering” page, I can see that it captures the page before the subscriptions are done.

How do I address this?

2

I think your safest bet would be to use fast-render.

2 Likes
3

Ah, thank you! I’ll check out the Atmosphere page and related walk-through on Bulletproof Meteor.

1 Like
4

You need to use FastRender as @serkandurusoy has mentioned.

5

This particular project is using Iron Router + Blaze, so it’ll help.

What about a project using Flow Router + React? Does fast-render make a difference there as well?

1 Like
6

If you are using the prerender.io site to cache your pages (and maybe even if you host your own server for prerender.io) you can take a look at this page: Prerender.io Best Practices and you will notice a nice feature implemented by setting window.prerenderReady at places in your code.

The actual placement can be tricky in React + Meteor, but you can experiment in the Blaze + Meteor situation. Place the false setting as early as you can and the true setting after everything for your "page" has rendered.

In this way, prerender will notice early that you want it to wait and will only start to interpret your page at the point it notices that window.prerenderReady equals true.

Hope this helps.