JS minify settings…is there a tutorial?

  • Haz

    (@tvguy2000)


    10 years, 9 months ago

    Is there a tutorial that explains the JS minify settings in general? I pick up bits and pieces via the message boards, but I would love to be able to read something that explains what each option does so I can really understand how this section works.

    I use this section on “guts” and it’s basically countless hours of trial and error. The good news is that thanks to W3TC my site has a Google PageSpeed of 98/100, but I cannot say I that I have a mastery / functioning understanding of this section.

    For instance:

    Embed Types…what does each choice do? and in general, under what circumstances should we consider using each?

    Default (blocking)
    Non-Blocking JS
    Non-Blocking “async”
    Non-Blocking “defer”
    Non-Blocking “extsrc”
    Non-Blocking “asynsrc”

    Embed Location…What does each of the three options do? generally speaking, under what circumstances would one chose these options?

    Embed after <body> — does this embed JS in footer?
    Embed before </body> — when would one use this?

    Where / how do we embed JS to “defer loading”

    I would love to be able to read up on all of these things so I have it all straight in my head accurately….any info would be greatly appreciated.

    John T
    http://www.aquariumcarebasics.com/

    http://wordpress.org/extend/plugins/w3-total-cache/

Viewing 2 replies - 1 through 2 (of 2 total)
  • bheadrick

    (@bheadrick)

    10 years, 9 months ago

    embed after body tag is exactly what it says – it puts it at the top of the body block
    before </body> is at the end of the body block (footer)

    here is a good article on nonblocking javascript.
    Basically, the standard way to load javascript is blocking, meaning the browser doesn’t render the html until the javascript has loaded.

    If you do non-blocking, the page will finish rendering whether the js is fully loaded or not. This can cause problems if one of those scripts has an “on load” trigger, as the page will have already loaded when the script loads, so the event will never occur and the script will never run.

    scripts looking for some other event after the page has loaded (so long as they’re not in an on load block) will be good candidates for this.

    async will start loading at some point while the site is loading, but defer will wait for the html to finish loading before the js starts loading.
    asynchronous vs deferred

    Thread Starter Haz

    (@tvguy2000)

    10 years, 9 months ago

    Thanks for the reply. I really appreciate it.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘JS minify settings…is there a tutorial?’ is closed to new replies.

Tags