Fix Slow LCP on Ucraft (Speed Guide) | OpsBlu Docs

Fix Slow LCP on Ucraft (Speed Guide)

Reduce Ucraft LCP by compressing hero images before uploading, choosing simpler block layouts, and limiting third-party integrations.

General Guide: See Global LCP Guide for universal concepts and fixes.

What is LCP?

Largest Contentful Paint measures when the largest content element becomes visible. Google recommends LCP under 2.5 seconds. Ucraft is a hosted website builder with a drag-and-drop editor, built-in e-commerce, and app marketplace integrations. Since you cannot modify server configuration or the underlying platform code, LCP optimization focuses on content preparation, image management, and minimizing the number of active integrations.

Ucraft-Specific LCP Causes

  • Uncompressed uploaded images -- Ucraft has limited automatic image optimization; large hero images serve close to their original size
  • Builder framework overhead -- Ucraft's drag-and-drop engine injects CSS/JS for the block layout system on every page
  • App marketplace integrations -- installed apps (live chat, email capture popups, analytics) each add their own scripts
  • Full-width video backgrounds -- video hero sections download large video files before displaying content
  • Multiple Google Fonts -- selecting many font families and weights in the design settings adds render-blocking CSS

Fixes

1. Optimize Images Before Upload

Ucraft has basic image handling, so preparation is key:

# Resize hero images to 1920px max width, compress to 80% quality
mogrify -strip -quality 80 -resize "1920>" hero.jpg

# Convert to WebP for smaller sizes
cwebp -q 80 hero.jpg -o hero.webp

# Targets: hero images under 200KB, content images under 100KB

In the Ucraft editor:

  • Use Element Settings > Image to check the displayed size and upload appropriately
  • Prefer JPEG for photographs, PNG only for logos with transparency
  • Avoid using the same 4000px image for both hero and thumbnail elements

2. Simplify Above-the-Fold Layout

  • Keep the first visible section to one background + headline + CTA button
  • Move image galleries, testimonial sliders, and team grids below the fold
  • Replace video backgrounds with static images and a play button overlay
  • Use solid color or gradient section backgrounds instead of large images when possible
  • Remove decorative elements (parallax scrolling, animated counters) from the first two sections

3. Minimize App Integrations

Review installed apps at Dashboard > App Marketplace:

  • Remove inactive or trial apps that still load scripts
  • Delay chat widgets (Tidio, LiveChat) to load after 5 seconds or on user scroll
  • Use Ucraft's built-in forms instead of third-party form tools (Typeform, JotForm)
  • Limit to one analytics platform (do not stack GA + Hotjar + Facebook Pixel + etc.)

4. Optimize Font Selection

In Ucraft's Design Settings > Typography:

  • Limit to 2 font families (one heading, one body)
  • Choose fonts with fewer weights (Regular 400 + Bold 700 only)
  • Prefer system-safe fonts for body text (Arial, Verdana, Georgia) -- zero download cost
  • If using Google Fonts, choose popular fonts that are more likely cached in visitors' browsers (Roboto, Open Sans, Lato)

5. Use Ucraft's Built-In SEO Tools

  • Enable Ucraft's SEO settings for each page to ensure proper meta tags
  • Use the Page Speed section in Ucraft's dashboard if available on your plan
  • Enable lazy loading in image element settings where available
  • Set proper alt text on all images (helps with accessibility and avoids reflow from alt text display)

Measuring LCP on Ucraft

  1. PageSpeed Insights -- the primary tool since you cannot access server configuration
  2. Chrome DevTools Network tab -- identify the largest resource in the waterfall; it is usually the hero image
  3. Compare pages -- test your simplest page vs. your most complex page to measure builder overhead
  4. Mobile testing -- Ucraft's responsive rendering may not resize images for mobile viewports

Analytics Script Impact

  • Add GA/GTM via Ucraft's Settings > Header Code / Footer Code section
  • Place tracking scripts in the Footer Code section, not Header, to avoid blocking render
  • Avoid adding more than 2-3 third-party scripts total
  • Ucraft's built-in analytics (if available) add minimal overhead