WooCommerce offers a Gutenberg block called “Products By Category”. We make use multiple instances of this on our site’s landing page. With the help of the Query Monitor plugin, we noticed that the DB Queries was too high. Once we removed some or all the instance of this block, the DB queries came down by a lot (from ~550 to ~80).
After taking a look at it’s source, I noticed that it only caches the exact IDs to be resolved. The product details though have to be fetched everytime from the DB. Therefore, I modified render method to simply cache the final HTML output and show that instead. This drastically reduced DB queries as expected.
Ideally, I would like to modify the behaviour by writing a custom plugin/theme. Unfortunately, so far I haven’t found a proper solution to this yet. WC Blocks seem to be tightly integrated, with internal dependencies. It seems like there used to be a way to package the blocks separately as their own plugin, but it seems to be removed and no longer supported.
Currently, I am doing the following to get it working, but involves using reflection and thus I would like to avoid:
-
Use JS gutenberg filter to get current declared
render_callback, store reference to the object. -
Use PHP
ReflectionClassto modify/access properties within the object. use them in my custom render function. -
Use JS gutenberg filter to change
render_callbackto my custom function.