This website uses cookies

Our website, platform and/or any sub domains use cookies to understand how you use our services, and to improve both your experience and our marketing relevance.

📣 Try the fastest hosting platform with pay-as-you-go pricing & 24/7 expert support! MIGRATE NOW →

Breeze v1.2 Released: A Look at the New Features this Major Update Brings

Updated on May 17, 2021

6 Min Read
breeze 1.2

Cloudways has released Breeze v1.2 with a focus on improving your Core Web Vitals compatibility and ultimately deliver a better PageSpeed Insights score for your websites.

If you still haven’t heard, Google will roll out its new page experience update this month. We recently launched a free Google Page Experience Checker to help you measure your site’s performance and other page experience factors against the update. In fact, since the start of 2021, we’ve focused heavily on improving our product and rolling out updates that deliver the best around Google page experience.

Before updating Breeze to the latest version, though, it’s highly recommended to backup your entire WordPress site or test the new release on a staging environment. The incompatibility of newer releases with other plugins can cause issues and random errors sometimes, so if you have a backup ready, you can quickly restore your WordPress site.

What’s New in Breeze v1.2?

Now, let’s take a brief look at what exciting new features Breeze brings in version 1.2.

Cross-Origin Safe Links

If you are familiar with SEO practices, you’ll understand the importance of “noopener noreferrer” attributes. This time, Breeze comes with a new feature that will automatically add a “noopener noreferrer” attribute to the links which have a “_blank” target value.

Note: Don’t add them in the WordPress editor as the editor adds noopener noreferrer automatically; add the links in your theme files. After adding the links, go back to wp-admin and save Breeze settings or Purge the cache.

cross origin safe links

– Cross-Origin Safe Links in Breeze

Some Use Cases

  1. _blank target value and no rel attribute, the feature will directly add the rel=“noopener noreferrer”.
  2. _blank, but the rel attribute contains the noopener value only, then noreferrer will be added. For instance, the link contains the noopener attribute only: <a href =”https://example.com”  target =”_blank” rel=”noopener”> example </a>.
    The feature adds the noreferrer attribute as well: <a href =”https://example.com”  target =”_blank” rel=”noopener noreferrer”> example </a>.
  3. _blank, but the rel contains the noreferrer value, then noopener will also be added.
  4. _blank target value and the rel contains both noopener noreferrer, there won’t be any change.
  5. href contains # link (ID), it would be ignored, which means no change.

Input code:

input code

– Input Code in the Theme Editor

Output of the code:

output of code

– Output of the Code

Font Remain Visible During Load

Fonts load when you visit a site, and the text isn’t visible during the loading time. To improve the user experience, you should use a technique that displays your text content (fallback font) while your font is downloading (font loading duration). Breeze has a new feature now that will help you to do that.

This feature will be visible when you check the CSS minification and only works for CSS minification and CSS Group options. To append font-display:swap attribute to CSS classes, we need to modify the content.

font remain visible

– Minification in Breeze

To test this feature, you can check the .css files in the view page source and search for @font-face. The attribute font-display will be added. If that font-face definition already has an attribute font-display, then nothing will be changed.

font display

– Font Display in CSS

Lazy Load Images

Lazy loading is a speed optimization technique that loads only visible images on the screen instead of loading the entire page’s images all at once. This can significantly improve load times and the user experience.

Breeze’s new release offers the Lazy Load Images feature in the Advanced Options. If you enable this option, the images are replaced by dummy transparent images as placeholders, and when it’s time to display, the original image will be loaded.

lazy load images

– Lazy Load Images in Breeze

The code recognizes data sizes and data-srcset attributes used for displaying the correct image size based on the resolution. The following attributes replace the original attributes:

data-breeze= src

data-brsrcset= data-srcset

data-brsizes= data- sizes

lazy load attributes

If you want to check whether lazy load images are working or not, press “CTRL + Shift+ I”Network → select img → scroll down your entire page.

breeze lazy load

– Check Lazy Loading in Your Browser

Preload Links

Preload links is another new feature we added to the Advanced Options menu to speed up your site performance and improve page speed results. When you hover your mouse on a link, this feature will create a cache, and the page will load faster when you open or visit that link again.

When the option is enabled at the back-end, a JavaScript file loads in the front-end, which is not dependent on any other libraries.

When a user hovers on a link for more than 150ms, a prefetch is enabled for that link, and page cache will be created. So when the user clicks the link, the page is ready to display the content instantly.

preload links

– Preload Links in Breeze

This feature doesn’t cache the entire next page on hover. Instead, it caches the request to deliver a little boost in site speed.

Note: By default, the link hover delay time is set to 150 ms. The URLs included in Never Cache these URLs will be excluded from preload loading.

Preload Your Web Fonts

The Preload Your Web Fonts feature is available in the Advanced Options and it’s simple to use. All you need to do is provide the local font URL or CSS file (URL) that loads only fonts. Very often, web fonts slow down your website speed and cause delays, hence it is recommended to choose a better solution that will help you tackle this issue.

With this update, we bring the Preload Your Web Fonts feature that will help you improve your site performance and remove the preload key requests issue.

preload webfonts

– Preload Your Web Fonts in Breeze

This feature will load specific fonts (added in the field) early instead of loading the fonts at the end, so you can experience better site performance and good Web Vital scores.

Delay JS Inline Scripts

The Delay JS Inline Scripts is a new feature available in the Advanced Options. This is designed to load your inline JS in the end, so your user and site speed tester will see no load time.

The concept behind this is lazy loading, where your inline js script will appear when you interact (scroll down, move cursor, etc.) with your website. This is a great technique to improve your site performance and Web Vital scores.

delay inline js scripts

– Delay JS Inline Scripts in Breeze

Here, you need to provide the key keyword for your inline js script like Google Ads, and it will automatically load a specific script at the end.

Summary!

The Cloudways team is working around the clock to make Breeze your go-to cache plugin. This is the first major release that offers six new exciting features that will help you improve your page speed experience and Web Vital scores.

When Google rolls out its Page Experience update this month, hopefully, your website will be ready to take advantage of the new update.

If you have any questions or feedback about Breeze v1.2, let us know in the comment section.

Share your opinion in the comment section. COMMENT NOW

Share This Article

Farhan Ayub

Farhan is a community manager at Cloudways. He loves to work with WordPress and has a passion for web development. Mostly, he spends his time interacting with the people in the WordPress community. Apart from his work life, Farhan spends his time gaming and playing sports. Feel free to contact him at [email protected]

×

Get Our Newsletter
Be the first to get the latest updates and tutorials.

Thankyou for Subscribing Us!

×

Webinar: How to Get 100% Scores on Core Web Vitals

Join Joe Williams & Aleksandar Savkovic on 29th of March, 2021.

Do you like what you read?

Get the Latest Updates

Share Your Feedback

Please insert Content

Thank you for your feedback!

Do you like what you read?

Get the Latest Updates

Share Your Feedback

Please insert Content

Thank you for your feedback!

Want to Experience the Cloudways Platform in Its Full Glory?

Take a FREE guided tour of Cloudways and see for yourself how easily you can manage your server & apps on the leading cloud-hosting platform.

Start my tour

CYBER WEEK SAVINGS

  • 0

    Days

  • 0

    Hours

  • 0

    Mints

  • 0

    Sec

GET OFFER

For 4 Months &
40 Free Migrations

For 4 Months &
40 Free Migrations

Upgrade Now