To keep a page builder site fast, measure real pages on mobile first, then resize and compress images, cut font families and weights, remove add-on plugins and widgets you do not need, and use page caching suited to your host. Page builder sites have a reputation for being slow, but most slow builder sites are slow for the same reasons any WordPress site is slow: oversized images, too many fonts, too many plugins and no caching. The builder adds its own layer on top, mostly in the form of extra CSS, JavaScript and nested layout elements, and that layer is something you can manage.
This guide shows how to measure a page builder site, where the usual problems are and what to change, in roughly the order that tends to matter most.
Key takeaways
- Test real pages on mobile settings with a tool such as PageSpeed Insights, and note which metric is poor.
- Resize and compress images, and do not lazy-load the main image at the top of the page.
- Use fewer font families and weights, and host fonts locally where your setup allows.
- Remove add-on plugins and widgets you do not need. Each one adds code.
- Use page caching suited to your host, and keep WordPress, Elementor and PHP up to date.
Measure first
Speed work without measurement turns into guesswork. Pick three or four representative pages, such as the home page, a service page, a blog post and the contact page, and test each one.
Tools
- PageSpeed Insights runs a lab test and, for pages with enough traffic, shows field data from real visitors.
- Your browser’s developer tools show every file a page loads, its size and when it loads.
- Google Search Console reports Core Web Vitals across the site once there is enough data.
What the metrics mean
| Metric | What it measures | Common causes of a poor result on builder sites |
|---|---|---|
| Largest Contentful Paint (LCP) | How quickly the main content, often a hero image or heading, appears | Large hero image, lazy-loaded hero image, slow server, render-blocking CSS and fonts |
| Interaction to Next Paint (INP) | How quickly the page responds to taps and clicks | Heavy JavaScript from sliders, animations, chat widgets and tracking scripts |
| Cumulative Layout Shift (CLS) | How much content jumps around while loading | Images without dimensions, fonts swapping late, banners inserted above content |
Write down the results before changing anything. Lab scores vary between runs, so look for clear differences rather than small swings.
Images
Images are the most common cause of slow pages and the easiest to fix.
- Resize before uploading. Upload images close to the largest size they will display, not straight from a camera or stock download.
- Compress them. Use an image optimization plugin or compress before upload. Modern formats such as WebP and AVIF are usually smaller than JPEG for the same quality, and WordPress supports them in recent versions.
- Use the right image size in widgets. Elementor’s image widget lets you choose a WordPress image size. Avoid “full” when a smaller size fits.
- Do not lazy-load the hero image. Lazy loading helps images further down the page, but the main image at the top should load immediately. Check that your optimization plugin and Elementor settings leave it alone.
- Watch background images. Large section backgrounds are easy to forget. Recent Elementor versions can lazy-load background images; check whether yours does.
- Limit sliders and carousels at the top of the page. They often load several large images where one would do.
Our website images guide covers sizes, formats and alt text in more depth.
Fonts
Every font family and weight is another file to download before text looks right.
- Use one or two families. Our font pairing guide shows how to get variety from one family.
- Limit weights. Regular and bold often cover everything. Each extra weight or italic is another file.
- Host fonts locally. Recent versions of Elementor include an option to load Google Fonts from your own server rather than from Google; check your version’s settings. This can help speed and may simplify privacy compliance.
- Avoid loading fonts you do not use. Templates sometimes reference fonts in sections you deleted. Check your global font settings.
- Consider icon fonts. Icon libraries loaded as fonts can be large. Recent Elementor versions can load icons as inline SVG instead; look for this in performance or features settings.
Add-on plugins and widgets
Elementor has a large ecosystem of add-on plugins that provide extra widgets. Each one may load its own CSS and JavaScript, sometimes on every page whether or not its widgets are used.
- List the add-ons you have installed and which widgets you actually use from each.
- Remove add-ons you use for one or two widgets if Elementor or another installed plugin can do the same job.
- Turn off unused widgets if the add-on has a setting for it. Many do.
- Check after removal that no pages show empty areas where a widget used to be.
The same applies to plugins in general. Every active plugin is code that runs and must be kept updated.
Layout structure
How a page is built affects how much HTML the browser has to process.
- Use containers where available. Recent Elementor versions use flexbox containers, which generally produce simpler markup than the older section and column structure. Converting old pages takes time, so start with your most visited ones or new pages.
- Avoid deep nesting. Containers inside containers inside containers add up. Flatten where you can.
- Do not hide heavy sections on mobile as a fix. Hidden elements are still loaded. Build a lighter layout instead.
- Keep pages focused. Very long pages with many sections, tabs and accordions load more than visitors need. Our landing page anatomy guide helps decide what each page needs.
Elementor’s own performance settings
Elementor has added several performance options over time, such as loading only the CSS and JavaScript each page needs, optimized DOM output, inline font icons, lazy-loaded background images and element caching. Some are on by default in newer versions; others are found under settings, performance or features.
When changing them:
- Back up and use staging if possible.
- Change one setting at a time.
- Regenerate Elementor’s CSS and clear caches.
- Retest your sample pages and check that nothing looks broken.
Animations, effects and third-party scripts
- Entrance animations delay content that is already there. Use them sparingly, and not on the main heading or hero image.
- Motion and parallax effects add JavaScript and can affect responsiveness on slower phones.
- Popups, chat widgets, video embeds and maps load code from other servers. Load them only on pages that need them, and use a click-to-load preview for videos and maps where possible. Property search pages are a common case; our real estate website guide covers maps and search on listing pages.
- Tracking scripts add up. Remove ones nobody reads.
Caching and hosting
Page caching
Page caching saves a ready-made copy of each page so WordPress does not rebuild it for every visitor. Many hosts provide it at server level; otherwise a caching plugin handles it. Use one caching system, not two competing ones, and check your host’s recommendations first.
Browser caching and CDN
Browser caching lets returning visitors reuse files they already downloaded. A CDN serves files from servers closer to visitors. Many hosts include both or make them easy to enable.
Hosting basics
- Run a current PHP version supported by your WordPress and plugins.
- Check server response time in your test results. If the first byte arrives slowly on every page, the issue may be hosting rather than design.
- Object caching can help sites with many logged-in users or a store; ask your host if it is available.
A speed checklist
| Area | Check |
|---|---|
| Images | Resized, compressed, modern format, hero not lazy-loaded |
| Fonts | One or two families, few weights, hosted locally where possible |
| Plugins | No unused add-ons; unused widgets switched off |
| Layout | Containers on new pages; shallow nesting; no hidden heavy sections |
| Builder settings | Performance options reviewed and tested |
| Scripts | Animations limited; embeds loaded only where needed |
| Caching | One page cache; browser caching; CDN if available |
| Hosting | Current PHP; reasonable server response time |
Troubleshooting after changes
| Problem | Likely cause | Fix |
|---|---|---|
| Layout broken after enabling a setting | Setting incompatible with an add-on or old page | Turn it off, regenerate CSS, test the add-on |
| Changes not visible | Cached CSS or page cache | Regenerate Elementor CSS; clear all caches |
| Fonts flash or swap | Fonts loading late | Host locally; reduce weights |
| Score improved but site still feels slow | Server response or third-party scripts | Check time to first byte and external scripts |
FAQ
Is Elementor too slow for a business site?
Many fast sites are built with page builders. Results depend on images, fonts, plugins, layout and hosting far more than on the choice of builder alone.
Do I need a paid caching or optimization plugin?
Not necessarily. Many hosts include caching, and free plugins cover image compression. Start with what your host provides.
Should I chase a perfect score?
No. Use the score to find problems. What matters is that real visitors on phones see content quickly and can use the page without delays.
Bottom line
Fast page builder sites come from the same habits as any fast site: measured changes, sensibly sized images, few fonts, few plugins, simple layouts and good caching. Measure a handful of real pages, fix the biggest problem first, retest, and keep a short checklist so new pages and template imports do not undo the work. Choosing a lightweight theme helps too; see our guide to choosing a theme for a page builder site.