Performance

The HubSpot CMS Boilerplate has been optimized for performance. The HubSpot CMS Boilerplate website, which uses the HubSpot CMS Boilerplate theme has a website grader score of 97 and a Google Lighthouse desktop performance score of 98. While a lot of a template's performance can be impacted by changes made in the page editor, we've made the following updates to the HubSpot CMS Boilerplate to ensure that the template provides a good starting point for performance:

1. Cleaned up any template errors/warnings and resolved any code alerts to ensure the built-in CSS minifying and combining works properly.
2. Changed image file types, resized images, and compressed images to reduce the overall file size. There are several free tools out there for this. We used https://compressor.io for compressing images and https://png2jpg.com/ to convert images from PNG to JPG.
3. Reduced page requests as much as possible. As Google fonts are automatically loaded based on fonts added via theme settings, we removed the fallback Google font that was manually set in our base.html file.
4. Moved any applicable render blocking resources to the footer. We ensured that all JavaScript was pushed to the footer of the page using the require_js HubL tag and function.
5. Used vanilla JavaScript rather than jQuery as it is faster for the operations used within the HubSpot CMS Boilerplate.
6. Added lazy loading to blog images, HubSpot CMS Boilerplate specific modules, and on default image modules.
7. Used a template based code splitting technique so that template specific CSS was only included for that particular template.
8. Removed any unneeded/redundant code from the CSS.
9. Reduced use of vendor prefixes. We updated our browser list for autoprefixer and removed any unneeded vendor prefixes from the CSS.
10. Split out fallback CSS from main.css so that the CSS wasn't redundant to what was in theme-overrides.css but still remained optionally there if someone wanted to start out with the HubSpot CMS Boilerplate without using theme settings.

For more information on optimizing your HubSpot website please reference our Optimizing your CMS Hub site for performance article. If you are using the HubSpot CMS Boilerplate and notice a performance issue or would like to help us improve the performance of the HubSpot CMS Boilerplate, please reference our contributing guide here.