is it good to write multiple time(separate) <script type="text/javascript"> on one php page?

Question

i m using many tiny java script code at one php page, i always write java script code in below style

<script type="text/javascript">
// <![CDATA[ 
 ----code 1--------- 
// ]]>
</script>   

<script type="text/javascript">
    // <![CDATA[ 
    ----code 2-----
    // ]]>
    </script>

<script type="text/javascript">
// <![CDATA[ 
$(document).ready.(function(){
});
// ]]>
</script>

i want to know that is it good practice to write separate <script type="text/javascript"></script> on same page or we have to write all java script code under one time declaration

Answer 1

Having multiple <script> tags makes no real difference in performance but is less readable.

Answer 2

You don't have to, but its obviously cleaner that way, unless you want to clearly seperate the blocks of code.

Answer 3

Put all your javascript coding in separate and then call the file name. Because it is good thing. Coding execution is step by step, so it will take time if js present in between the coding.

Answer 4

Not nice, but not a problem.

Answer 5

Well, you may want to ask yourself why your code organization scheme leads to that setup, and whether it causes maintenance or understandability problems, but I don't think it's strictly "bad". Now if your <script> tags are actually fetching separate files from the server, then it's a good idea to cut back on them.

The browser parses and interprets script tags in such a way that other work stops, so blocks of Javascript up at the top of your page can slow things down if they do a lot of work. That's true whether you've got a big block of code or several smaller blocks, however.

An advantage of moving to separate script files is that you can re-use code on multiple pages. When you do that, it may be easier at build time to compress your scripts with YUICompressor or some other similar tool.

Answer 6

The best reason to do this is if each script represents a discrete chunk of functionality which may not be used on (and therefore not vended to) every page. In that case, it becomes a smart strategy.

Answer 7

Hunter is right, it makes absolutely no difference as far as performance is concerned.

When your javascript however becomes more complex, you may want to start building your own API of sorts and splitting out all of those tags into separate files. Then when you're deploying your app, find some sort of packaging solution that will combine all of those files to a single one, compress it using YUI compressor or Google Closure and have one single tag that references this file of all your code.

While it is a 'slight' disadvantage to force a separate http request for this file, if it's packaged properly, the file size will be smaller than the uncompressed code you've included in that file.

It is also normal to have script tags further down in your page that provide extra functionality (ie look at google analytics)

Answer 8

It does make a difference, not for performance of the scripting, but it can influence load time. Every script (like every image) requires a http request. modern browsers allow for 6 concurrent http requests. So if the load time of your page seems slow, a way to speed it up is to concatenate all script code (you can do it server side) and send it in one script tag to the browser.

Answer 9

Whenever you are violating the DRY principle (Don't Repeat Yourself), you need to ask why. If you don't have a good reason, then you probably shouldn't be doing it that way.

Answer 10

There is one edge case where multiple script blocks can make a difference (and I just learned about it). If one line of code references a value before it has been declared, this will work if the code belongs to the same script block, but not if they are separate. But this doesn't change the answer everybody gave you: it probably won't matter in everyday coding.