The HubSpot CMS is one of the most advanced and optimized content management systems on the market. We are constantly working on further optimizing your HubSpot hosted site, as well as offering solutions that you can implement to improve the speed and performance of your website.
2020 Edit: We now have a dedicated performance guide which does cover many of these topics.
Things HubSpot does behind the scenes to optimize your website.
Secure Socket Layer (SSL)
In October 2017, Google rolled out Chrome update which started to flag pages that contain a form, but are not SSL-enabled, as "not secure." As Chrome has approximately 47% of the browser market share, this update impacts millions of visitors, and marketers across the web.
Standard SSL is included for all Marketing Hub Basic, Professional, and Enterprise users. This change ensures that your traffic and leads are not affected by this Google Chrome update, and your visitors information remains safe.
HTTP/2 is a replacement for how HTTP is expressed “on the wire.” It is not a ground-up rewrite of the protocol; HTTP methods, status codes and semantics are the same, and it should be possible to use the same APIs as HTTP/1.x (possibly with some small additions) to represent the protocol.
The focus of the protocol is on performance; specifically, end-user perceived latency, network and server resource usage. One major goal is to allow the use of a single connection from browsers to a Web site.
All SSL traffic on HubSpot hosted websites is served using HTTP/2. Learn how to require the secure protocol here.
IPv6 is the most recent version of the Internet Protocol and expands the number of available addresses to a virtually limitless amount–340 trillion trillion trillion addresses. The Internet is running out of IPv4 addresses. Transitioning to IPv6 enables the Internet to continue to grow and enables new, innovative services to be developed because more devices can connect to the Internet.
All HubSpot hosted websites include IPv6 addresses so they can be natively accessed over IPv6.
CSS minification, and HubL includes
HubSpot automatically minifies (removes unnecessary spaces and line breaks) all of the included CSS files on a page. Additionally if you use HubL includes to combine CSS files it will perform that combination on HubSpot's end. This results in minimal HTTP requests and the speedy delivery and parsing of CSS on your website.
Lastly, the CSS files are sent using HTTP/2 Push, which means that browsers can start downloading all the CSS it needs even before the page’s HTML has finished loading.
NOTE: Every time you update your CSS files, we need to re-minify and combine the CSS files with HubL includes on a page, so there will be a short period before you see the combined-css version of your CSS files being served on live pages. Syntax errors can prevent us from being able to minify and combine your CSS files. Updates to external CSS files will not update combined-css files.
Browser and server caching
Every time a visitor requests a page, their browser makes a complex string of requests. These requests hit various servers which make complex calculations and routes to serve visitors their files.
HubSpot automatically caches pages and files on both the server and browser level to ensure the quickest delivery of all page assets to your website visitors. When your page or any dependency of your page (such as a template or module) changes, we automatically expire the server caches for that page.
Server caching is especially effective for mobile website visitors and visitors outside the US where network latency is higher.
Each additional domain used on your website incurs an additional DNS lookup and connection. The fewer domains you use, the faster your website will load. HTTP/2 supports loading multiple files simultaneously over the same connection, so the old guidelines for “sharding” your assets amongst multiple domains no longer apply.
The URLs of assets referenced in CMS pages such as files, CSS and images are automatically rewritten to match the domain of the current page when possible. So if you reference an image at http://cdn2.hubspot.net/hubfs/53/HubSpot_Logos/HSLogo_gray.svg on a page served on www.hubspot.com, the URL will automatically update to https://www.hubspot.com/hubfs/HubSpot_Logos/HSLogo_gray.svg.
Text-based files such as HTML, CSS and JS are all compressed using gzip before they are served to browsers. Compression can reduce file sizes by up to 10x. While minification speeds up the parse time of CSS and JS files in the browser, compression gets those files to the browser faster.
Image compression/optimization and automatic image resizing
When you upload an image to the file manager, images are automatically optimized. Specifically, JPEGs and PNGs are stripped of their metadata (EXIF and other stuff that make images bigger). All images are also recompressed to be visually lossless. Additionally, we may serve images in a different encoding if it can be represented as a smaller PNG than a JPEG.
Images are re-saved at 72dpi regardless of their original resolution. If you upload a file at 300dpi, originally created for print, it will saved at 72dpi, which is the standard for the web.
As the CMS renders a page, HubSpot automatically resizes images, looking for images that have width or height attributes. If those images are hosted on the file manager, we append width and/or height path segments to the image's URL. If the URL has a height or width parameter, the CMS intercepts that request and attempts to resize it to the requested dimension(s). Browsers are given multiple options for the image resolution to load, so your images will look crisp on standard and high-resolution displays.
Image optimization/compression and automatic image resizing are both enabled by default for all HubSpot hosted pages/files.
AMP, or Accelerated Mobile Pages, is a mobile-specific page format that loads content nearly instantaneously. AMP can be enabled on your HubSpot hosted blog posts with the flip of a switch. See How to use Accelerated Mobile Pages (AMP) in HubSpot for more details.
Things you can do to optimize your website
Load jQuery in the footer
Minimize HTTP requests and cross origin HTTP requests
Refrain from making too many HTTP requests for resources on your pages. Do your best to include as few files as possible on your websites (we automatically combine CSS files into a single, combined-css file). Additionally, cross-origin HTTP requests slow down pages and rely on external services performing in an efficient and reliable manner. Host everything you can within HubSpot to avoid fetching external and cross origin resources on your pages.