[Hummingbird] Elementor & Hummingbird

There seems to be a problem with Elementor Page Builder and Hummingbird. I need to manually clear page from cache each time I have done changes to a page in Elementor.
I thought the option "Clear full cache when post/page is updated" would help with this issue, but no such luck.

  • Adam Czajczyk

    Hello Kjetil Wikestad

    I hope you're well today and thank you for your question!

    I have just run some tests for this on my test site and I couldn't replicate the issue. When I checked the caching debug.log, it was showing that cache was purged upon editing. I could also see all the changes on front-end (checking in another browser as a not-logged in visitor) without the need to clear cache.

    However, it's possible that either my test was a bit "too simple" and I missed something or that there's something "interfering" on your setup. That being said, I would like to take a closer look at your site in order to test it again. To do so, I would need to be able to access your site so could you please enable support access for me?

    You can do it by going to the "WPMU DEV -> Support" page in your site's back-end and clicking on "Grant support access" button there:

    Let me also know, please, if there are any specific changes/steps I should make with Elementor to see the issue and where on your site (e.g. any specific page or can I just create some temporary page for testing?) can I test that.

    Best regards,
    Adam

  • Kjetil Wikestad

    Hi!

    I have done some research and I found the problem with Elementor and Hummingbird on my sites.

    On my webserver resources like css and js are set to expire in 8 days.

    I have optimized my assets in Advanced mode in Hummingbird so that a page only requests 1 .css file that contains all css for that page.

    If I use Elementor to make css changes on a page then the .css file for that page is updated, but my optimized page .css will not change. The only way for me to get an updated .css file is for me to clear the assets cache.

    To make things even worse, the updated hash name for the new .css is the same as the old one. So visitors to the site will only get an updated version after 8 days!

    To make this work I think the following is necessary:
    - Make sure that the hash is different each time files are created (Or maybe just add an cache busting version number)
    - Make an option for Hummingbird to clear assets cache each time a post have changed.

  • Predrag Dubajic

    Hi Kjetil,

    I was doing some additional tests but I'm afraid that I still can't replicate the issue, I tried with changing the color of the paragraph and the changes were visible to me right away.

    Are you making changes by using the Elementor options like color picker etc. or you're using Pro version and use Custom CSS option?

    Could you grant us support access to your site, as Adam mentioned above, so we can check your settings so we can create a detailed report to our developers?

    Best regards,
    Predrag

  • Kjetil Wikestad

    Hi, have done some more testing and I can know pinpoint exactly what the problem is.

    I have also given you support access.

    On the page https://infotech.no/itbase the two buttons doesn't match up (se image).

    The css for this page is stored in the file post-792.css

    If this file is compressed in Hummingbird then the two buttons mismatch, but when is not then the css is correct.

    This happens because the filename of the compress css file does not change even though the file have changes so that users will be served the cached version of the file if they have visited the page before.

    Therefore, if you visit the page you will see matching buttons because you get served a fresh copy of the file. But try to change som css and the page will not be updated. Try to purge the assets optimization and page cache and still the page will not be updated.

  • Adam Czajczyk

    Hello Kjetil Wikestad

    Thank you for your response and this detailed explanation. I can see that currently those two buttons that do not match on a screenshot, they do match on the page. Since purging asset optimization and page cache didn't help, can you tell me please what did help?

    Also, I would like to take a closer look at your setup to make sure that when I'm testing that on my test sites I'm doing it the right way, using configuration as close to yours as possible. Unfortunately, the support access that you enabled doesn't seem to work and I'm getting "expired token" error. That happens sometimes and in such case usually revoking and re-granting access helps. Could you please do it for me and let me know here when done?

    I'll then access the site to review its configuration so I could try to replicate the issue on my end fully and look for solution.

    Best regards,
    Adam

  • Kjetil Wikestad

    Hi, and thank you for helping me.

    So the problem is not a problem with Hummingbird per se, because Hummingbird creates a compressed version of the css file and serves that. But the problem is how Hummingbirds interact with the browser and webserver. The webservers tells the browser to cache .css files and users that revisited the site will not download any .css files.

    If I tell Hummingbird not to touch the file then the file is served as post-792.css?ver=123456, where the version number will increment on each change, meaning that this looks like a new file for the browser. So each change will trigger a new request for the file.

    When Hummingbird minimize the file it creates a new file, but do not keep the ver parameter. If only Hummingbird would change the filename each time it was created, then this would not be a problem, but since the filename is exactly the same browsers doesn't know that they need to redownload the file.

    I have regranted support access.