Translations

Asset Optimization/Manual

Asset Optimization/Manual

This lists Hummingbird configuration in the file you are importing.

This lists Hummingbird configuration in the file you are importing.

Import

Import

Compression removes the clutter from CSS and Javascript files. Smaller files, in turn, help your site load faster, since your server doesn’t have to waste time reading unnecessary characters & spaces.

Compression removes the clutter from CSS and Javascript files. Smaller files, in turn, help your site load faster, since your server doesn’t have to waste time reading unnecessary characters & spaces.

Here are the available options for the Asset Optimization Manual mode.

Here are the available options for the Asset Optimization Manual mode.

Don't show me this again

Don't show me this again

Preset configurations will be applied

Preset configurations will be applied

Got it

Got it

If a more serious issue should occur, a broken site can easily be fixed by disabling Automatic Optimization. Once this is done all the changes you made will be reverted back. After disabling the feature, it's also important to clear your browser and page cache, so you can see the changes. Next you'll simply need to verify the page is no longer showing the compressed version by checking the network tab in your console. As mentioned above, optimized files will either be served from our CDN or a local Hummingbird directory, and the file name will be hashed. Finally, note that Hummingbird also won't modify your original files… at all!

If a more serious issue should occur, a broken site can easily be fixed by disabling Automatic Optimization. Once this is done all the changes you made will be reverted back. After disabling the feature, it's also important to clear your browser and page cache, so you can see the changes. Next you'll simply need to verify the page is no longer showing the compressed version by checking the network tab in your console. As mentioned above, optimized files will either be served from our CDN or a local Hummingbird directory, and the file name will be hashed. Finally, note that Hummingbird also won't modify your original files… at all!

After enabling Automatic Optimization, files will be queued and when someone visits your site optimization will be automatically triggered via cron. To check if the page is optimized, you can use inspect mode and navigate to the network tab in your console. Optimized files, depending on your settings, will either be served from our blazingly fast CDN or a local Hummingbird directory (by default - /wp-content/uploads/hummingbird-assets/), and the file name will be hashed.

After enabling Automatic Optimization, files will be queued and when someone visits your site optimization will be automatically triggered via cron. To check if the page is optimized, you can use inspect mode and navigate to the network tab in your console. Optimized files, depending on your settings, will either be served from our blazingly fast CDN or a local Hummingbird directory (by default - /wp-content/uploads/hummingbird-assets/), and the file name will be hashed.

How Do I Know When My Files Are Optimized?

How Do I Know When My Files Are Optimized?

Before using Hummingbird to remove unused CSS, make sure to disable and/or remove the plugins that load unused CSS. To identify these plugins, check "Code coverage" in Google Chrome dev tools. Check the stylesheet URL to identify the plugin or theme responsible for that CSS file. Look for the plugins that have a lot of stylesheets in the list with a lot of red in code coverage.

Before using Hummingbird to remove unused CSS, make sure to disable and/or remove the plugins that load unused CSS. To identify these plugins, check "Code coverage" in Google Chrome dev tools. Check the stylesheet URL to identify the plugin or theme responsible for that CSS file. Look for the plugins that have a lot of stylesheets in the list with a lot of red in code coverage.

Step 5: Remove Unused CSS

Step 5: Remove Unused CSS

The next step is deferring the loading of scripts that are not needed to run immediately after a page has loaded (like a form processing or spam protection scripts). Use the "Force load this file after the page is loaded" button %s, which can be found in the "JavaScripts" section.

The next step is deferring the loading of scripts that are not needed to run immediately after a page has loaded (like a form processing or spam protection scripts). Use the "Force load this file after the page is loaded" button %s, which can be found in the "JavaScripts" section.

Step 4: Defer Some Of The Scripts

Step 4: Defer Some Of The Scripts