Render Better Onboarding Guide

Introduction

Render Better automatically optimizes the load time of Shopify storefronts for a blazing fast shopping experience. 49% of customers abandon poor loading websites, which results in substantial lost revenue for merchants. Render Better helps save you from lost customers due to poor loading times and eliminates the high engineering costs required to keep an entire website loading optimally.

In this onboarding guide, you’ll learn about how Render Better works, important considerations before setting up Render Better, and the steps needed to set Render Better up. This guide is targeted to your website design, marketing/communications, and IT teams whom we recommend read through this guide to ensure a smooth launch experience.

Table of contents

How does Render Better work?

Render Better automatically improves load times of ecommerce websites by sitting between the website and its traffic and optimizing code on the fly. To achieve this, a website points its domain at Render Better’s global CDN and Render Better CDN fetches the website response, rewriting it to load more optimally before serving it back to browsers.

Render Better sits between your traffic and Shopify and optimizes each request on-the-fly
Render Better sits between your traffic and Shopify and optimizes each request on-the-fly

Render Better learns how to optimize websites by crawling them and discovering the types of content, images, third parties, and other resources that need to be loaded and their priority. When visitors request a web page, Render Better fetches it from the server (such as Shopify) and uses what it learned about the page to make sure resources are loaded in the optimal order and at the right time.

We call this process Resources Priority Optimization (RPO), a proprietary technique we’ve pioneered through years of R&D that sets us apart from our competition.

Website resources overwhelm browsers, clogging up their load like a pipe with too much in it. To prevent a visitor’s browser becoming clogged, Render Better uses RPO to make sure only the most important resources load first (such as text and images), and less important resources being loaded later (such as third parties and low priority scripts).

We make sure the most important content visitors want to see is loaded first
We make sure the most important content visitors want to see is loaded first

Furthermore, we make sure resources that are loaded are each compressed and squashed as much as possible. Image sizes are adjusted if they’re too big for the screen, unneeded font characters are removed, text is minified and compressed, and more.

Important considerations

We’ve built Render Better to be as unobtrusive and surprise-free as possible, but there are still some important considerations to make before completing the installation of Render Better. Please review these considerations to ensure you know what will change so you’re not caught off guard.

Domain changes

For Render Better to work, you need to point your storefront’s domain (e.g. yourdomain.com) at Render Better’s servers. This requires a change to your domain, but you will still remain in full control of your domain and your website at all times.

During the installation of Render Better, your website’s primary domain is pointed at Render Better and a subdomain is created to point directly at Shopify.

See the next section for more details about the shop. subdomain.

Your new shop domain (shop.yourdomain.com)

As a part of the onboarding process we will set-up a shop. subdomain that points to Shopify. You can think of the shop. subdomain as nothing more than just Shopify without Render Better. Your current domain (www or the root domain) will point to Render Better which optimizes the page before sending it to your visitors. This subdomain is set up to help investigate any potential issues (see Troubleshooting Render Better) and to help compare your site’s performance with and without Render Better.

💡
Your shop domain will be publicly accessible, but any customers that land directly on the shop domain will be automatically redirected to the Render Better optimized domain

Does the shop. subdomain affect SEO?

As a part of the onboarding process the Render Better team will help with modifications to your theme to make sure any search engine crawler requests that go directly to the new shop. subdomain get directed to the optimized version of your site. We do this via a canonical meta tag and by modifying the robots.txt file to make sure crawlers only crawl and index the optimized domain. This will prevent search engines from indexing the shop.yourdomain.com site.

💡
In addition to the above theme modifications Render Better automatically injects <meta name="robots" content="noindex"> on your rb. staging subdomain to ensure it doesn’t get indexed.

Theme changes

As a part of the onboarding process the Render Better team will help you make a few small changes to your Shopify theme to do the following things:

  • Allow you to control the Render Better directly in Shopify
  • Redirect any customers to the Render Better optimized domain
  • Modify the canonical tag and robots.txt to point to the Render Better optimized domain
💡
It is important to make sure that these changes are in any new theme updates. If you need us to make the changes to another theme as well as your current “Live” theme please let us know during onboarding.

If you need to make these changes manually (for example, if you track your theme code in a Git repository), please follow our theme code installation instructions:

Install Render Better’s Shopify theme support code

Uptime

When using Render Better, traffic will be served from Render Better’s servers instead of directly from Shopify’s, so that means the uptime of your website is tied to the uptime of Render Better’s servers and Shopify’s. The stability of Render Better’s customers is of paramount priority to us. From day 1 we’ve thought about how to ensure maximum uptime and stability of the Render Better platform. Below are some of the ways we make sure your site is maximally available.

