Page Speed Insights

Follow

Google Page Speed Reports

Site speed reports issued to users by Google offer guidelines to make improvements and these change constantly.

Metro Publisher includes changes and improvements to our system with every release to stay abreast of new requirements for speed and SEO.

In some cases, the suggestions are Google's way to nudge developers to move in a direction they want. Each metric may not be critical or the impact may be negligible to your business. In addition, there are some local issues that may affect the results at any given time.

Speed (performance) is not equivalent to SEO. Sites with a speed/performance score of 14 can easily still score in the 80s range or above if you apply SEO best practices.

 

Third-Party Code

The largest culprit of fluctuating or low scores is typically third party services (including Google itself, i.e. Analytics and Google Ad Manager among others; with Facebook following or preceding closely), since these are scripts that load before the page is displayed.

The more third party scripts you run, e.g. Pico, YouTube, WisePops, etc., the more time the browsers spend evaluating, executing, and rendering those scripts.

In speed tests using Metro Publisher's standard themes without third-party code, we registered consistent scores in the top 90% in all key areas measured by Google's developer tool.

Our integrations simplify the configuration process and communication process between the respective third-party services and Metro Publisher, but we cannot influence the amount of resources third-party code requires to be loaded and performed.

 

without-gam.png

Google metrics for Metro Publisher sites without third-party code.

 

Example:

We made the following adjustments on a client site:

  • Stripped out all extra JS in the header and footer
  • Turned off third party services such as Google Tag Manager, Google Analytics, Google Ad Manager
  • Removed third party widgets such as weather widget, Instagram widget on homepage, and the radio broadcast widget

As a result, the performance score changed dramatically – raising from 26 to 86

In other words, websites across the world running third-party code will all see similar effects on their page speeds.

For reference, newspapers such as The New York Times have low to mediocre performance scores by Google's metrics for these same reasons:

 

Screenshot_2021-01-18_Site_Speed_Insights.png

Sample Google Page Speed scores for mobile (16) and desktop (40) versions of the New York Times (January 2021)

 

You should regularly review your header and footer scripts in your HTML Embed settings (and your Design Center JavaScript settings for Pro accounts) to make sure you know exactly what those scripts are for, whether they are from a reputable source, and whether they are necessary.

As a test, you can remove all the custom JS you have entered entirely, or step-by-step, making sure you save a copy (!), to see how your speeds improve.

 

Unused JavaScript

This metric refers to code that has been commented out, for example. Event though that code isn't being executed, its data must still load in the browser. Removing such code entirely, after saving a copy for potential future use (!), can resolve this issue.

 

Next-Gen Image Formats

Google is pushing for the WebP format with this metric, which currently is not natively supported by Safari, so we cannot recommend a switch from the current standard of JPG and PNG. Please note that PNG images will always be of a larger file size than the same image as a JPG.

 

Cumulative Layout Shift (CLS)

This is the definition of the metric:

CLS (Cumulative Layout Shift): The amount that the page layout shifts during the loading phase. The score is rated from 0–1, where zero means no shifting and 1 means the most shifting.


In other words, this is about image loading, and since we implement lazy loading (on purpose for performance), that is the trigger for this Google report. Lazy loading means images won't load until users scroll, so therefore, text will load first on any image-heavy site, especially when those images aren't compressed to an ideal filesize. This is to save time on loading your pages for the visible area in readers' browser windows.

Improving CLS would mean that the browsers would know the space that the image will need before the image loads, but that is difficult since we've got CSS and responsive design in play.

As long as website pages aren't jumping a lot for readers, which is what the CLS metric is about, then it's not really an issue. CLS is trying to measure user experience, rather than a technical problem.

We believe Google still needs to improve this metric, because it does not reflect the reality for website visitors in many cases.

That being said, there are things you can do to improve image loading on your site by reducing filesize or especially large images. That will affect the CLS. 

We have information on compressing images in Metro Publisher here:
Lossless Image Compression
Responsive Image Sizing

 

Settings in Metro Publisher

Please make sure you have the "Don't load requirejs and only load jquery on pages that need it." feature activated in our Beta Settings option here (logged in as admin):

Settings > Beta Features

Ticking that checkbox will keep JavaScript/JQuery from loading on all pages and restrict it to loading only on the pages that need it to function.

 

For mobile devices, Google AMP (Accelerated Mobile Pages), is the current "standard" set by Google, so you could consider turning that on: Google AMP

 

Need More Help?

Please feel free to reach out to us with any additional questions if you receive such a report and have completed the steps outlined above and we will do our best to answer them via our standard support ticket system.

If you would like us to search for ways to improve performance beyond the information we can give you there, we can provide that service via a  custom support package under the conditions outlined here: Custom Support

It is a process of elimination by turning off services and/or taking out third party code to see the effect. Then you can evaluate the importance of certain services vs. the impact on site performance.

 

Have more questions? Submit a request

Comments

Powered by Zendesk