Where is the .JS file in this code? And why are they calling it this way?

Question

Where is the JS file and is this Async the fastest way to call JS?

I guess they then have PHP calls in the .JS for updating the Ad stats??

The code:

Answer 1

It inserts the script tag with a dynamically constructed file name and puts it in the document before the first script tag. The advantage of this approach is that it will run only when the document is loaded, so it will not block the document loading. This way, the user will experience no (or less) delay. It's a good practise to do this for analytical tools and such, because they don't add functionality for the user and you just want to track their actions. It doesn't matter if you miss one or two of those measurements.

Answer 2

Most of that code is for loading the JavaScript code asynchronously, in a way that works in different browsers. An explanation of how it works is here: http://friendlybit.com/js/lazy-loading-asyncronous-javascript/

Loading asynchronously means that the browser doesn't wait for it to finish. So the ad won't load faster, but the rest of the page will.

If you piece together the string, you'll find that the JavaScript file they're loading is: http://engine.influads.com/show/h/nocss/acc_230d269_pub

Answer 3

I've made your code more readable:

1 <script type="text/javascript">
2 (function () {
3   var acc = "acc_230d269_pub";
4   var st = "nocss";
5   var or = "h";
6   var e = document.getElementsByTagName("script")[0];
7   var d = document.createElement("script");
8   d.src = ('https:' == document.location.protocol ? 'https://' : 'http://') +
9                "engine.influads.com/show/" + or + "/" + st + "/" + acc;
10  d.type = "text/javascript";
11  d.async = true;
12  d.defer = true;
13  e.parentNode.insertBefore(d, e);
14 })();
15 </script>

• 2,14 An anonymous function wrapper is created, so that variables cannot be access from outside the function ("scope")
• 3   acc looks like the identifier of the advertiser
• 4,5 st = "nocss" and or = "h" looks like settings to adjust the appearance
• 7,10-12 A <script> tag is created. async = Loading the script will not block the execution of the document. defer=true prevents the script from not being executed (can be omitted)
• 6,13 The newly created script tag is inserted before (13) the first script tag in the document (6,13)
• 8,9 The URL is constructed:
  If the current page is transmitted over a secure connection, the injected script will also be transferred over the HTTPS protocol.

The extension of the requested file is omitted. This file could be served using the application/javascript MIME type by server configuration.

Answer 4

There are a couple of ways to include js code into html, one is put the code directly into the tag, just like what you wondered about the code you posted, the other method is to use the following syntax:

<script type="text/javascript" src="path/to/external_file.js"></script>

As a side note, the code you posted uses a technique that prevents js name spacing conflicts by putting the code in the (function() ...)(); block, which I find to be a very good practice.

Regarding the question about using async in tag, you might want to take a look at this: http://davidwalsh.name/html5-async

Answer 5

The benefits I see are:

1. Asynchronous loading that would help in faster rendering of the UI
2. The selective http or https used for the location of the js source following the protocol that current page is loaded with

I am wondering why the js source would not end with a .js extension though