Is PHP include() or JS src to include file faster?

Question

Sometimes when I need to include the same group of elements in many web pages, I use PHP:

<?php include "somefile.html" ?>

When somefile.html is this:

<h1>TITLE</h1>
<h2>Subtitle</h2>

And sometimes, when I'm too lazy to use PHP and turn on my local server, I use JS:

<script src="somescript.js"></script>

When somescript.js is like this:

document.write(
    "<h1>TITLE</h1>" +
    "<h2>Subtitle</h2>"
);

The second version is just a tiny bit more inconvenient, but I use both ways.

However, I was wondering which way is customary and which way is faster.

I know PHP is server-side and is pre-parsed into HTML first, but even though it loads before the JS does, I don't know if it's faster. Because JS is client-side, it is parsed by the browser and might be quicker than sending a request to the server (although I'm not totally sure - tell me if I'm making incorrect inferences).

Feel free to tell me if I'm unclear and redirect me to another page that could help.

Thanks.

Regarding "Because JS is client-side, it is parsed by the browser and might be quicker than sending a request to the server" - you still have to send a request to the server to get the original HTML and the browser then makes a SECOND request to the server to get the js include. This undoubtedly a really bad approach to what you are wanting to do, unless you absolutely couldn't use some sort of script/application on the server to dynamically populate this. — Mike Brant
– Mike Brant, Commented Dec 7, 2013 at 0:50
@Jon you always have the tools to measure this. You have a modern browser do you not? — Mike Brant
– Mike Brant, Commented Dec 7, 2013 at 0:51

m59 · Accepted Answer · 2013-12-07 00:53:48Z

5

The second way is not only worse performance wise, it's an awful practice that could potentially erase your entire page because of how document.write() works. You shouldn't be using document.write() unless you are VERY sure you need to, which is rare. The only case I know of in which it is acceptable is for fallbacks of cdn delivered javascript. You use it to write in script tags for a local copy, like this:

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>window.jQuery || document.write('<script src="sys/lib/jquery.js"><\/script>')</script>

Consider that the script you're including is on the server, so a request has to be sent for it and it must be loaded before the page can continue or finish loading. The server could have just sent that data to begin with.

edited Dec 7, 2013 at 0:53

answered Dec 7, 2013 at 0:46

m59

43.9k14 gold badges122 silver badges139 bronze badges

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

2 Comments

Jonathan Lam Over a year ago

It doesn't for me - plus, I could use document.getElementById("someID").innerHTML instead of document.write()

m59 Over a year ago

@Jon yes, that is an appropriate way of adding markup to the dom, but it is still more efficient to serve it from the server if that is where you markup comes from already (unless it makes sense to ajax for it after page load - like loading something when the user clicks a button, etc).

JRomero · Accepted Answer · 2013-12-07 00:50:23Z

3

The first is definitely more customary, more efficient, and faster.

These are the actions I can point out to simply count the network and i/o interactions from a very high level.

php include:

User requests
apache processes
php processes from disc
apache sends data for display

js include:

user requests
apache processes
(assuming html extension is not processed by php)
apache sends data for display
js tells browser to include another file
apache processes request for another file
apache sends data for inclusion
js process displays data

answered Dec 7, 2013 at 0:50

JRomero

4,8781 gold badge31 silver badges49 bronze badges

Comments

user2800679 · Accepted Answer · 2013-12-07 00:53:58Z

0

The first method is slower for the server, and the second is slower for the client. Though, in practice, both methods should be fast enough for normal use cases. I would recommend the first method though.

answered Dec 7, 2013 at 0:53

user2800679

Collectives™ on Stack Overflow

Is PHP include() or JS src to include file faster?

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related