How we used Pulse Insights to improve website performance

Ben HardingProvider Updates, Web DevelopmentLeave a Comment

Raygun uses Pulse to improve our own website performance

Pulse Insights is the latest addition to our Real User Monitoring tool – Raygun Pulse.

We built Pulse Insights because we wanted to provide our customers with actionable insights to help improve their website performance. While Pulse Insights was still in development, we used Raygun’s public website, Raygun.com as a test, to see how much of a difference discovering and fixing performance issues makes. What better way to test Pulse Insights than to use it to improve our own website’s performance?

Even though we were happy with our website performance as a whole, we were excited to find out the results – we still decreased our page load time by 38% per page. So we decided to share these findings, and how we even knew where to look for the nitty gritty issues that can really start to count against achieving optimum performance.

How we measured page performance before Pulse Insights

It may be worth a mention that pre-Pulse Insights, we used the industry standard way of measuring page performance. That is we’d plug a single page into Yahoo’s YSlow and Google page speed and address individual issues. We knew which pages on our site were underperforming from our Real User Monitoring tool, Raygun Pulse. However, what we couldn’t see was the exact reasons for the underperformance – until now.

Pre Pulse Insights we would look at free tools like Yahoo's YSlow

Pulse Insights analyzes our whole website on a weekly basis and gives a holistic picture of website health to help improve website performance, showing you where to look. This helped us to really dial in to any pages that were slightly under-par performance wise.

Much like Yahoo’s YSlow, Pulse Insights uses a set of rules to help you improve your website’s performance. It then presents which rules each page failed, and shows you how to fix them (more on how they work here.) When using Pulse Insights you have multiple ways to interpret and then fix the data. You can fix issues across the whole site (which I prefer personally, because then I feel you get the most bang-for-your-buck) or you can improve the performance of a single/number of pages.

The three pages I chose to look at were:

  • Raygun’s homepage
  • The Raygun Crash Reporting product page
  • The Raygun Pulse homepage product page

Here’s how our Raygun Pulse product page performed:

Fixing individual pages is a great way to improve website performance

As you can see, we passed 10, and failed 10 of the rules. Obviously passing all 20 for all three pages is the aim!

I chose to fix the issues on these three pages mainly because:

  • The chosen pages had just been upgraded with new designs, so they should already have been fast. Plus the code was still fresh in mind
  • Raygun Pulse shows that they have a high number of views, so improving these pages will give a better experience to more of our users
  • More meaningful performance statistics can be shown in the dashboard

Let’s look at our performance results!

Performance measurements: before

These performance statistics were measured using Chrome Dev Tools against a local version of the public website. This was to ensure that any improvements made were due to my updates and not those of my colleagues or a poor internet connection.

Page # Assets Loaded Size (3G) Total Load Time (3G) DOM Content Loaded
Home 88 858 KB 10.01s 3.03s
Crash Reporting 78 878 KB 10.24s 3.03s
Pulse 44 460 KB 7.2s 4.68s

This provided a good baseline for me to start making improvements. So which rules failed, and how did I fix them?

Using Pulse Insights to improve performance

The first step was for me to navigate to each page on the Pulse Insights’ Rules tab, and choose a few of the rules which were failing:


I decided to address three failed rules based on how easy they would be to implement and how much of an impact they have for a first time user:

  • Avoid large image file sizes
  • Combine scripts
  • Prefer Async Script Tags

I also noticed some of our assets weren’t bundled so I fixed that too.

Avoid large image file sizes:

Surprisingly enough, I found that a few images on our website weren’t properly optimized:
finding large images is a great way to improve website performance
Quickly optimizing the images brought the size of our website dramatically lower.
Note: The images we failed to compress were mostly SVGs but when compressing all images site-wide I noticed a few regular images were missed also. You can read more about SVG optimization on a previous blog post our designer wrote here.

Combine Scripts:

Our public website has had many iterations done since Raygun was first announced, so finding out that we had a few scripts unbundled wasn’t so surprising:
Looking to combine scripts is a great way to improve website performance
Whilst fixing this issue I ended up being able to remove a few scripts that were not needed to improve website performance. Some of the tracking scripts were for older services, while some I simply made smarter and only included on the required pages.

Prefer async script tags

Another easy task (as long as you know your script dependencies) was to refactor how our scripts were loading since Pulse Insights told us that we weren’t making use of the async tag (as the image below:)
Prefer async tags is a good way to improve website performance

Bundle Assets

The final optimization step for helping improve overall website performance was to use SVG symbols for a few assets so that browsers only have to make a single request for those assets. Whilst not explicitly a rule in Pulse Insights, the combining scripts step I performed lead me down this path and we ended up merging 20 assets into one.

Performance Measurements: After

With those improvements made, I then measured the performance again and saw quite a dramatic improvement across all the stats.

Page # Assets Loaded Size (3G) Total Load Time (3G) DOM Content Loaded
Home 70 511 KB 6.16s 1.86s
Crash Reporting 44 458 KB 5.52s 1.94s
Pulse 32 336 KB 4.04s 3.33s

Final results

Ever since Pulse Insights was released into the wild we’ve been using it on our websites.

The performance improvements shown above we did in a single day of development and we ended up:

  • Removing 64 http requests
  • Transferring 891 KB less data
  • Decreasing the total load time by at least 38% of each page

Each step was by no means rocket science to implement and in my experience knowing that they were issues in the first place was harder than fixing them. You can find out exactly where the performance issues are in your website by taking a free trial of Raygun here. Or if you’d like a personal walkthrough schedule a demo with a friendly team member here. 

Related articles

How Raygun Pulse differs from Google Analytics

Next level software intelligence across your entire stack. Get deeper analysis into how your applications are really performing. Learn more.

Leave a Reply

Your email address will not be published. Required fields are marked *