How to Use Optimization Settings

How to Change Optimization Settings

There is an option to choose whether to load the JS and CSS files only when Stackable blocks are used in the page, or to load them across the entire site.

  • Navigate to the WordPress dashboard and then go to Settings and then Stackable
  • This page will open where you will see Optimization Settings

Optimization: Frontend JS & CSS Files

The normal behavior for Stackable is to load all the CSS and JS files across all pages, which total around 30kb.

Since the JS and CSS are always loaded, it would have large benefits if you have minification and optimizations from other plugins such as Autoptimize. This would mean that your website visitors would only have to load 1 optimized JS and CSS file across the entire site, instead of multiple large optimized files. Given that, visitors would navigate faster through the site since the optimized file would already be cached by the browser (this is dependent on the website).

If you like to change the JS and CSS loading behavior and to only load these files in pages that use Stackable blocks, then toggle this setting to Load only in posts with Stackable blocks.

Take note that with this option turned on, it's possible to have a case with optimization plugins where the site would end up with different large JS and CSS files depending on what page the visitor is on. This might produce a slower browsing experience for your visitors.

  • e.g. if a visitor went to the frontpage that used Stackable blocks, and then visited the blog page, then they would potentially load 2 different large JS and CSS files

How does Stackable affect my page loading speed?