How to Use the Pulse Insights Rules Feature
How to Use the Pulse Insights Rules Feature
The Pulse Insights Rule feature scans your public web pages for performance and usability issues. Read on to learn more about it!
Join the DZone community and get the full member experience.Join For Free
Pulse Insights is a powerful new addition to the Real User Monitoring software tool Raygun Pulse. It will periodically scan all your public web pages for performance and usability issues that your end users are experiencing with the Pulse Insights Rules feature. The best part is that all your pages are scanned automatically, so there's no pasting in one URL and waiting for the results of a single page.
Here’s an example of how Pulse Insights looks inside your dashboard:
Raygun uses a set of 22 industry standard rules to build an accurate picture of your website performance. For each rule, Raygun offers an actionable and practical solution for your software development team to enable a fast fix.
Let’s take a look at the rules in detail so you know exactly what Pulse Insights is looking out for on your site. I’ve broken them down into rules that help usability of your application and rules that help the performance of your application.
Let’s start with usability.
There are countless statistics on the correlation between user-friendly websites and retention rates. It makes sense for your website to be as user-friendly as possible. Pulse Insights helps target key areas like navigation and poor load speed.
Let’s take a look at the specific rules that help spot usability issues Pulse Insights.
Plugins are legacy technology. Content should be created using native web technologies to ensure that content can be accessed on all devices. Third-party plugins are also the leading cause of crashes and security incidents on pages that utilize them.
Pulse Insights has separate rules for avoiding Flash, Java, and Silverlight plugins, so you know exactly which plugin needs to be removed.
HTTPS by Default
HTTP does not encrypt the communication between websites and an end user’s browser. The effect of this is to transmit all data in plaintext. This is insecure and opens up both your website and end users to potential security breaches and eavesdropping by malicious third parties.
HTTPS encrypts all communication between websites and an end user’s browser, maintains data integrity and uses certificates to authenticate servers.
The viewport specifies how a page is displayed on a mobile device. The absence of a viewport means pages will render like they would for a desktop. Horizontal scrolling or zooming out to view content does not provide a good user experience.
We’ve already looked at how vital fast page load times are to your company. Improving your website’s load speed is perhaps the most crucial factor in user experience, which is why most of the Pulse Insights rules target areas where you can increase your website’s performance.
Let’s take a look at these rules below.
document.write() causes the browser to finish processing the code inside itself before continuing to load a page. This can significantly increase the page load time.
Any logic in document.write() code can be achieved using HTML. If you have an HTML or script file that includes document.write(), just use HTML to mimic the same behavior.
Avoid Large Image File Size
Every image on a page is downloaded from your server to the end user’s browser. If images are not optimized for the web, the page load time can seriously suffer and frustrate your users.
Reducing the image file size is an easy way to reap huge rewards when it comes to cutting down the overall page load time.
Avoid Setting Charset in the Metatag
Specifying the charset in the meta tag disables the lookahead downloader in IE8. Disabling the lookahead downloader can increase the page load time.
Setting a charset in the HTTP content-type response header in HTML files allows the browser to start loading HTML and scripts immediately.
Enable Gzip Compression
When a user hits your website a call is made to your server to deliver the requested files. The bigger these files are, the longer it takes for them to get to your browser and appear on the screen.
Setting the connection HTTP response header to keep-alive maintains a persistent TCP connection.
Leverage Browser Caching
When end users first visit a website, resources are fetched over the network and may require multiple trips between the client and server. Caching stores the most commonly used files, making subsequent website visits much faster.
Minification is the process of removing all unnecessary characters from code while maintaining its functionality.
This is usually done automatically as part of the build process, usually by a minification tool. Minification also reduces network latency (the time it takes for data packets to get from one point to another), leading to faster browser load times.
A redirect requires an additional HTTP request-response cycle and delays the page load. Remove unnecessary redirects, especially if they are on the landing page.
Optimize Script and Style Order
Browsers load scripts and styles in the order they appear in an HTML document. If your HTML document contains styles, putting external scripts at the end of the tag renders the page faster.
Prefer Async Script Tags
Instead of waiting for a script to finish downloading before the page renders, async scripts are downloaded in the background. This means the browser can continue rendering HTML that comes after the asynchronous script tags.
Resources Share a URL
Specify Image Dimensions
Setting the image’s width and height ensures the dimensions are correct before the image is loaded. This avoids HTML document reflows and repaints, both of which can significantly impact page load.
Published at DZone with permission of Yosan L . See the original article here.
Opinions expressed by DZone contributors are their own.