Cleaner HTML and Faster Load Time with Astra 2.1!
Sujay Pawar

October 3, 2019

Astra 2.1 is Out with Cleaner HTML and Faster Load Time!

Astra-2.1

A few weeks ago we launched our most ambitious update yet – Astra 2.0!

To be honest, we were a bit surprised by how customers really loved the new release.

Here are just a few responses from the community that made us happy ?

I only shared a couple here – but there are plenty more reviews and feedback we have received – on our blog, email replies and also on social media.

But, as you know we can’t just stop there, right? 🙂 

We made a promise to add more customizations, enhancements, and updates in the near future.

And as you know by now – continuous and never-ending improvement is a core part of our cultural DNA!!

So, I am excited to announce our latest update Astra 2.1!

In version 2.1 we are launching a method to generate a CSS file for Astra – so that CSS will not show up inline in the Source Code.

This will make it relatively easy for the browsers to cache CSS (which means an improvement in load time and speed).

Read on to learn what’s changed, and how it will benefit you and your website.

The Past… Inline CSS

Up until the recent update (Astra 2.0) –  whenever you made any changes to your website using the Astra Customizer – the theme generates a dynamic CSS.

This Dynamic CSS was added to every page of your website.

Astra CSS Code:

Here’s what we learned from the feedback our customers gave –

The inline CSS generated by the Astra theme – made the HTML look a little bulkier. 

Sophisticated users and developers always want a cleaner HTML.

Well – we have heard that! And here’s what we have changed.

The Path Forward… CSS File Generation

With today’s update – Astra 2.1 – we are further delivering on our promise to help you create faster websites.

Once you have updated your Astra theme and Astra Pro Addon Plugin to version 2.1, you will see a new option on the Astra Options page as below:

When you enable it – you will notice that the inline CSS will not show up in the Source Code anymore.

The inline CSS will now be added as a separate file.

Note that this option is available with the Astra Pro.

Based on your settings in the Astra Customizer – the CSS file will be generated for each of the pages and will be loaded along with the page. So instead of generating inline dynamic CSS every time, a separate file will serve required CSS from the addon. Browsers can easily cache this file.

You can read how these CSS files are named here.

What Does This Mean for You?

There are a few benefits that you will notice with this update.

This will make the browser caching faster.

And this improves your website’s response time, which means your users/customers can retrieve your web pages and content faster.

We are getting there folks !! 

This update will improve your site loading speed with 8.47% 🙂

Our mission to make websites faster is a never-ending quest –  and we will help you get there (one update like this at a time).

Here is a detailed document that will show how to get started with this update?

Stay tuned for more updates like this (coming soon). To get a preview of what’s coming down the path – here’s where you will find our public roadmap. In case of any query write to our awesome support team.

As usual – we always welcome your feedback.  Please let us know your thoughts in the comments below!

Join 208,419 Subscribers

Get exclusive access to new tips, articles, guides, updates, and more.

About the Author

Sujay is CEO and Co-Founder of Brainstorm Force, the company behind Astra. He is a diehard entrepreneur, growth hacker, and YouTube addict. Get in touch with him on Twitter @sujaypawar.

Sharing is Caring!
Share on facebook
Share on twitter
Share on telegram
Share on whatsapp
Share on facebook
Share on twitter
Share on telegram
Share on whatsapp

27 comments

  1. 1) So to be clear, upon update everything will initially work the same as before (inline) – and then we would need to activate the new feature using the ‘enable’ button.

    2) Would I be correct that once enabled, we could then disable it, back to inline?

    3) And if there is no CSS in the customizer – and feature enabled – then no (blank) css file is generated, correct?

    Thank you.

    1. 1. Correct.
      2. Correct
      3. The inline CSS is generated for the options in the customizer. So there is always some inline CSS which you can output as a separate CSS file after Astra 2.1 🙂

      1. Ah that’s right – I was only thinking about the added css section – but there are the other elements too. All makes sense. Well thought out. Thanks much

  2. This is solid Sujay! Really love this as I’ve spent a ton of time optimizing my sites (all Astra now) and seeing that in-line Astra CSS was always a little rough on the eyes ;).

    This is great.

    Thanks!

  3. Speed and optimization are important! Definitely a deciding factor in switching to Astra. Thank you for keeping this a priority!

  4. What if we have a plugin that doesn something similar, do we leave this or disable that in the plugin and use this feature?

    1. If you’re already using a plugin to take all inline CSS into a dedicated CSS file, you can skip this optional feature we have added in Astra 2.1

    1. Because inline CSS is good in some cases. This change is not suitable for all sites out of the box and it should be enabled case-by-case basis.

    1. A theme alone does not give you good grades in page speed tools. And quite honestly — the speed testing tools are quite dated and their grades do not make any difference. What one should follow is the time it takes to load the website for your visitors.

  5. Gary Buckingham

    Awesome guys!! Astra period!! Quick question we have WPRocket on all of our Astra sites will this update with inline CSS conflict with WPRocket?

    Thanks ??

  6. Hi, thanks for the update.

    1. Why is there an Enable button, surely this feature should be default?
    2. Why would anyone want to Disable the feature later?

    Thanks

    1. We have not tested this particular plugin ourselves. But Astra 2.1 plays well with all caching and minification plugins. So there should not be any problems. If you need any help, please feel free to lodge a support ticket.

  7. Hi

    I am also using Elementor page builder to build part og my website. If I enable this option, how will it impact my website?

    Thanks

Leave a Comment

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

Recommended Articles

Scroll to Top
Like what you read? Leave a comment

Subscribe to Our Newsletter