JS Delay for Inline Script
-
I have set the “Load JS Deferred” option to “Deferred”. I have then added some strings to the “JS Delayed Includes” option. I have an inline script that looks like this.
<script type='text/javascript'> var url = window.location.origin + '?ob=open-bridge'; fbq('set', 'openbridge', '565019775934206', url); </script>So, in the “JS Delayed Includes” box I have set both “fbq” and “openbridge”. However, the inline script is not being delayed. It is being deferred and the inline stuff is base64 encoded. How do I get this to work properly?
-
The same goes for this:
<script type='text/javascript'>!function(f,b,e,v,n,t,s){if(f.fbq)return;n=f.fbq=function(){n.callMethod?n.callMethod.apply(n,arguments):n.queue.push(arguments)};if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';n.queue=[];t=b.createElement(e);t.async=!0;t.src=v;s=b.getElementsByTagName(e)[0];s.parentNode.insertBefore(t,s)}(window,document,'script','https://connect.facebook.net/en_US/fbevents.js?v=next');</script>I’ve added “facebook” to the includes but it does not delay it. It defers it and base64 encodes it.
Any update?
So I looked at the plugin code, specifically optimize.cls.php, and it appears that inline JS will not get delayed no matter what. There is simply no code to do it. Is that correct? If so, the documentation and instructions in the plugin are wrong.
@thekendog
Inline JS is being Deferred.
You can check which JS is deferred from logs. Click on Purge All and refresh page incognito then check the logs.
You are correct, it is base64 encoded and at the right moment it is parsed. See: https://github.com/litespeedtech/lscache_wp/blob/master/src/optimize.cls.php#L975
Add a console.log to test the code.
Please remove inline JS from JS Delayed Includes.Just to make sure we are on same page: inline JS is ignored if script tag has the following attributes: data-optimized, data-no-optimize, data-cfasync(has value false) and type is not text/javascript
See function: https://github.com/litespeedtech/lscache_wp/blob/master/src/optimize.cls.php#L866
Do you have errors on console?
Please share with me a report ID. Can be generated from: LSC => Toolbox => Report => Click on “Send to Litespeed”.
The report ID will not reveal the site link or any info at all. I will be carefull not to share them.
I will look over the report and see how can I help you better.-
This reply was modified 1 year, 1 month ago by
litetim. Reason: clarifications
@litetim yeah I know the inline JS is being DEFERRED. I want it to be DELAYED though. The documentation and the instructions in the plugin say that this can be done.
https://share.cleanshot.com/XY6N3vv5
However, it’s not working and no matter what the inline JS is being DEFERRED. My inline JS has none of those attributes that would stop it.
https://share.cleanshot.com/RqjWYBwm
Hope that clears things up. Maybe I’m missing something here, but regardless my inline JS that I put in the “JS Delayed Includes” setting is not being delayed.
EDIT: I think I had it wrong initially. Now that I looked again, I don’t think the _js_inline_defer function has the proper check. _js_defer has this…
if ($this->cfg_js_defer === 2 || Utility::str_hit_array($src, $this->cfg_js_delay_inc)) {https://github.com/litespeedtech/lscache_wp/blob/master/src/optimize.cls.php#L1266
_js_inline_defer is missing that second OR check.
if ($this->cfg_js_defer === 2) {https://github.com/litespeedtech/lscache_wp/blob/master/src/optimize.cls.php#L1002
-
This reply was modified 1 year, 1 month ago by
Anonymous User.
-
This reply was modified 1 year, 1 month ago by
Anonymous User.
-
This reply was modified 1 year, 1 month ago by
Anonymous User.
The info I provided before was about Load JS Deferred set to DEFERRED
About Delayed: It should delay inline code too.
I made a test on a site:
– added code:<script>console.log('111')</script><script type="text/javascript">console.log('111')</script>
– tested the site with JS Delay set tot none and I saw the console log
– I set Load JS Deferred to Delayed and my inline code is running after the page had a interaction(mouse move, click)
What if you remove all data from JS Delayed Includes? Test if it works with default behaviour.Hmmm any update on this? Looks like somebody responded here recently but the post is hidden?
I responded but seems my post is held for moderation. It will appear 🙂
-
This reply was modified 1 year, 1 month ago by
litetim.
@litetim as I mentioned in my initial post this is the setup.
I have set the “Load JS Deferred” option to “Deferred”. I have then added some strings to the “JS Delayed Includes” option.
The test that you ran is not the scenario I am having issues with. The issue is that I have “Load JS Deferred” set the “Deferred”. I am then adding some strings to the “JS Delayed Includes” option. Inline JS is not being delayed as it should be. This is because there is a missing conditional check on line 1002 of optimize.cls.php. It should look like this:
if ($this->cfg_js_defer === 2 || Utility::str_hit_array($con, $this->cfg_js_delay_inc)) {I have modified that file to test things and after doing so my inline JS is being delayed as it should be.
To properly test my scenario on your end…set “Load JS Deferred” to “Deferred”. Add “console” to the “JS Delayed Includes” section. You will see that the inline JS is being deferred, not delayed. Apply the fix I mentioned above and then things work properly.
@thekendog
You are trying to mix results from “Load JS Deferred” ?
All js(inline/or with link) to be Deferred
JS from “JS Delayed Includes” should be Delayed
Am I correct?That is correct yes, I want all JS to be deferred and I want to pick and choose what JS is delayed. Using this setup, the “JS Delayed Includes” works with regular scripts that are linked. It does not work for inline JS though because of the issue I previously described. The “_js_inline_defer” function is missing the conditional check which looks to see if the inline JS contains a string from the “JS Delayed Includes” setting.
By default we do support this “hybrid” approach.
Not many users have the knowledge to make difference between how JS is run.
We want to keep it simple for most of users.
Remember that any changes in code will be overwritten on update.It’s supposed to support it but it’s not working is what I’m saying. The instructions for the “JS Delayed Includes” field says this:
Listed JS files or inline JS code will be delayed.
But that is false. I am showing you the bug which is causing the inline JS code to not be delayed. All that needs to be done is to edit line 1002 of optimize.cls.php and add the extra conditional. Regular linked scripts work fine, but there is a bug that is preventing inline JS from doing the same.
But that setting is used when “Load JS Deferred” is set to Delayed
Also when Delay si ON, the JS will take all scripts(inline/external) and will stop loading/parsing until a interaction is found.
-
This reply was modified 1 year, 1 month ago by
The topic ‘JS Delay for Inline Script’ is closed to new replies.