admin管理员组

文章数量:1420095

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.

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.

Share Improve this question asked Dec 7, 2013 at 0:43 Jonathan LamJonathan Lam 17.4k17 gold badges71 silver badges99 bronze badges 3
  • 5 When you're concerned about speed: measure it. – Matt Ball Commented Dec 7, 2013 at 0:46
  • 1 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 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 Commented Dec 7, 2013 at 0:51
Add a ment  | 

3 Answers 3

Reset to default 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./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.

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

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 remend the first method though.

本文标签: javascriptIs PHP include() or JS src to include file fasterStack Overflow