React and SEO in eCommerce
September 24, 2018by Chris Carreck
At Creative Licence Digital one of our main focus points is SEO. We do a huge amount of work for our eCommerce parters ensuring we grow inbound traffic year on year through effective strategies and execution. We also strive to produce rich and immersive experiences across web and mobile.
As react.js and react-native are generally our front end libraries of choice, one of the challenges we have found, is how do we make our SEO continue to perform as well if not better, allowing search bots to perform on our sites, as well using the latest in technology to produce rich performant end user experiences?
Using a service such as pre-render.io
This will scan the site, render the JS, then, when it detects an incoming bot, supply them with the fully rendered version. We have effectively used this on smaller scale sites to provide excellent search engine visibility for all major search engines, and it allow us to continually test and monitor sites using our primary SEO and marketing tool, Moz. This has been highly effective for us on small to mid-range sites. However, as an agency, once the number of sites we maintain and manage grows across clients, we have found it doesn’t always scale that well for us.
Snapshotting and static site rendering
There are also frameworks such as react-snap and gatsbyJS that use different approaches to compile the site and output a “snapshot” - compiled HTML and CSS, and allow you to control and provide output similar to a service such as pre-render.io, but you gain greater control of the process. Gatsby also allows server side rendering, graphQL and a whole host of other functions (and is useful if looking at implementing a server less, JAMstack architecture). These tend to scan the site during a build and are a different technique to SSR. They will output the html which will be served to bots when crawling the site.