SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Member
    Join Date
    Aug 2007
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    code bloat with javascript array?

    http://tinyurl.com/5qmtze

    concerns:
    1) big 200 array in header


    is there a way i can move this to an external js file?

  2. #2
    We're from teh basements.
    Join Date
    Apr 2007
    Posts
    1,205
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes. Declare the array in an external file and include it in your HTML file before any JavaScript code that operates on the array.

    Code:
    <script type="text/javascript" src="huge_array.js"></script>
    <script type="text/javascript">
    function doSomething() {
     for (i=0;i < hugeArray.length;i++) alert(hugeArray[i]);
    }
    </script>

  3. #3
    SitePoint Member
    Join Date
    Aug 2007
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    why must the array exist in the <head> and not in the <body> ?

  4. #4
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,526
    Mentioned
    83 Post(s)
    Tagged
    3 Thread(s)
    it doesn't have to exist in the <head>

    Best practice is to place scripts at the end of the body, just before the </body>
    http://developer.yahoo.com/performance/rules.html
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  5. #5
    We're from teh basements.
    Join Date
    Apr 2007
    Posts
    1,205
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Years ago, before Yahoo! did their front end performance research, it was recommended to put certain parts of your JavaScript code in the document head. As pmw57 says, that has changed in recent years. Theoretically, it doesn't matter where you put code that manipulates the DOM, since you have to wait until the page loads to use it anyway. But...

    The reason for putting it at the end of the document body is that browsers evaluate client-side script as it is encountered. Page loading is interrupted while that happens. Since most JavaScript code these days manipulates the DOM, and that code is useless until after the page loads, it makes no sense to interrupt page loading to evaluate it.

  6. #6
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,526
    Mentioned
    83 Post(s)
    Tagged
    3 Thread(s)
    So by placing the JavaScript at the end of the document body, not only will the page be loaded more efficiently, but the JavaScript is perfectly placed to perform live work on the DOM.
    The only way to improve the speed of that is to either place the script directly underneath the element it wants to affect, or to have a timer event watching for the availability of the element in question. The former way has a lack of coherence while the latter involves an increase in complexity.

    As a result, the miniscule increase in speed of these other techniques is far outweighed by the ease of maintenance of placing the script at the end of the body.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •