WordPress.org

Forums

Montezuma
javascript question (13 posts)

  1. ConsiderThis1
    Member
    Posted 1 year ago #

    Hi,
    I'm still having trouble with my pages getting bad marks for being slow...
    I've read this information on fixing Javascript errors over and over, but I can't work out what I'm actually supposed to do.

    https://developers.google.com/speed/docs/insights/BlockingJS

    I'm still getting only a fraction of the views I used to get... so I think Google continues NOT to show my pages because of the problems it "sees" on them...

    My main problem appears to be with Mobile... according to the Insights page: http://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fwww.health-boundaries.com%2Fsymptoms-of-low-vitamin-b12%2F
    "Should Fix:
    Eliminate render-blocking JavaScript and CSS in above-the-fold content
    Prioritize visible content
    Leverage browser caching"

    It tells how to fix each problem, but I don't get it... I don't know what, exactly, I should do.

  2. CrouchingBruin
    Member
    Posted 1 year ago #

    You can try installing the Async JS and CSS plugin. It appears that some users have been able to raise their Google Page Speed scores by using it (one even got his up to 100). You may want to post a question there on how to raise yours, they seem very knowledgeable over there, and the focus seems to be on reducing page load times.

    As far as Google not showing your pages, what search terms are you using in Google to bring up your pages? I tried search terms like vitamin b-12, vitamin b-12 deficiency and vitamin b-12 deficiency symptoms, but there are so many health-related web sites which come up, I can see where yours might get drowned out. I know that Google is indexing your site, because when I do a search on your site, I get back 56 results.

  3. ConsiderThis1
    Member
    Posted 1 year ago #

    Hi CrouchingBruin ~ Sigh. I know google indexes my site. I used to get nearly a thousand visitors a day. Now I get, with luck, 300 visitors a day. The thing is, the mobile part of my site appears not to be working. I get a really good score on the desktop version, and I get almost all my income from that. Whereas I used to get half or more from Mobile, and that was before I had a responsive site.

    So, something's wrong... I did the things you suggested last time I asked about this ... I think I asked differently.

    I have such a hard time seeing how to do the suggestions. I think it's because the whole time I could barely walk my thinking deteriorated. There's a link between exercise and a well functioning brain. So now, I have a really hard time keeping thoughts together. Sometimes even from the beginning of a sentence to the end of the same sentence. Sigh.

    I'm much better and can begin to do the exercises that in the past helped, but... recovery is slow and I'd like to fix this now...

    I've been more able to follow your directions that those of most other sources of help, that's why I asked again here.

    This is what the Google analyzer suggests:

    Eliminate render-blocking JavaScript and CSS in above-the-fold content
    Your page has 11 blocking script resources and 2 blocking CSS resources. This causes a delay in rendering your page.
    None of the above-the-fold content on your page could be rendered without waiting for the following resources to load. Try to defer or asynchronously load blocking resources, or inline the critical portions of those resources directly in the HTML.

    Remove render-blocking JavaScript:
    http://www.health-boundaries.com/…cludes/js/comment-reply.min.js?ver=3.8.3
    http://www.health-boundaries.com/…-includes/js/jquery/jquery.js?ver=1.10.2
    http://www.health-boundaries.com/…s/jquery/jquery-migrate.min.js?ver=1.2.1
    http://www.health-boundaries.com/…uery/ui/jquery.ui.core.min.js?ver=1.10.3
    http://www.health-boundaries.com/…ry/ui/jquery.ui.widget.min.js?ver=1.10.3
    http://www.health-boundaries.com/…ry/ui/jquery.ui.effect.min.js?ver=1.10.3
    http://www.health-boundaries.com/…p-includes/js/quicktags.min.js?ver=3.8.3
    http://www.health-boundaries.com/…zuma/javascript/smooth-menu.js?ver=3.8.3
    http://www.health-boundaries.com/…ploads/montezuma/javascript.js?ver=3.8.3
    http://1-ps.googleusercontent.com/…s,qver=201417.pagespeed.ce._38GSuPULB.js
    http://1-ps.googleusercontent.com/…m/e-201417.js.pagespeed.ce.t_fyQf1fOC.js

    Optimize CSS Delivery of the following:
    http://www.health-boundaries.com/wp-content/uploads/montezuma/style.css
    http://www.health-boundaries.com/…opper/interface/css/public.css?ver=3.8.3

    It tells how to do it, but despite reading the instructions repeatedly, I can't work out what to do...

    Remove Render-Blocking JavaScripts

    This rule triggers when PageSpeed Insights detects that your HTML references a blocking external JavaScript file in the above-the-fold portion of your page.
    Overview

    Before a browser can render a page to the user, it has to parse the page. If it encounters a blocking external script during parsing, it has to stop and download that Javascript. Each time it does that, it is adding a network round trip, which will delay the time to first render of the page.
    Recommendations

    JavaScript needed to render the above-the-fold region should be inlined, and JavaScript needed to add additional functionality to the page should be deferred until after the above-the-fold content has been delivered. Please keep in mind that for this to improve your loading time, you must also Optimize the CSS Delivery.
    Inline Small JavaScript

    If the external scripts are small, you can include them directly into the HTML document. Inlining small files in this way allows the browser to proceed with rendering the page. For example, if the HTML document looks like this:

    <html>
      <head>
        <script type="text/javascript" src="small.js"></script>
      </head>
      <body>
        <div>
          Hello, world!
        </div>
      </body>
    </html>

    And the resource small.js is like this:

    /* contents of a small JavaScript file */
    Then you can inline the script as follows:

    <html>
      <head>
        <script type="text/javascript">
          /* contents of a small JavaScript file */
        </script>
      </head>
      <body>
        <div>
          Hello, world!
        </div>
      </body>
    </html>

    This eliminates the external request for small.js by placing it inline in the HTML document.

    Defer loading of JavaScript

    To prevent JavaScript from blocking page loading, we recommend using the HTML async attribute when loading JavaScript. For example:

    <script async src="my.js">
    If your JavaScript resources use document.write, it is not safe to use asynchronous loading. We recommend that scripts that use document.write be rewritten to use a different technique.

    Additionally, when loading JavaScript asynchronously, if your page loads scripts that depend on one another, care must be taken to make sure that your application loads scripts in the proper dependency order.

    FAQ

    What if I am using a JavaScript library such as jQuery?
    Many JavaScript libraries, such as JQuery, are used to enhance the page to add additional interactivity, animations, and other effects. However, many of these behaviors can be safely added after the above-the-fold content is rendered. Investigate moving the execution and loading of such JavaScript until after the page is loaded.
    What if I’m using a JavaScript framework to construct the page?
    If the content of the page is constructed by client-side JavaScript, then you should investigate inlining the relevant JavaScript modules to avoid extra network roundtrips. Similarly, leveraging server-side rendering can significantly improve first page load performance: render JS templates on the server, inline the results into HTML, and then use client-side templating once the application is loaded. For more information on server-side rendering, see http://youtu.be/VKTWdaupft0?t=14m28s.

  4. CrouchingBruin
    Member
    Posted 1 year ago #

    Hi, Karen:

    The thing is, the suggestion that Google makes, which is to put your JavaScript inline, really can't be done manually on a WordPress site. That is, if you do a view source of your site, you would see a line that looks like this:

    <script type="psa_prefetch" src="http://www.health-boundaries.com/wp-includes/js/comment-reply.min.js?ver=3.8.3"></script>

    This is a link to an external javascript file, and what the browser will do is open the file and read in the contents. That can take some extra time, delaying the display of your web page. So what Google suggests you do is replace the link to the file with the actual file contents. That is, you would open up the file, and copy & paste the contents in between <script> ... </script> tags. The problem is that either WordPress or or a plugin puts those links in the head section of your HTML, so to make that kind of change, you'd have to modify either one of WordPress' core files, or a plugin's file.

    Another suggestion, instead of inlining the javascript, is to move the javascript "below the fold," or down below where the content of the page gets displayed. That is, for javascript functions which do not write to the page, the site should delay loading them until the rest of the page gets loaded so your users see the page right away. However, WordPress (or the plugin) decides where it's going to put the link, you really don't have control over it unless you edit the core files. The suggestions from Google are more for developers who code their sites "by hand," using HTML instead of a framework like WordPress. That's why I suggested using that plugin in my previous post; it's designed to move your javascript and CSS code down to the bottom, so it will load after the rest of your site's content. Please give that plugin a try, because there's really nothing that can be done as far as tweaking any of Montezuma's options.

  5. ConsiderThis1
    Member
    Posted 1 year ago #

    Hi CrouchingBruin ~~

    OH! Now I get it. I'm really sorry I'm so slow. When you suggested the plugin I thought I hadn't been clear and the plugin was something that might work, but only if I had the problem you thought I had based on my bad description.

    I'm really thankful to you for your help. I was about to go into my Montezuma files and "try"... when I decided the wiser approach would be to ask you in a way that helped clarify the problem for me (in the asking) and for you.

    I'll go get the plugin now.

    Thank you!!!!!

    Karen

  6. ConsiderThis1
    Member
    Posted 1 year ago #

    The "some users" is really interesting. Thanks!!!

  7. ConsiderThis1
    Member
    Posted 1 year ago #

    Okay, so that's done. I don't know how long I have to wait to check it on PageSpeed Insights...

    But, here's a question ~ I don't know if this message appeared after I activated the plugin, or before. Do you think it's a result of the Async JS plugin?

    "The Object Cache add-in file object-cache.php is not a W3 Total Cache drop-in. Remove it or disable Object Caching. "

    And, did you update your WordPrss thing? I have a reluctance to update due to some updates in some things causing problems...

  8. ConsiderThis1
    Member
    Posted 1 year ago #

    Wow, that made 14 points of difference. And, I can see how my site loads differently now. Thank YOU!!!

    But, I'm now getting a new message about what I should fix:

    Should Fix:
    Leverage browser caching

    Interestingly, I used to have 5 passes rules, and now have only 3.

    The problem with render blocking has been moved to an amber alert, rather than red.

    I think my Desktop score got worse, but I can't be sure.

    Do you use the W3 total cache thing? When I installed and activated it, if I used all the options my site loaded as a blank yellow page. So I unchecked options until my content loaded. Recently W3 had a major update... maybe if I go back and check it out, I can get rid of the minify problems, which are myriad at the moment... Any thoughts??? (on this, clearly you have a very active mind...)

    Karen

  9. ConsiderThis1
    Member
    Posted 1 year ago #

    W3 is giving me this message "Host static files with your content delivery network provider to reduce page load time. "

    Do you do that with your sites? Are some of the cloud places free?

    And, an image question... I have the SmushIt plugin, which is supposed to make images load progressively. In addition I've been making my png images into jpgs and exporting (using GIMP ~ thank you for helping me to use that) them as jpgs... So I don't understand why I'm being told to "optimize images" What do you think is the problem???? i.e. what should I be doing...?

  10. ConsiderThis1
    Member
    Posted 1 year ago #

    OH OH ~~~ My site no longer shows up on the PageSpeed Insights .... and suddently the scores are even worse. I think it could be because W3 asked me to remove something... and I did...

    Luckily I asked you about it, or I'd not have any way of knowing what I did...

    This is what I did:

    "The Object Cache add-in file object-cache.php is not a W3 Total Cache drop-in. Remove it or disable Object Caching. "

    Oh dear, I forgot, I also signed up for Amazon CloudFront... but that didn't ask me for my site name... so maybe that's the problem... I indicated in W3 that I was using Amazon CloudFront

  11. ConsiderThis1
    Member
    Posted 1 year ago #

    I can't get my site to show up on PageSpeed Insights anymore... I deactivated and deleted W3, but when I put it back all the same things were still checked, so I unchecked the ones that seem like they could be the problem, I unchecked that I'm using Amazon CloudFront.

    I don't know how to undo the Object Cache thing I changed...

  12. ConsiderThis1
    Member
    Posted 1 year ago #

    Really grateful to you CrouchingBruin ~~

    I worked on my site for ages... trying things and combinations of things. You make me feel brave, because I feel sure that if I totally weird out my site, you'll help me put it right.

    The work has improved my understanding of things... not to any great pinnacle of understanding, but a bit better. I'm happy with the improvement.

    The Object Cache thing may have to do with why the black bar on top of my site no longer has icons... think that could be it?

    OH, how do I reduce the space on top of the page name when a page opens up?

    http://www.health-boundaries.com/

    I'm thinking that the reason I don't have any income from mobile views of my pages is that the Google ads aren't immediately visible. So, if I had just a little less white space I could put one after the first paragraph on a number of pages, instead of all of them being in the sidebar or way down in the footer.... Though, that will probably reduce my page speed.... how interwoven it all is...

  13. ConsiderThis1
    Member
    Posted 1 year ago #

    1. I wanted to know if Montezuma is a WP Transient API ... I don't know what that is and apparently it has to be that to use a part of W3 Total Cache. Maybe the fact I don't understand is impacting why W3 isn't working for me the way it appears to work for people with more tech expertise... Sigh.

    2. A page I just made doesn't have the name I gave it. When I "View Page", the page has a number, not the name I gave it. How can I fix that? Should I fix that??? How did it happen???

    http://www.health-boundaries.com/2768-2/

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic

Tags

No tags yet.