WordPress.org
Get WordPress

Make WordPress Core

Opened 7 weeks ago

Last modified 7 weeks ago

#62882 assigned defect (bug)

"Navigation Block CSS (style.min.css) Loads Even When Gutenberg is Disabled"

Reported by: jvrajput420's profile jvrajput420 Owned by:
Milestone: Awaiting Review Priority: normal
Severity: normal Version:
Component: Editor Keywords: close
Focuses: css, performance Cc:

Description

When the Classic Editor plugin is enabled, the Gutenberg block editor is disabled. However, the stylesheet
wp-includes/blocks/navigation/style.min.css still loads on the frontend, even when block-based navigation is not used.

This causes unnecessary CSS to be loaded, affecting site performance and increasing unnecessary HTTP requests.

Steps to Reproduce:

  1. Install and activate the Classic Editor plugin.
  2. Go to Appearance → Themes and activate a non-block-based theme (e.g., Twenty Twenty-One).
  3. Check the frontend source code or inspect Network → CSS in Developer Tools.
  4. You will see that style.min.css?ver=6.7.1 from wp-includes/blocks/navigation/ is still loading.

Expected Behavior:

  • When Gutenberg is disabled, block-related CSS files should not load unless required.

Actual Behavior:

  • The wp-block-navigation CSS file loads unnecessarily, even when the site is not using block-based navigation.

Workaround/Fix (Optional):

A possible fix is to dequeue the stylesheet when Gutenberg is disabled:

function remove_gutenberg_styles() {
wp_dequeue_style('wp-block-navigation');
}
add_action('wp_enqueue_scripts', 'remove_gutenberg_styles', 100);

Environment:

  • WordPress Version: 6.7.1
  • Theme: Twenty Twenty-One (or any non-block-based theme)
  • Plugins Installed: Classic Editor (latest version)
  • Server: Localhost (XAMPP, LocalWP, etc.)
  • Browser: Chrome 120.0.0.0

Severity:

  • Medium (Affects performance but does not break functionality)

Change History (7)

#1 @joedolson
7 weeks ago

  • Focuses accessibility removed

#2 follow-up: @audrasjb
7 weeks ago

  • Keywords reporter-feedback 2nd-opinion needs-testing needs-patch removed
  • Version 6.7.1 deleted

Hello, welcome to WordPress Core Trac and thanks for the ticket!

Maybe this issue should directly be addressed on Classic Editor plugin side? Pinging @azaozz as the main maintainer (AFAIK?) of the plugin.

#3 in reply to: ↑ 2 @jvrajput420
7 weeks ago

Replying to audrasjb:

Hello, welcome to WordPress Core Trac and thanks for the ticket!

Maybe this issue should directly be addressed on Classic Editor plugin side? Pinging @azaozz as the main maintainer (AFAIK?) of the plugin.

Thanks for reviewing the ticket!

I understand that this issue might be related to the Classic Editor plugin. However, the CSS file (wp-includes/blocks/navigation/style.min.css) is being enqueued by WordPress Core, not the plugin itself. Even after disabling Gutenberg via the Classic Editor plugin, the file still loads unnecessarily, impacting performance.

Should this be handled in Core to prevent unnecessary styles from loading when block editor is disabled, or would it be better addressed within the Classic Editor plugin itself?

Looking forward to further insights. Thanks!

#4 @sabernhardt
7 weeks ago

  • Keywords reporter-feedback added

Could you share the stylesheet <link> in the context of some other styles and scripts around it, especially the one immediately following wp-includes/blocks/navigation/style.min.css? Also note whether it is in the page's <head> or the <body>.

I was not able to get the wp-block-navigation CSS without a Navigation block on that page. And I needed to use the should_load_separate_core_block_assets hook (in a plugin) to load block assets separately (because Twenty Twenty-One does not opt in to dividing styles for each block).

#5 @jvrajput420
7 weeks ago

@sabernhardt Thank you for your response and for looking into this issue!

Extra Stylesheets Being Loaded

On Astra Theme

  • The wp-block-library-css stylesheet is loading: 
    <link rel='stylesheet' id='wp-block-library-css' href='https://localhost/wordpress/wp-includes/css/dist/block-library/style.min.css?ver=6.7.1' media='all' />
  • This file loads even though Astra does not use Gutenberg block styling.

On Twenty Twenty-Five Theme (After Activating Classic Editor)

  • The wp-block-navigation-css stylesheet is loading: 
    <link rel='stylesheet' id='wp-block-navigation-css' href='http://localhost/wordpress/wp-includes/blocks/navigation/style.min.css?ver=6.7.1' media='all' />
  • This happens despite the Classic Editor plugin being activated, which disables the block editor.

Findings

  • I manually removed these styles from multiple projects and noticed no negative impact on layout or functionality.
  • After removing these styles, site speed improved, indicating that they were unnecessary in these cases.
  • The stylesheets are loading in the <head> of the page.

Let me know if further testing is required. Thanks again for your time!

#6 @sabernhardt
7 weeks ago

  • Keywords close added; reporter-feedback removed

I would expect that behavior with Astra (which uses Gutenberg by default) and Twenty Twenty-Five (which requires blocks).

The Classic Editor plugin does not completely disable the block editor; it enables the previous editor for posts. "Classic" PHP-based themes still have blocks for widgets (unless Classic Widgets is also activated), and block themes need block assets for anything outside the post content. The Classic Editor plugin even allows choosing between editors, either for individual posts or by post type.

If you want to disable blocks and remove all block-related assets in a classic theme, a plugin such as ​Disable Gutenberg would be more thorough.

#7 @jvrajput420
7 weeks ago

@sabernhardt Thank you for your response and for the clarification!

I understand that Astra and Twenty Twenty-Five rely on Gutenberg by default and that the Classic Editor plugin does not fully disable the block editor.

However, in my case, even after switching to Classic Editor and ensuring that no block-related features (such as block widgets) were in use, the wp-block-navigation-css file was still loading unnecessarily. Additionally, I manually removed these styles in multiple projects without noticing any layout or functionality issues, and it led to improved page speed.

I appreciate the recommendation to use the Disable Gutenberg plugin for a more complete removal of block-related assets. However, most developers may not be aware of this issue, and many might not check for unnecessary CSS files being loaded. Since this affects performance, it would be better to address this in WordPress Core rather than relying on external plugins to remove unnecessary styles.

Would it be possible to add a condition in Core to prevent these styles from loading when the block editor is not actively used?

Since this is not an issue that needs to be fixed in Core, I will close this ticket.

Looking forward to further insights. Thanks again!

Last edited 7 weeks ago by jvrajput420 (previous) (diff)
Note: See TracTickets for help on using tickets.