Using Raygun Pulse Insights for progressive web optimization

Sam HoltProvider Updates, ResourceLeave a Comment

progressive web optimization with Raygun Pulse

Progressive web optimization is required when you have a constantly growing website to keep the user experience positive and ensure new visitors are stopping to look around.

But what do I mean by progressive web optimization?

Progressive web optimization is the idea that website optimization is not a single task, as no website is static. Content and features are being added and removed all the time, so optimizations must be constantly made to ensure your website is performing at it’s best.

As a web developer, it’s easy for hard work to go unnoticed – often people only notice your work when it’s, well, broken. When it comes to front end development the reality is that things can always be improved and optimized. Unfortunately, knowing what needs to be done and to what extent is not always clear. At Raygun, we use both Raygun Pulse and Pulse Insights to identify exactly where the problems are and what needs to be done to make things better.

I’m going to show you how to use the latest feature of Raygun Pulse, Pulse Insights to measure your impact on web performance, improve the code and impress the boss while you’re at it.

Progressive web optimization with Raygun Pulse Insights

Step 1. Enable Pulse Insights

If you are an existing customer, head to your Raygun Pulse dashboard and enable Pulse Insights: 

enable Pulse Insights inside the Raygun dashboard

Step 2. Identify which pages need optimization

The first step is to look at Raygun Pulse and identify where optimizations need to be made first. Pulse gives a load time breakdown for each of your website’s pages and resources.

A good place to look first is in the ‘Performance’ tab, in the ‘Slowest pages’ module:

pulse-slowest-pages

What we’re interested in here is the pages or page groups with the long ‘Render’ time (the cyan-coloured part of the load time bar). We’ll make these pages our top priority to optimize.

Step 3. Progressively implement optimizations

Next we’ll look at the offending page in Pulse Insights. Head to the ‘Insights’ dropdown on the main dashboard and click the ‘Pages’ tab. You’ll see this particular page has failed a lot of the performance rules:

You can find the page and observe the overall page score to maintain progressive web optimization

 

Pulse Insights lets us dig into the page trends to see which resources are causing issues:

 

The page view inside Raygun will give you a 'current score'

Now we know what’s wrong, we can take the necessary steps to improve our code to get things running faster.

Step 4: Fix a bug

Let’s start with clicking on a common performance issue, ‘Minify JavaScript’:

Important page speed rules need to be measured to assure progressive web optimization

You can even dig down into individual scripts and stylesheets:

Use the Pulse Insights script to adopt an attitude of progressive web optimization

 

Now it’s as easy as compressing those causing resources with a tool like UglifyJS, or adding JavaScript compression to your build flow with Grunt or Gulp.

Once that’s complete, we deploy our optimised scripts and we can mark these rules as passed!

Next you can work through this list of issues with the rest of the team and check them off as you go.

We can then go back to Raygun Pulse and see the page load time decrease and user experience improve, show this to the boss, high fives ensue.

In short…

Website optimization is not easy. Fortunately, it no longer has to be an uphill struggle.

Optimization is an ongoing battle, and should be a continuous improvement process. There will always be more pages, more features, more requirements, and more cooks in the kitchen. Automatic scanning, like that provided by Pulse Insights, means peace of mind, and a lot less tedious manual tracking.

Make sure your website is performing at it’s best with Raygun Pulse Insights, and impress your boss along the way. Take a free trial hereor get all your questions answered by booking a short demo with one of our experienced team members.

Related posts:

My ideal front end development workflow for a new project

Use the Pulse Insights Rules feature to improve website performance

We would absolutely recommend Raygun to any business which relies on healthy software to serve there customers. Andrew Schofield, Chief technology officer at Timely. Take a free 14 day trial. Request a short demo of Raygun.

Leave a Reply

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