Will Gutenberg Blocks and ACF speed up your WordPress-based website?

Will Gutenberg Blocks and ACF speed up your WordPress-based website? WordPress is a good software for creating less and more complex websites. But every type of webpage has some specific requirements and needs adjustments so that the plain WordPress meets them. Developers have to create extra content fields to the WordPress edit screens in the admin panel, those fields are called custom meta fields. 

Read the article and find out how Gutenberg and ACF combination impacts a WordPress website.

ACF – Advanced Custom Fields and WordPress Themes

Creating meta fields can be done without any plugin, but it is a time-consuming process that can be improved. For a long time, the best practice for creating good WordPress themes was through the Advanced Custom Fields plugin. An add-on created by Australian Developer Elliot Condon. Advanced Custom Fields, often simply called ACF, have a great set of built-in field types like galleries, repeaters, color pickers, conditional logic fields, and much more (over 30 field types included). Developers can create new inputs in the admin panel, they can also put some logic into it, e.g. “show the gallery field only if the has_image checkbox is selected”. It helps to keep the admin panel clean and not overloaded.

The benefits of using ACF are not only seen in the WordPress dashboard but also in the code. Theme creators have many helpful functions to receive the values from the meta fields and display them or use them in the website display layer.  

Visual Editors in WordPress

On the other end, there are many visual editors offering possibilities to arrange the site for the user, but being often a developer’s nightmare. This way of building websites is very common in all the templates that you can find on different online marketplaces. Authors introduce these themes as versatile, but the sad truth is that they only look good on the demo pages. The moment you try to rebuild these themes or put some custom functionalities you end up using “dirty hacks” or it is simply impossible without a huge amount of development hours. (there are some exceptions though). Visual editors can also have a significant impact on page loading time and worse results in the page speed measurement tools.

Gutenberg – WordPress block editor 

In 2018 WordPress itself introduced a block editor called “Gutenberg”. On the official site you can find such information:

“Gutenberg” is a codename for a whole new paradigm for creating with WordPress, that aims to revolutionize the entire publishing experience as much as Gutenberg did the printed word“.

Comparison to the German inventor and founder of the printing press is, in this case, a little bit of over-expression, but the WordPress new editor certainly did a lot of good for the CMS. Especially the new WordPress editor has changed the way you can create content on your page.

Gutenberg and ACF

Going back to ACF, it has one main disadvantage compared to all the “visual builders”. In most cases, the layout was fixed and the administrator couldn’t change the order of the elements on the page. The theme developer sets the positions of the elements – not the user.

Gutenberg itself has many useful, basic, content blocks, but also allows creating custom ones. Like creating meta boxes – you can do it fully programmatically. Advanced Custom Fields since the 5.8 version gave a great opportunity to developers. It is now possible to combine WordPress Gutenberg blocks with ACF support. And this is a true game-changer. This relationship solves the “order issue”. Now the website administrator can decide about the position of each section on their site without any mess in the code. Custom blocks created by ACF guarantee a clean structure and are easy to maintain by the theme developer. 

Gutenberg, ACF, and WordPress page speed

The process of creating a page is not about replacing the custom fields with blocks. Meta boxes are still an important element in theme development. For example for options pages. But using Gutenberg blocks supported by ACF makes the process complex. Having one plugin for meta fields and Gutenberg blocks while using the native blocks functions speeds not only the site development process but also has a positive impact on the page loading speed. Advanced Custom Fields has over 2 million active installations all over the world. When using it on your site you have to guarantee that the plugin will be updated to the newest WordPress version, it is significant from a security point of view.

If you want to find out more about how we work with Gutenberg and ACF