How to Improve Site Performance (and Conversions) with Dareboost

Website performance is serious business. How many times have you become outrageously frustrated with a slow-loading website? If you're anything like me, you've probably closed a great number of tabs — and never returned to the offending website.

Having a slow website will turn visitors away, which means reduced pageviews, conversions, interactions, sales, and advertising revenues. Additionally, if you're running an online business, it will also result in shopping cart abandonment.

According to WPO Stats, The Trainline team found that reducing their product’s latency by 0.3 seconds across the conversion funnel led to customers spending an extra $11.5 million per year.

Fortunately, it's really easy to monitor and manage website performance, and that's where Dareboost comes in.

Dareboost is a platform that will keep track of website performance and quality, and it's really easy to use — you don't need to install anything. Sign up for an account, plug in your website details, and let it work its magic.

Dareboost is a freemium product. While you can get rich, useable data from a free account, the more advanced tooling is available for paid accounts.

Dareboost's tools provide you with great data, with standalone analyses providing actionable data immediately. Additionally, Dareboost’s monitoring tools accumulate data about your site’s performance over time, offering deeper insights.

Dareboost also has great alert functionality, allowing you to set up custom alerts for the metrics that are important to you.

Who Is Dareboost For?

Whether you run your own blog or you’re involved in your company’s online presence, Dareboost is for you if you have a vested interest in website performance. Every web professional can benefit from this tool.

With Dareboost's website performance and quality management, you are able to test, analyze, benchmark, and optimize your website.

Website Performance and Quality Analysis

Let's jump straight in and check out some of these great features, starting with the Website Speed Test. Please note we're using a premium account, which provides more options that we'll explore below.

First, you need to choose a page to test. You can also select if you want to test against a desktop using Chrome, or a mobile device, choosing one of five Android options or an iPhone 6, and a location.

Then there are some advanced settings. You can provide htaccess authentication credentials, decide whether you want to block ads or other scripts for the test, keep the report private to just yourself, and whether you'd like to disable HTTP/2.

Further, you can:

• Set the bandwidth available to the test — 3G, cable, fiber, or custom values.
• Set various screen resolutions to test.
• Mimic a POST request, to simulate what a user would see after form submission.
• Set HTTP headers, such as user agent.
• Allow and deny queries from certain domains.
• Map a hostname to another one, or by IP, and...
• Deny all kinds of animations.

All in all, you're getting real browser testing, which you can setup to emulate almost any kind of potential visitor.

Once you've made your choices, it's just a matter of executing the test. Regardless of your account type, you'll get the same amazingly detailed report, starting off with an overview of website quality and performance.

Straight away, we get an idea of how my chosen website performs, including 8 errors and 11 improvements highlighted. We're also told how many requests are made, and the data transfer required to build the page. The report also tells us the TTFB (time to first byte, a measure of server response speed), how long the page takes to start rendering, and how long until the page is completely loaded.

It also notes the various technologies detected on the website. For this site, we can see Google Analytics, Gravatar, Bootstrap, Twemoji, WordPress, Yoast SEO, jQuery, and PHP.

But perhaps one of my favorite features is being able to watch a video of how the page appears throughout the loading and rendering process, shown below in gif format for your viewing pleasure.

You can use the filmstrip to view the process frame by frame, and there are a range of metrics computed via video analysis. These include Start Render, Speed Index and Visually Complete, and are very useful metrics for improving your user experience (UX).

To figure out what to work on first, you can click on the "See your priorities" button (pictured above in the report screenshot), or refine the view depending on what category of issue you want to start with. You'll probably want to start with anything with a red marker, as they are arguably where you can make the easiest gains.

An area of improvement for the site I tested was image size, and because Dareboost knows the site runs on WordPress, it will tell me exactly which images need to be optimized and provides a few suggestions on plugins that will get the job done.

Dareboost will judge your page against over 100 criteria in at least 9 categories. That's far too many to dive into here, and given the Website Speed Test is completely free, I recommend you jump in and try it out.

Website Performance Monitoring

Next up we have Website Performance Monitoring, which allows you to monitor pages on your site over time.

Adding a page to Monitoring is very easy. In fact, it largely uses the same interface from the Performance and Quality testing tools, with a few additions. The immediate difference here is setting a name — otherwise the settings, including Advanced, are identical.

Past this you can set the schedule, where you choose from daily or hourly monitoring (a 15 minute frequency is also available on demand). If you're choosing daily, you can set the time of day that it executes — if you choose hourly, it'll simply run once per hour.

Finally, you can modify your digest settings. By default you will receive a weekly email digest, and naturally the only option here is for disabling it.

Once you have this configured, just click save and Dareboost will take care of the rest.

At first you'll see an overview as shown below, which will have no data as the monitoring has not yet begun. However, you can now configure alerts.

Setting up an alert is straightforward. You just need to choose which metric you want to be alerted about, and the threshold for triggering an alert when the metric is above or below a certain number. This feature will help you immediately detect slowdowns and quality regressions, or know when a page is becoming too heavy.

I've set up an alert that will notify me if my page is triggering HTTP errors (broken images, third-party provider errors, etc.), since they need to be fixed quickly if they happen.

Once you have some pages set up to be monitored, all you need to do is wait for the data to be populated over time, and keep an eye out for any email alerts that may come your way.

Within Dareboost you are provided with a Monitoring Dashboard, which gives you a brief look at each of the pages you have monitored, showing only the need-to-know details.

Now to show you where Monitoring really shines: viewing and analyzing the data. Click on whatever page you want to learn more about, and you're presented with plenty of information.

The first data you will see covers the changes in important stats from the last seven days, including TTFB, time to start rendering, time until fully loaded, speed index, and how many of Dareboost’s 100 criteria you’ve been successful in, with the graph broken down into four parts:

1. Performance metrics
2. Page score
3. Page weight
4. Number of requests

Rather than go through all of them, I'll show you an example of the number of requests graph. I've focused on March 13th, where you can see 48 total requests for the page in question, predominantly images, followed by JavaScript, and then the rest.

Continue reading %How to Improve Site Performance (and Conversions) with Dareboost%

by Aaron Osteraas via SitePoint