Mobile menu breaks with Aggregate JS-files enabled
-
Love the plugin! Very effective!
I’m having a problem where my mobile hamburger menu breaks and becomes unresponsive when I enable “aggregate js-files.” I know I probably have to exclude some JavaScript but I’m not knowledgeable enough to begin to know where to find this. Any help would be appreciated! Url is [snip]
-
This topic was modified 3 years, 4 months ago by
tobifjellner (Tor-Bjorn “Tobi” Fjellner). Reason: Redundant link removed
The page I need help with: [log in to see the link]
-
This topic was modified 3 years, 4 months ago by
-
that looks like elementor fulltimesav, try adding
wp-content/plugins/elementor/assets/js/frontend-modules.min.jsorwp-content/plugins/elementor?Thanks for the quick response! I tried both of those exclusions separately and the menu is still unresponsive. Any other ideas?
ah … so what errors do you see on the browser console when “aggregate js-files” is active?
This is what I see when “aggregate js-files” is active:
JQMIGRATE: Migrate is installed, version 3.3.2
(index):1434 GET https://cdn.viglink.com/api/vglnk.js net::ERR_BLOCKED_BY_CLIENT
(anonymous) @ (index):1434
(anonymous) @ (index):1435
instant-page.min.js?ver=3.10.3:1 Uncaught SyntaxError: Identifier ‘a’ has already been declared (at instant-page.min.js?ver=3.10.3:1:1)
functions.js:1056 Pixel Manager for WooCommerce: free | distro: fms | version: 1.30.2
analytics-talk-content-tracking.js?ver=1.16.2:49 Article loaded
DevTools failed to load source map: Could not load content for https://www.jasonguyphotography.com/vegas.min.css.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE
DevTools failed to load source map: Could not load content for https://www.jasonguyphotography.com/wp-content/plugins/download-manager/assets/bootstrap/js/bootstrap.min.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILUREonly possibly relevant error is the instant page one; does the issue persist if instant page is (temporarily) disabled?
Is instant page an option in Autoptimize? I’m not seeing that option.
I just tried excluding: instant-page.min.js
that didn’t work if that’s what you meant for me to try.
no, instant page is not an option in AO and excluding it would not work as the error indicates it is already excluded. I had a look at the HTML source and instant page seems to be part of Elementor Pro, so it might be an option there somewhere?
what you could also try; untick “aggregate JS” and activate “don’t aggregate but defer” + “also defer inline JS” instead, optionally removing all exclusions (keep them copy/ pasted somewhere so you can reapply them later if needed)?
I looked for a way to disable the instant page in both the Elementor pro plugin and the regular Elementor plugin. I didn’t see it in the settings in there and couldn’t find any mention of this in a google search.
The mobile menu works with “do not aggerate but defer” however the page speed insights report show performance is only marginally better than without autotomize. The “aggregate all linked js files” option was much more effective for increasing my performance.
Any other ideas I can try?
The mobile menu works with “do not aggerate but defer” however the page speed insights report show performance is only marginally better than without autotomize. The “aggregate all linked js files” option was much more effective for increasing my performance.
that is somewhat surprising .. might your site not be on HTTP/2 yet? if so do check with your host as this removes the need for aggregating (HTTP/2 allows for much more efficient use of one and the same connection to download multiple files concurrently in which case aggregation is not really useful any more)?
Any other ideas I can try?
Well, in the JS optimization exclusion field, you could try excluding one of below each line and report back?
*
wp-content/themes
* ORwp-content/plugins
* ORwp-includes/jsbased on that we could see if more specific exclusions are needed/ possible?
I tried all of these exclusions individually with the aggregate all linked js-files” option enabled and none of them fixed the menu. Checking with my host about http/2 now.
I just confirmed with my host that http/2 is enabled on my site
grasping at straws maybe but can you (re-)try to add
wp-content/plugins/elementor-pro/assets//lib/instant-page/instant-page.min.jsto the JS exclusion list (and keep it excluded for me to check results)?Ya sounds good. I added those exclusions. Let me know what you suggest.
Also I’m not sure if this would be helpful but this was what my host told me when I was check about the http/2:
“I did find some entries in the logs regarding addon-elements-for-elementor-page-builder, but not sure if this is causing the error with the plugin.”
They also said:
“The Admin team just confirmed that other than the error I pointed you at, there really isn’t much we found. The cause of the error you shared might be pointing to a possible conflict with WooCommerce. You could try to disable WooCommerce and run the optimize again, or you could get back to the developer and confirm that we do use HTTP/2 so they can investigate further.”
Excluding indeed does not fix the problem, the only solution I can think of at this point is (again) looking in Elementor for the option (likely labeled somewhere under “performance”) to try to disable instant-page.min.js (as that seems to be declaring a variable that is also used by other JS without it being scoped correctly, causing a JS error)?
The topic ‘Mobile menu breaks with Aggregate JS-files enabled’ is closed to new replies.