HubSpot CMS gives you a global CDN, HTTP/2, automatic minification and image resizing out of the box. So when a HubSpot site loads slowly, the platform is rarely the cause — the build is. In every audit we run, the same handful of decisions account for most of the delay, and they are all fixable without leaving the portal.
This playbook is the order we work in on a real engagement: measure the right thing first, fix what blocks the first paint, then trim the payload that nobody notices until mobile. It complements our deeper diagnostic write-up on why your HubSpot website is slow and what Core Web Vitals actually measure — that post explains the metrics, this one is the implementation sequence.
Speed is also no longer just a ranking input. Slow pages lose conversions before they lose rankings, and AI crawlers that time out simply do not cite you. That is why performance is bundled into HubSpot technical SEO rather than treated as a separate project.
Step 0: measure the page that matters, on the device that matters
Do not optimise the homepage because it is the one you look at. Pull your top five landing pages by sessions from HubSpot analytics, then test each one in PageSpeed Insights on mobile and record the field data (CrUX) alongside the lab score. Field data is what Google uses; lab data is only a debugging aid.
Write the starting numbers down — Largest Contentful Paint, Interaction to Next Paint, Cumulative Layout Shift and total transferred bytes. Without a baseline you cannot tell whether a change helped or whether you just moved the problem.
One caveat specific to HubSpot: preview URLs and the live domain do not perform identically, because preview skips some CDN caching. Always test the published page on the production domain.
| Metric | Good target | Usual HubSpot culprit |
|---|---|---|
| LCP | Under 2.5s | Uncompressed hero image or a font-blocked headline |
| INP | Under 200ms | Chat widget, tracking scripts, heavy carousel JS |
| CLS | Under 0.1 | Images without width/height, late-loading banners and forms |
| Page weight | Under 1.5MB | Theme CSS/JS loaded on every template plus large PNGs |
1. Fix the image pipeline first — it is usually half the win
HubSpot's file manager will happily serve the 4000px PNG someone uploaded from a design tool. Resize before upload to roughly twice the largest rendered size, export as WebP, and let HubSpot's resizing parameters handle the rest. A hero that drops from 1.8MB to 120KB moves LCP more than any other single change.
Use HubSpot's `resize_image_url` HubL filter or the srcset support in the image module so phones do not download desktop assets. Set explicit width and height attributes on every image — missing dimensions are the most common cause of layout shift on HubSpot templates.
Lazy-load everything below the fold and, critically, do not lazy-load the hero. A lazy-loaded LCP image delays the very metric you are trying to improve. Add `fetchpriority="high"` to the hero instead.
2. Stop shipping the whole theme to every page
Marketplace themes and many custom themes attach one global stylesheet and one global JS bundle to every template, including landing pages that use three modules. HubSpot lets you attach CSS and JS at the template and module level — use it. Move slider, tab and animation code into the modules that need them.
Inside modules, prefer `{% require_css %}` and `{% require_js %}` blocks so assets load once, in the right order, only when that module is on the page. This is the change that usually takes a 900KB render-blocking bundle down to something reasonable.
If you inherited a theme you cannot fully restructure, our HubSpot theme customization work typically starts here: audit which assets each template actually needs, then unbundle.
{% require_css %}
<link rel="stylesheet" href="{{ get_asset_url('../../css/carousel.css') }}">
{% end_require_css %}
{% require_js position="footer" %}
<script src="{{ get_asset_url('../../js/carousel.js') }}" defer></script>
{% end_require_js %}3. Take fonts off the critical path
Three weights of two families, loaded from Google Fonts, will delay your headline by hundreds of milliseconds on a mid-range phone. Cut to the weights you actually use, self-host the files in HubSpot's file manager so they come off the same CDN, and set `font-display: swap` so text paints immediately.
Preload only the single font file used by above-the-fold text. Preloading everything is the same as preloading nothing — you just move the contention.
4. Audit third-party scripts ruthlessly
The fastest HubSpot template in the world still loses to five marketing tags. Chat widgets, heatmaps, A/B tools, two analytics platforms and an old retargeting pixel routinely add 400–800KB of JavaScript that competes with your own code for the main thread — and INP is the metric that suffers.
List every script in the portal's tracking code and each template's head. For each one, name the person who reads its data. Anything without an owner comes off. What survives gets loaded `async` or `defer`, and chat widgets get delayed until first interaction or scroll rather than on load.
This is also where HubSpot–GA4 double-tracking hides. If both are firing plus a tag manager container, you are paying three times for the same pageview, which is part of why your HubSpot and GA4 numbers never match.
5. Keep HubDB and dynamic pages honest
Dynamic pages built on HubDB are fast until a template loops the full table on every request, or runs several `hubdb_table_rows` calls to render one listing. Query once, filter with the API's own parameters rather than in HubL, and limit the columns you pull.
For large directories, paginate at the query level instead of rendering 500 rows and hiding most with CSS. The pattern we use for scaled listings is in HubDB programmatic SEO.
6. Forms, embeds and the shifting-layout problem
HubSpot forms load asynchronously, so any page that renders a form inline will shift unless you reserve space for it. Set a min-height on the form wrapper that matches the rendered height, and the same for embedded videos and maps.
Replace autoplaying background video with a poster image and a click-to-play, or a short compressed loop capped at a few hundred kilobytes. Video is the second-biggest payload offender after images on HubSpot landing pages, as we found rebuilding Mistertango's mobile experience.
7. Re-measure, then protect the gains
Re-run the same five pages, on the same devices, and compare against the numbers you wrote down. Expect the image and asset-scoping work to deliver most of the improvement, and script cleanup to deliver the INP change.
Then make it durable: add an image size limit to your content guidelines, review new modules for global asset attachments before publishing, and check Core Web Vitals monthly. Performance is a maintenance habit, not a one-off project — which is why it is part of every HubSpot support and maintenance plan we run.
HubSpot website load capacity: what kind of load will a site handle?
HubSpot website load capacity is not the same as page speed. Capacity describes how a site responds to concurrent demand; speed describes what an individual visitor experiences. HubSpot manages the hosting and CDN, but there is no single visitor count that establishes safe capacity for every site. Cached content, personalized experiences, external services and custom application endpoints have different constraints.
Before a campaign or traffic spike, map the complete visitor journey: landing page, form submission, search, booking tool and any custom API calls. A page can remain available while an external integration hits its rate limit or a booking embed stops responding. Check the current limits for each service and coordinate any planned load testing with HubSpot and the affected providers rather than sending uncontrolled traffic to production.
Build a launch checklist that separates browser performance from service reliability. Monitor response times and errors alongside successful submissions, and define a fallback for essential external tools. HubSpot Support & Maintenance can help investigate failures and maintain that checklist; it does not change HubSpot's platform limits.
HubSpot speed optimization: fix the existing site or rebuild?
Fix the existing site when the bottlenecks are isolated: an oversized hero image, a module that loads unused assets, or a script included on pages that do not need it. Test a representative page before making a site-wide decision. HubSpot Theme Customization is a suitable route when the current design and editor experience work but the implementation needs targeted changes.
Consider rebuilding templates when the same problems recur across page types, global dependencies make small changes risky, or editors cannot publish lightweight pages without developer intervention. A rebuild should address documented architectural problems, not simply replace one theme with another. Compare the scope of repairs with HubSpot Website Design & Development, including content migration, redirects, accessibility and testing.
Use the same acceptance criteria for either option: compare representative mobile pages, preserve working forms and tracking, and document which changes improved loading and interaction. A new theme is not automatically faster, and a higher lab score alone does not prove that visitors have a better experience.
HubSpot speed optimization: fix the site or rebuild the theme?
A slow HubSpot site does not automatically need a rebuild. Fix the existing theme when the main bottlenecks are isolated to a few modules, oversized assets or unnecessary dependencies. Test one representative page first: if targeted changes improve loading and interaction without breaking the editor, forms or tracking, extend those fixes through HubSpot theme customization.
Consider rebuilding when the same problems recur across templates and individual fixes require fragile overrides. Examples include duplicated frameworks, unsupported modules and layouts that depend on heavy JavaScript to display basic content. Compare the effort of repairing shared components with replacing them, including content migration, redirects and regression testing. A HubSpot website development scope should identify which components need replacing rather than assume every page must be rebuilt.
If you are comparing a HubSpot speed optimizer tool with a specialist service, ask what it can actually change. A diagnostic tool can flag slow resources, but recommendations still need implementation and testing. Require a list of affected templates, before-and-after measurements under comparable conditions, and checks that forms, consent controls and analytics still work.
HubSpot website load capacity: what kind of traffic can a site handle?
HubSpot website load capacity is different from page speed. Speed describes how quickly a visitor can see and use a page; capacity describes how the site behaves as concurrent demand rises. There is no reliable universal visitor limit to quote for every HubSpot site. Cached public pages, personalized content and pages calling external services have different dependencies, so monthly traffic alone cannot establish capacity.
Before a campaign launch, map the complete visitor journey: landing page, form submission, search, booking tool and any external API calls. Confirm current platform limits and testing requirements with HubSpot, and check quotas with each integration provider. A CDN can help deliver cached assets, but it does not remove limits on an external booking system or custom backend.
For an agreed, authorized load test, track response times, errors and successful completion of key actions—not just whether the homepage loads. Test browser performance separately on mobile, since a site can remain available under traffic while still feeling slow. Include campaign monitoring and a rollback plan in HubSpot support and maintenance.