Detecting javascript in PHP, before PHP builds page

Question

I have found several posts across the web which describe how to detect javascript using PHP and I have already put together my own solution together (below) but...

...I am wondering if I can improve on what I have already.

SUMMARY

1) I want to load a mobile-optimised page as quickly as possible.

2) For .js-enabled browsers I want to load the entire page in (less accessible but faster loading) Configuration B - with the intention of later (ie. after onload) reconfiguring parts of the page - consequent to the user triggering various javascript events - as (more accessible) Configuration A.

3) For non-.js-enabled browsers, I want to load the entire page directly in (more accessible) Configuration A.

SOLUTION (so far)

The following .js <script> is as high up in the <head> as I dared place it (just below the <title>).

<?php
echo '

<script>
if (window.location.href != \'http://'.$_SERVER['HTTP_HOST'].$_SERVER['SCRIPT_NAME'].'?enhance=js\') {
        window.location.href = \'http://'.$_SERVER['HTTP_HOST'].$_SERVER['SCRIPT_NAME'].'?enhance=js\';}
</script>';

$hasJS = 0; if (in_array('js',$_GET)) {$hasJS++;}
?>

As you can see, the <script> tells .js enabled browsers to check for a specific GET parameter appended to the URI (enhance=js) and if the parameter is absent, to reload the page immediately with that GET parameter appended to the URI.

PHP then checks if the GET parameter exists and if it does, a flag, $hasJS, is switched on to tell the rest of the PHP script that the browser is .js-enabled.

So far, so good. It works.

But can I improve on this .js detection via PHP method?

Questions:

1) Is there a way to do it which doesn't involve changing the URI or reloading the page?

2) Apart from the URI, is there any other page-related attribute to which I can append data with javascript before retrieving that same data with PHP?

Just a note: PHP is server side, JS is client-side, the two can't interact with eachother, PHP is processed and produces output (Usuaully HTML, JS, CSS, etc) — Darren
– Darren, Commented Dec 10, 2014 at 23:52
Both PHP and JS use cookies, just set the cookie for session. — skobaljic
– skobaljic, Commented Dec 10, 2014 at 23:54

Abhi Beckert · Accepted Answer · 2014-12-11 00:00:35Z

6

The browser does not tell the server whether or not JavaScript is enabled.

The best solution is to send Configuration A to everyone who visits, and then javascript changes the page to Configuration B like this:

<script type="text/javascript">
  if (document.cookie.match('js=1') == null) {
    document.cookie = 'js=1; path=/'
    document.location = document.location
  }
</script>

Then in your PHP:

if ($_COOKIE['js']) {
  // send Configuration B
}

With the above code, the "js" cookie will be deleted when the user closes the browser. You can also send an expiry date to make it last longer, more details here: http://www.quirksmode.org/js/cookies.html

answered Dec 11, 2014 at 0:00

Abhi Beckert

33.5k12 gold badges89 silver badges115 bronze badges

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

2 Comments

skobaljic Over a year ago

This is the way to go. I would go further and show the JS part only once on start of the session.

Rounin Over a year ago

Many thanks to both of you, @Abhi & skobaljc! In the end I have gone with placing the following PHP in the page <head>: if ($_COOKIE['js'] == 1) {$hasjs = 1;} else {echo '<script>document.cookie = \'js=1; path=/\';</script>';}

GolezTrol · Accepted Answer · 2014-12-11 00:03:09Z

1

Mobile browsers also support JavaScript, but if you like, you can load extra JavaScript through JavaScript. That way, you can embed (or include) a small script in your page and load extra scripts as needed after you detected the capabilities of the client.

Or you can choose to make one big script and always include it. A minimized script isn't very large, and by loading it in one script you have a bigger download, but fewer requests. And especially mobile connections have a high latency, so mobile experience benefits from as little requests as possible.

Of course that same argument also counts for HTML content of the page. It's quicker to load the page at once than to load an empty page and fill it through JavaScript by doing extra request. Of course the initial page load will be slightly faster, but you will have a partially empty page, so what's the use? The user will probably wait for the whole page to load, since they think it's still loading when they see new content being added to the page.

As for detection on the server. There is no way PHP can reliably check whether the client supports JavaScript, especially not on the first request. For subsequent requests, you might read a cookie that was set from a script to make an educated guess about JavaScript support.

edited Dec 11, 2014 at 0:03

answered Dec 10, 2014 at 23:55

GolezTrol

116k19 gold badges186 silver badges215 bronze badges

5 Comments

Abhi Beckert Over a year ago

@Rounin if the browser does successfully load any images, they will be cached and won't need to be loaded again after the page reloads.

GolezTrol Over a year ago

I understand what you mean, but you cannot check this in PHP. A good way to solve this is probably to make a non-js version that has only one image. Instead of an accordeon or a long list of images, they can click a link to go to the next image. That way, you will always load just one image. You might include a JavaScript array of image urls, so the script can generate an accordeon for you. The small script won't be much overhead for non-js users (which will be a small percentage anyway), and the js users won't have to do an extra request. The script can build the accordeon right away.

GolezTrol Over a year ago

For a cached image, still a request might be made, which returns a 304 not modified. But you can also use a max-age header so your browser won't try to download it for a specified time. Of course, the disadvantage is that it also won't download the image when it has changed on the server. The browser cannot know.

GolezTrol Over a year ago

@Rounin I mentioned the cookie. It's reliable enough (although you can set cookies yourself on a non-js browser), and of course there are other ways as well to pass information from JavaScript to the server, thus indicating that the client has JavaScript. But none of these work on the first request, so the first page load won't have this information. If that's not a problem for you, please use the cookie.

Rounin Over a year ago

Ah... okay, I see what you're saying @GolezTrol. It's just not possible within a single page request for PHP to detect if the UA is .js-enabled or not. Right?

Collectives™ on Stack Overflow

Detecting javascript in PHP, before PHP builds page

2 Answers 2

2 Comments

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related