I am using Beaver Builder (2.9) and keep having issues where my theme is not loading.
It throws the following errors and I know these are either blocked or missing files when the page layout goes all screwy (the page still loads but it’s not styled or themed correctly).
Once we reset the server cache, everything is fixed. Then a day or two later… whamo… it happens again.
CSS -
Failed to load resource: the server responded with a status of 404 ()23-layout.css:1
JavaScript -
Failed to load resource: the server responded with a status of 404 ()23-layout.js:1
Beaver Builder -
Uncaught ReferenceError: FLBuilderLayoutConfig is not defined
I believe these are all directly related to BB but I cannot figure out what is causing the issues.
What’s really throwing me (I am not a back-end developer) is why would the CSS and javascript files be showing stored in the “cache”.
You are assuming the cache folder is like a static cache plugin would use.
Let me break down how things work and you will see the difference.
How a static cache plugin works
When a user visits one of your pages a buffer is opened, the page is rendered by wordpress and the the buffer is saved as a staic HTML page in a cache folder
When the next person visits your site the webserver looks in the cache folder to see if a static version of the page exists, if it does it passes that directly to the user. Wordpress is not even initialised at this point, so no PHP is even loaded. This is how caching works.
The cached page will continue to be served until either the static page’s lifetime expires or it is manually deleted by deleting that cached resource.
How Beaver Builder works
When a user visits a page WordPress is loaded and determines its a BB layout based on its location, BB renders that layout and based on user settings compiles the JS and CSS needed to render that page and stores it in the wp-uploads folder.
When the next user visits the page WP again determins the location/layout for the page and looks in that cache folder to see if the css/js already exists, if it does not then it goes back to step one and creates it for the next guy.
When a layout/page is updated then the compiled css/js in step is deleted so the next guy to look at the page lands at step one and the css/js is compiled and stored again
So the problem occurs when the site/page is statically cached by some cache plugin, then typically cached again by the hosts caching and more often than not cached yet again by a proxy like cloudflare.
So how do I end up with css/js 404s?
When you edit a page or something in BB or something else clears its compiled css/js like upgrading the plugion, or just manually deleting those files the page that your end user sees is still statically cached in the original step one, and those css/js url do not exist any more because BB has not had the chance to regenerate them.