How to Fix Gutenberg Editor That’s So Laggy

How to Fix Gutenberg Editor Thats So Laggy - How to Fix Gutenberg Editor That's So Laggy 3

The Gutenberg editor is a block editor introduced in WordPress 5.0 to replace the classic editor. It provides more customization features compared to the Classic Editor, but it’s not perfect. Users have reported issues with lag, slowdowns, and sluggish editing while using the Gutenberg editor. Here are the symptoms that you may be familiar with:

  • Typing is so laggy or delayed for a few seconds.
  • The title bar is extremely laggy and difficult to edit.
  • Blank or white screen after switching the browser tab.

If you’re a Gutenberg user, you may have experienced this performance issue. In fact, it’s like the editor is getting worse with every update. However, there are several potential fixes for this issue that work for me and hopefully will help you, too!

Update 30 November 2023: I found the main culprit seems to come from Grammarly. Turning off the Grammarly extension fixes the lag problem.

1. Remove blocks you didn’t use

Image 067 - How to Fix Gutenberg Editor That's So Laggy 5

By removing unnecessary blocks, you can streamline the editor and make it more responsive. Most of the time, you may only use about 10% of the available blocks. Reducing the blocks will help the server performance when Gutenberg is running.

To reduce the blocks, go to the Gutenberg editor > Options > Preferences > Blocks and then untick all the blocks that are deemed unnecessary. I have applied this to all of my WordPress sites, and I can tell there is a noticeable improvement.

Almost forgot, it’s also recommended to remove some unused meta boxes from the Panels setting.

2. Reduce unused plugins and try to streamline them

Image 068 - How to Fix Gutenberg Editor That's So Laggy 7

Excessive plugins can have a negative impact on the performance of the Gutenberg editor. Consider removing any unnecessary plugins or disabling those that are not actively being used.

However, Reducing installed plugins may be easier said than done. Another alternative is to start using a plugin that features extra functions. For example, opt-in for a cache plugin that comes with image optimization, use an SEO plugin that has built-in analytics, and many more.

3. Upgrade your server, whether you like it or not

Upgrades People Upgrades - How to Fix Gutenberg Editor That's So Laggy 9

It is crucial to upgrade your server to ensure optimal performance of the Gutenberg editor. This may involve upgrading your hosting plan, migrating to a more powerful server, or optimizing your server settings.

I have to admit that this is not a popular option given we need to pay extra for it. However, one alternative you can try is using a pay-per-hour hosting service like Cloudways where you can clone your website for testing if a powerful server can solve the issue.

This way, you only need to pay on an hourly basis, not a pricey yearly subscription. If you want to migrate your website to a better and yet cheaper hosting, check out my article on How to Migrate WordPress to Cloudways.

4. Other avenues to try

These are a few things that many blogs and people recommend on the internet with a great degree of success. But I’m going to include them just in case you want to give them a try:

  • The large table block in Gutenberg can slow down the editor. Make sure you limit the number of cells in the table.
  • Use the Classic editor. This is a controversial one, but the Classic editor is indeed lighter than Gutenberg.
  • Deactivate some plugins during the writing session. It’s not very practical, but definitely a doable solution.
  • Update plugins & WordPress. The newest versions may fix some performance issues.
  • Write on Google Docs, then import it to WordPress. I saw some people are fine with that.

These are a few potential solutions that may help improve the performance of the Gutenberg editor. Give them a try and see if they make a difference in your editing performance.

About The Author