CODEWITHSUNDEEP
jqueryhtmlasp-classic
sephiith
sephiith

Reputation: 1197

How to speed up the execution of jquery in the body of an ASP page

I am running some jquery in the body of an asp file. Immediately after it is the drop down menu that it effects. The script works fine, the issue is it takes a while to load the script in firefox.

How can I speed this up without moving it higher up in the body or header.

Please note: The link provided is the live website, I am aware that it is firing an object error back because I have a old version of jQuery. (On our internal website the jquery is the latest version)

Link:http://www.casa.gov.au/scripts/nc.dll?WCMS:PWA::pc=PC_91330

The code is below: 

<script>
    $(document).ready(function() {

              $(document).on("change","select#state",function(e){
                             $("form#state").submit();
                               });

     });
</script>

  <form id="state" action="avsafety.asp" method="get">

     <p>State:<br/>
      <select id="state" name="state">
        <option label="ACT" value="ACT" <%if request.querystring("state") = "ACT" then response.write("selected") %>>ACT</option>
        <option label="NSW" value="NSW" <%if request.querystring("state") = "NSW" then response.write("selected") %>>NSW</option>
        <option label="NT" value="NT"   <%if request.querystring("state") = "NT" then response.write("selected") %>>NT</option>
        <option label="QLD" value="QLD" <%if request.querystring("state") = "QLD" then response.write("selected") %>>QLD</option>
        <option label="VIC" value="VIC" <%if request.querystring("state") = "VIC" then response.write("selected") %>>VIC</option>
        <option label="SA" value="SA"   <%if request.querystring("state") = "SA" then response.write("selected") %>>SA</option>
        <option label="TAS" value="TAS" <%if request.querystring("state") = "TAS" then response.write("selected") %>>TAS</option>
        <option label="WA" value="WA"   <%if request.querystring("state") = "WA" then response.write("selected") %>>WA</option>
      </select>
      <noscript><input type="submit" value="Search" /></noscript>
    </p>

  </form>

Upvotes: 1

Views: 108

Answers (1)

mrtsherman
mrtsherman

Reputation: 39882

You are using on for the entire document. Essentially waiting for events to bubble all the way up to the highest level. Monitor the element directly.

$("select#state").on("change",function(e){
    $("form#state").submit();
});

In terms of larger performance gains I would look less at this individual bit of javascript and more at your site as a whole. Why is it loading slow? You could enable compression, leverage a CDN.

Also, seems strange that FF would be slow. Usually (always?) it is IE that ends up being slow. You might want to try another computer and see how fast it is. There may be extensions in FF that are causing problems.

You can also leverage Chrome developer tools. Inspect to see what portions or your site are causing the biggest performance hit. Because $(document).ready() is waiting for the DOM to load, a single element may be the cause of the performance problem.

Upvotes: 2

Related Questions