Rock solid infrastructure

Render Better uses the same global network provider as Shopify, a trusted provider of many Fortune 100 businesses, so we’re confident in the stability of our platform. If you trust Shopify’s uptime, you can trust us.

Tests, QA, and Monitoring

Our monitoring system pings your site every few minutes to make sure everything is working properly. Render Better also has continuous log and exception monitoring in place. Our engineers are on call for major issues and are alerted via a 24/7 pager system. All deployments are backed by hundreds of automated tests and manual QA review.

Fallback Mechanisms

If Render Better detects any issues with our optimizations, we’ll simply serve up your original site directly from Shopify. For example, if our optimizations fail to modify your code within a few hundred milliseconds, Render Better will automatically pass your site through without making any changes.

You’re in control

We provide instructions for your team to turn off Render Better should you ever need to do it yourself, so you’re always in control of your site.

We have a wide range of Shopify sites currently running on our platform, without issues, from only a few thousand sessions per month to several hundred thousand sessions. Thanks to our robust infrastructure, we can handle sites of any size and fluctuation in traffic.

Launching your site on Render Better

The launch of Render Better for your site follows a 2-phase process which is there to ensure everything goes off without a hitch. These phases are broken out into the following:

  • Phase 1: Installation and Review

    • The Installation and Review phase ensures that everything is working exactly as expected before going live with Render Better. We’ll QA the site on our end and work with you to ensure everything looks good before launching on Render Better. Typically, this only takes about 1-2 weeks for most websites.

  • Phase 2: Launch

    • When everything looks good, we will schedule a date and time to launch your website with minimal downtime. During this phase, your domain will be pointed at Render Better and traffic will start passing through Render Better’s global CDN.

Phase 1: Installation and Review

Installation

The first thing we will do is set up a new sub-domain that you can test Render Better on. We will provide you with a set of CNAME records to add to your DNS Provider which will create an rb. subdomain.

In addition to this, we’ll help you with the theme changes and Shopify Pixel tracking that needs to be added.

Review

Once the rb. subdomain is set up please poke around and see how things perform. We mainly want to look out for application and plugin functionality along the customer journey such as reviews, images, cart flows, etc to make sure everything works as you expect.

If you suspect that something is broken in the staging site make sure that it’s not also broken on the live site. To help us address any issues please take either a screenshot or a video recording of the issue and send it to us along with the URL you’re seeing the issue on.

We will conduct our own set of tests, but please let us know if you spot any issues or have questions so we can work through those before going live.

Important things to check

Are any third party features or apps missing on these pages:
Home Page
Collections Page
Product Page
Cart/Checkout

Phase 2: Launch

New DNS records

The final step is to forward your domain to Render Better. We will help you with making DNS changes so that traffic routes through Render Better.

The changes made to your DNS will depend on your domain configuration. Our solutions engineer will walk you through the necessary steps of what changes to make.

Additional notes

You may notice that your primary domain in Shopify shows the “SSL unavailable” badge. This is because Render Better has the SSL Certificate in order to serve traffic under that domain. This is expected behavior and should not cause any issues. Please contact us if you believe it is causing any trouble with your site.

image

Important things to check

Now that you have officially onboarded to Render Better please double check that your website is behaving as you expect.

Some notable items to check:

Are any third party features or apps missing?
Home Page
Collections Page
Product Page
Cart/Checkout
Collections page
Can you navigate to a product?
Does searching and filtering work?
Product pages
Can you add an item to a cart and checkout?
Are any apps or plugins missing?
Checkout/Cart
Can you checkout/purchase?
Are any apps or plugins missing?
Do the alternative payment options (PayPal, Google Pay, etc.) work?
Can you go back to the main site from the checkout (e.g. clicking the logo)?
Account features
Can you create an account?
Can you login?
Can you login through the checkout page? (if feature enabled)
Misc
Do forms work?

Although we don't anticipate you'll have any issues with any of the features, we advise this regression testing just to be safe. If there are any issues discovered, it may be possible it's related to Render Better or it may be an existing bug. We have a troubleshooting guide on how to tell which it is and what to do if you discover an issue related to Render Better here:

Troubleshooting Render Better

Reach out to our support team

We’re always here to help if you have questions or need assistance! Please reach out to success@renderbetter.com or your account manager if you have one for all your inquiries.