1

I am new to Javascript and development in general and have an absolute beginner's question: I would like to know more about the advantages and disadvantages of the following two constellations, especially regarding execution speed and server load/requests.

  1. Put all custom JS code inside PHP code and call it from there

  2. Put all custom JS code inside a custom.js and just call the JS functions in PHP

On the one hand I prefer to keep all my JS code separated to have things tidy and clean but on the other hand I imagine that it takes longer to load the page due to an additional server request. Will there be a noticeable speed difference when I put all code in a custom JS file? Are there any specific scenarios where it's recommend to put the JS inside the PHP or keep it separated?

Thanks

Improve this question
3
  • Define "noticeable". There's another request to your web server if it's in a separate file, but from a user perspective it's probably negligible unless their connection is abysmal. A separate file also lends itself to re-usability. A user who doesn't care will never "notice". A power user that watches the requests will know every time, so they'll "notice" but they may not "care". Commented Sep 6, 2012 at 17:21
  • 1
    Putting the JS in a seperate file will be more effective since that will be loaded async and PHP doesn't have to go over that to put it on the page. Might me a VERY small difference, but having the JS seperated will improve your readability alot too. Also helps to seperate if you have functions that can be used on multiple pages. Never do something twice if you don't have to! Commented Sep 6, 2012 at 17:22
  • Not quite sure of the question here... php runs server side, and unless you are talking about a server-side js implementation (node.js) then the two should be independent of one another. Commented Sep 6, 2012 at 17:24

3 Answers 3

Reset to default
2

Http requests run in parallel, so loading a js file may not be noticeable at all, assuming you have to wait for images and other assets to load as well. The benefits outweigh the potential drawback.

As an added bonus, js files are normally cached, while html is reloaded each time a page is requested.

NOTE: If you have a significant number of scripts, you will have problems with load speed since browsers have limits of how many requests can be made in parallel. In this case you should be looking into minifying and combining them. Try code.google.com/p/minify for automatic minification using php.

Last: Having js code in php is terrible for maintainability.

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

Just as note. With one single file - that is really not a problem. But on sites with a lot of JS in separate files I saw significant slowdown in case if files are loaded separately, but you can combine all those files into a single file to improve speed. Problem is that browsers have different limits for paralel requests. For instance, IE will load only 6 or 7 files at once.
@FAngel You can solve some of the problems with async loading libraries like require.js. However, if you have a significant number of scripts, you should be looking into minifying and combining them. Try code.google.com/p/minify for automatic minification using php.
Hm, require.js will not extend browser limits, but yes - it could be used to visually speedup a page (so scripts download will not block everything else). "you should be looking into minifying and combining them" - that is what I'm talking about.
@FAnglel Good points. Though I believe the OP is talking about a single js file so issues of many files don't come into play here. Will edit answer to note this.
1

JS in separate file - additional request. But I would not say that is a problem because it will be cached by browser. If you have a lot of js files - collect them into a single file to avoid multiple requests (there are special tools to compile separate JS files into one file and minimize its size).

Placing it into PHP code is just terrible. It should be in separate file.

On the one hand I prefer to keep all my JS code separated to have things tidy and clean but on the other hand I imagine that it takes longer to parse the whole code.

Why? JS is executed on client side. Not on server side. PHP will not parse JS files. At the same time - if you will put a JS code in PHP file - PHP will need to echo it to browser and that is additional work for PHP engine. Plus, in PHP code it will be sent to browser any time when PHP is executed.

Improve this answer

2 Comments

I edited that part as I expressed myself not clearly, I meant actually longer page load time due to loading the JS instead of page load time due to code parsing.
@Socrates well... the only additional time you will have with separate file is time to connect to server. You must get some amount of JS code this way or that. But with propper caching settings - it will be taken from server only once. Plus - you can minimize it with some tool if it is separate file. Shortly,my answer is: never put JS into PHP file. And if you have a problem with script load time - look at minimizers, compilers (one file from multiple smaller files), gzip compression.
0

Always err on the side of clean readable code, lest you fall into the premature optimization trap.

You can always refactor underperforming code to make it faster, it's much harder to move from low-level optimizations to a more abstract design, than the other way around (abstract to low-level)

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.