How can I improve my page speed in Webflow, specifically regarding render-blocking resources and unused JS? My site's mobile speed is slow due to Webflow sending one large JS file instead of splitting it into smaller packages.

Webflow's built-in JS bundling can cause slower mobile performance due to large, render-blocking JavaScript files. While you can't directly split the Webflow default JS bundle, you can take several targeted steps to minimize its impact and improve your mobile page speed.

1. Optimize Third-Party Scripts

• Reduce or defer third-party scripts (e.g., chat widgets, analytics tools).
• Use Google Tag Manager to load scripts conditionally or after interaction.
• Add async or defer attributes via an Embed code block when injecting custom scripts to prevent render-blocking.

2. Minimize Webflow JS Dependencies

• Avoid complex Webflow interactions (especially on mobile) that auto-generate JS.
• Remove unused interactions, sliders, tabs, or lightboxes that load extra scripts.
• Keep animations minimal—especially on page load.

3. Use Page-Specific Custom Code

• Only inject custom JS/CSS that’s needed for a specific page using the Page Settings > Custom Code field, rather than site-wide code.
• This ensures unnecessary scripts aren’t loaded on every page.

4. Delay Non-Essential Scripts

• Use a custom script loader (like Partytown, Quicklink, or native JS**) to load non-critical JS after initial page load.
• For example, delay loading of scripts that power animations, carousels, or modal behavior not needed above-the-fold.

5. Audit Webflow Components

• Elements like Navbar, Dropdowns, Tabs, and Sliders add significant JS even if not fully used.
• Use basic elements instead of Webflow components when custom behavior is unnecessary.
• Replace Webflow tabs or sliders with pure CSS equivalents where possible.

6. Image and Asset Optimization

• Ensure all images use WebP format and have lazy loading enabled (loading="lazy").
• Check your asset panel for unused files; while not directly render-blocking, they bloat site exports.

7. Offload Content with Embeds Strategically

• Embeds like YouTube iframes can block rendering. Use thumbnail-only previews or lazy loading with user interaction in place of auto-loading iframes.

8. Use Google's PageSpeed Insights + Chrome DevTools

• Run affected pages through PageSpeed Insights and note specific JS and CSS flagged as unused or render-blocking.
• In Chrome DevTools > Performance > Coverage, you can see percentages of unused CSS/JS for refinement.

Summary

To improve Webflow mobile page speed, reduce reliance on Webflow’s auto-generated interactions, defer non-critical scripts, customize per-page code, and avoid unnecessary component use. While you can't split the Webflow JS chunk directly, you can reduce its size and its blocking effect considerably.