The async attribute for scripts is supported in Edge @lf2983182, see https://caniuse.com/#feat=script-async
So first thing would be to test all combinations of AsyncJS, AO & wp rocket to see which one might be causing this?
Thread Starter
Linda
(@lf2983182)
I have been working over a week on this. I think I almost have exhaused all test combinations. I’ve cleared all caches, disabled all plugins, turned them on 1 by 1. It seems to point to the combination of WP Rocket, Autoptimize and AsyncJavascript. Every seems fine until Async is enabled. Just when I thought Chrome and Firefox were ok, I brought up site and wound’t load properly, all formatting was gone. If I pressed refresh, the front page would finally load correclty. Usually it only took one refresh but this time I pressed refresh 3 times before screen appeard. I would love to use both Autoptimized and Async together as Async greatly increases the speed score. Anyone have any thought on this as to whats going on and how to fix??
-
This reply was modified 7 years, 1 month ago by
Linda.
hmmm, in that case when you have such a white page can you check;
* if when doing “view Source” you see HTML or not
* what JS errors you see on the browser console
Thread Starter
Linda
(@lf2983182)
Yes, I can see HTML’
The screen is not white but a transparent black. It seems to be clocking and trying to load but never finishes. You can see some of the page thru the transparency.
and any JS error on the browser console?
Thread Starter
Linda
(@lf2983182)
Yes, lots
Uncaught TypeError: Cannot read property ‘noConflict’ of undefined
at (index):63
(index):82 The value for key “maximum-scale” is out of bounds and the value has been clamped.
altsupersized.js:13 Uncaught TypeError: a is not a function
at altsupersized.js:13
at altsupersized.js:13
nxssupersizedshutter.js:301 Uncaught TypeError: Cannot read property ‘supersized’ of undefined
at nxssupersizedshutter.js:301
at nxssupersizedshutter.js:342
(index):102 Uncaught TypeError: jQuery is not a function
at (index):102
nxs-script.js?v=3.0.190122.1937:69 Uncaught TypeError: $ is not a function
at nxs-script.js?v=3.0.190122.1937:69
at nxs-script.js?v=3.0.190122.1937:113
2jsapi:23 A parser-blocking, cross site (i.e. different eTLD+1) script, https://ajax.googleapis.com/ajax/libs/webfont/1.0.29/webfont.js, is invoked via document.write. The network request for this script MAY be blocked by the browser in this or a future page load due to poor network connectivity. If blocked in this page load, it will be confirmed in a subsequent console message. See https://www.chromestatus.com/feature/5718547946799104 for more details.
google.loader.f @ jsapi:23
nxs-script.js?v=3.0.190122.1937:6223 Uncaught ReferenceError: Modernizr is not defined
at nxs_js_updatecss_themecss_actualrequest (nxs-script.js?v=3.0.190122.1937:6223)
at nxs_js_colorshake (nxs-script.js?v=3.0.190122.1937:9546)
at (index):503
(index):587 Uncaught TypeError: jQ_nxs is not a function
at (index):587
(index):613 Uncaught TypeError: jQ_nxs is not a function
at (index):613
(index):645 Uncaught TypeError: jQuery is not a function
at (index):645
(index):713 Uncaught TypeError: jQuery is not a function
at (index):713
nxs-script.js?v=3.0.190122.1937:878 nxs-script-deferred.js ******
nxs-script.js?v=3.0.190122.1937:878 loading css [start]
nxs-script.js?v=3.0.190122.1937:878 loading css [done]
jquery-migrate.min.js?ver=1.4.1:2 JQMIGRATE: Migrate is installed, version 1.4.1
nxs-script.js?v=3.0.190122.1937:878 loaded admin.css
whoa, that’s a whole lot of errors …
what I propose is to take a step back first and foremost, testing:
1. site without WP Rocket, AO and AsyncJS: do you have JS errors?
2. site with WP Rocket but without AO and AsyncJS: do you have JS errors?
3. site with WP Rocket and AO but without AsyncJS: do you have JS errors?
the step where the answer is “yes” is the point at which you will need to start troubleshooting, only advancing to the next step when JS errors are gone really.
alternatively you could start to randomly exclude plugins or your theme from being Asynced, until the screen isn’t black any more in Edge, but in that case you might have less visible problems lingering around (as per JS errors on the browser console).
hope this helps,
frank
Thread Starter
Linda
(@lf2983182)
Answer to 1 is no. Answer to 2 is no. Answer to 3 yes.
(index):12 Uncaught TypeError: Cannot read property ‘noConflict’ of undefined
at (index):12
(index):19 The value for key “maximum-scale” is out of bounds and the value has been clamped.
(index):19 Uncaught TypeError: jQuery is not a function
at (index):19
2jsapi:23 A parser-blocking, cross site (i.e. different eTLD+1) script, https://ajax.googleapis.com/ajax/libs/webfont/1.0.29/webfont.js, is invoked via document.write. The network request for this script MAY be blocked by the browser in this or a future page load due to poor network connectivity. If blocked in this page load, it will be confirmed in a subsequent console message. See https://www.chromestatus.com/feature/5718547946799104 for more details.
google.loader.f @ jsapi:23
(index):395 Uncaught ReferenceError: nxs_js_colorshake is not defined
at (index):395
(index):407 Uncaught TypeError: jQ_nxs is not a function
at (index):407
(index):425 Uncaught TypeError: jQ_nxs is not a function
at (index):425
(index):445 Uncaught TypeError: jQuery is not a function
at (index):445
(index):449 Uncaught TypeError: jQuery is not a function
at (index):449
autoptimize_84456081759849a001185a299bc97f8e.js:64 Uncaught TypeError: jQ_nxs is not a function
at autoptimize_84456081759849a001185a299bc97f8e.js:64
this one;
(index):19 Uncaught TypeError: jQuery is not a function
at (index):19
is the most important one, indicating you’ll have to exclude jQuery from being asynced for starters.
Thread Starter
Linda
(@lf2983182)
Optimize HTML Code? On
Optimize JavaScript Code? On
Aggregate JS-files? On
Optimize CSS Code? On
Save aggregated script/css as static files? on
Also optimize for logged in users? on
WP Rocket has all file optimazation off.
What settings should I be using?
-
This reply was modified 7 years, 1 month ago by Linda.
those are Autoptimize settings, but based on what you wrote before the problem is not related to AO, but rather to AsyncJS. As such in AsyncJS you’ll have to exclude jQuery from being Asynced/ Deferred.
hope this clarifies,
frank
Thread Starter
Linda
(@lf2983182)
Uncaught TypeError: Cannot read property ‘noConflict’ of undefined
at (index):12
(index):19 The value for key “maximum-scale” is out of bounds and the value has been clamped.
(index):19 Uncaught TypeError: jQuery is not a function
at (index):19
2jsapi:23 A parser-blocking, cross site (i.e. different eTLD+1) script, https://ajax.googleapis.com/ajax/libs/webfont/1.0.29/webfont.js, is invoked via document.write. The network request for this script MAY be blocked by the browser in this or a future page load due to poor network connectivity. If blocked in this page load, it will be confirmed in a subsequent console message. See https://www.chromestatus.com/feature/5718547946799104 for more details.
google.loader.f @ jsapi:23
(index):395 Uncaught ReferenceError: nxs_js_colorshake is not defined
at (index):395
(index):407 Uncaught TypeError: jQ_nxs is not a function
at (index):407
(index):425 Uncaught TypeError: jQ_nxs is not a function
at (index):425
(index):445 Uncaught TypeError: jQuery is not a function
at (index):445
(index):449 Uncaught TypeError: jQuery is not a function
at (index):449
autoptimize_28ba8b219570c4304bf30d36743bef0d.js:63 Uncaught TypeError: jQ_nxs is not a function
at autoptimize_28ba8b219570c4304bf30d36743bef0d.js:63
-
This reply was modified 7 years, 1 month ago by Linda.
Thread Starter
Linda
(@lf2983182)
Sorry Frank I forgot to save setting here are the errors from WP Rocket and Autoptimze.
Uncaught TypeError: Cannot read property ‘noConflict’ of undefined
at (index):12
(index):19 The value for key “maximum-scale” is out of bounds and the value has been clamped.
(index):19 Uncaught TypeError: jQuery is not a function
at (index):19
2jsapi:23 A parser-blocking, cross site (i.e. different eTLD+1) script, https://ajax.googleapis.com/ajax/libs/webfont/1.0.29/webfont.js, is invoked via document.write. The network request for this script MAY be blocked by the browser in this or a future page load due to poor network connectivity. If blocked in this page load, it will be confirmed in a subsequent console message. See https://www.chromestatus.com/feature/5718547946799104 for more details.
google.loader.f @ jsapi:23
(index):395 Uncaught ReferenceError: nxs_js_colorshake is not defined
at (index):395
(index):407 Uncaught TypeError: jQ_nxs is not a function
at (index):407
(index):425 Uncaught TypeError: jQ_nxs is not a function
at (index):425
(index):445 Uncaught TypeError: jQuery is not a function
at (index):445
(index):449 Uncaught TypeError: jQuery is not a function
at (index):449
autoptimize_28ba8b219570c4304bf30d36743bef0d.js:63 Uncaught TypeError: jQ_nxs is not a function
at autoptimize_28ba8b219570c4304bf30d36743bef0d.js:63
ah, I misinterpreted your earlier answer 🙂
Well, in that case you have some AO reconfiguration to do, I’d propose you start by adding jquery.min.js to the comma-separated JS optimization exclusion list.
Thread Starter
Linda
(@lf2983182)
Well, it loaded but formatting is all messed up on all pages.
Uncaught ReferenceError: nxs_js_colorshake is not defined
at (index):395
autoptimize_9f580854ab6b818374dc6dbe2f8e403a.js:213 nxs-script-deferred.js ******
autoptimize_9f580854ab6b818374dc6dbe2f8e403a.js:213 loading css [start]
autoptimize_9f580854ab6b818374dc6dbe2f8e403a.js:213 loading css [done]
autoptimize_9f580854ab6b818374dc6dbe2f8e403a.js:2674 JQMIGRATE: Migrate is installed, version 1.4.1
autoptimize_9f580854ab6b818374dc6dbe2f8e403a.js:213 loaded admin.css
-
This reply was modified 7 years, 1 month ago by Linda.
