Network I/O Is Unpredictable: Node.js

We’ve seen the importance of callback method in our previous video tutorials. Now lets see how networked I/O Is unpredictable.


http-module-get-method-nodejs-network-io-unpredictability

Here we request/ping for information from 3 different servers and look at its response time. Each time we send a request, we get different response time depending upon how busy the server is, its bandwidth etc.

JavaScript File
app.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var http= require("http"),
      urls  = [ "technotip.org",
         "technotip.com",
      "www.capturecaption.com"
       ];
 
for(var i = 0; i < urls.length; i++){
ping( urls[i] );
}
 
function ping( url ){
var start = new Date();
 
http.get({ host: url }, function(res){
console.log("URL :"+url);
console.log("Response Time: "+(new Date() - start)+" ms");
});
}

Here we require http module, which is built into nodejs, and store it inside a local object called http. We also declare and initialize an array with 3 domain names. Using for loop, we loop through each URL present in the urls array and pass it to a method called ping();

Inside ping method, we record client system date in a variable before sending a request to the server(via URL). Now using http objects get method we send request to the server and see it’s response time. get method takes 2 parameter, first parameter is an object which contains host information – the host url { host: url }. Second parameter is a callback method which automatically gets an object which is returned by first parameter {host: url}. Inside the callback method, we subtract the new system date with the one we recorded before requesting for a response, this way we calculate the response time of each URL.

HTTP get method: Node.js


[youtube https://www.youtube.com/watch?v=vktKMtWoPbA]

YouTube Link: https://www.youtube.com/watch?v=vktKMtWoPbA [Watch the Video In Full Screen.]



output
C:\node>node app.js
URL :technotip.com
Response Time: 1462 ms
URL :www.capturecaption.com
Response Time: 1993 ms
URL :technotip.org
Response Time: 2004 ms

C:\node>node app.js
URL :technotip.com
Response Time: 1381 ms
URL :www.capturecaption.com
Response Time: 1702 ms
URL :technotip.org
Response Time: 1871 ms

C:\node>node app.js
URL :technotip.com
Response Time: 1409 ms
URL :www.capturecaption.com
Response Time: 1628 ms
URL :technotip.org
Response Time: 2001 ms

C:\node>node app.js
URL :technotip.com
Response Time: 1512 ms
URL :www.capturecaption.com
Response Time: 1534 ms
URL :technotip.org
Response Time: 1899 ms

Each time we execute the script, we get different response time, and the order of URLs may also differ, as we can’t predict which server will respond first.

URL Input Type: HTML5

Lets look at URL Input Type of HTML5 forms.

form-input-type-url-type-html5

In this video, we illustrate how you can implement simple URL validation using url input type.

Source Code: HTML file

index.html

<!DOCTYPE html>
<html>
<head>
<title>URL Input Type: HTML5</title>
<link href="myStyle.css" rel="stylesheet" />
</head>
<body>
 
<form>
 <label for="uri">URL: </label>
<input type="url"/>
<input type="submit"/>
</form>
 
</body>
</html>

Simple url type input field checks for the presence of http:// followed by some domain name, dot and a valid TLD(Top Level Domain) name.

Video Tutorial: Form Input Type – url: HTML5


[youtube https://www.youtube.com/watch?v=BnVK7jecJ0o]

YouTube Link: https://www.youtube.com/watch?v=BnVK7jecJ0o [Watch the Video In Full Screen.]



Note:
It doesn’t ping the entered URL to check if the URL is actually present or not. It simply checks to make sure the user entered information starts with http:// and ends with a dot followed by a valid TLD.

If viewed on a HTML5 compatible mobile browser, it pops up custom keyboard to facilitate the user to enter URL.

Accessing localhost Web-server on Mac and PC

Make sure that you turn on the Wamp if you are on a PC and Mamp if you are on Mac.

PC users can access their web files using the URL http://localhost/

Mac users can access their web files using the URL http://localhost/~yourUserDirectory

yourUserDirectory is the user account name of your Mac computer using which you have logged in.

On my Mac, I have a user directory by name Satish. So I can access my web files using http://localhost/~Satish

On Mac, once you enter http://localhost/~yourUserDirectory it automatically changes the URL – but don’t worry about it, its working fine and that’s how it works!



Let non of these small things make you not use the web server. I am writing this because, some times small things like this suck a lot of time and some people may even start feeling this as something very much technical and complicated and may leave the idea of learning altogether.

If you successfully accessed your web files from your localhost web server, then congratulations. Continue your exploration. We have a lot of simple PHP examples on this website that you may want to try. All the Best.