Categories
analytics chat chatting google google-analytics javascript live live-users long-polling nginx node.js performance persistent persistent-connection php5-fpm Proxy real-time response reverse-proxy socket socket.io socks tcp upstream web-server websocket websocket-handshake

How To Make Your Own Analytics Tool?

An analytics tool is a tool that you can use to get the information about how is your website performance, how are the users using it, what are the number of users at anytime(live users), live users for different urls, and other infos. One such example of the tool is the google analytics.

Analytics tool

Analytics tool gives a lot of information about your website with the nice looking graphs and all. In this blog, we will be discussing how we can make such analytics tool(digging the data).

Question 1: Why should we make such thing if it already exists?

Answer : One reason is that it is not free for always. The other reason is that the process of making it is very sexy and you learn technologies that you can use to make your own other real time apps like chatting app. Now that is more a valid reason.

Question 2: What are we talking about?

Answer : This is an example of a real time application. You see, you are tracking live users’ data. The data can be anything like total number of users anytime or number of users for different urls or different referral or different user agent or different visited ips, or anything. The other example of a real time application is a chatting application where a lot of users are communicating at the same time.

Question 3: What technologies are used for such an application?

Answer : So we need a continuous stream of response from the server about their performance as only servers know what is hitting them. It can only be achieved if there is some persistent connection between client and server so that server can continuously push data to the client. With persistent connection I would mean one for literally persistent connection(web sockets) or else timed persistent connection(long polling) or else chunk persistent connection(polling). By timed persistent connection, I mean persistent connection only for certain time interval after which it is closed and again opened. And by chunk persistent connection, I mean lots of request with no persistency, but the requests are so frequent that altogether they seem persistent(my bad).

Among all, I prefer web sockets, as I can’t logically satisfy myself why to use others and more of it that they are the outdated styles and only existed when sockets were not there.

So in this tutorial we will be using socket.io library with node.js to create web sockets. Below are the other libraries with other language which I found from here.

Analytics tool

And yes, we are going to use Nginx as a reverse proxy for web sockets. A very great tutorial regarding this can be found here. You can skip Nginx if you wish and directly test for your node.js server.

For Nginx configuration, as mentioned in tutorial,

server {
    server_name app.domain.com;
    location / {
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_http_version 1.1;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $host;
        proxy_pass http://socket_nodes;
    }
}

Proper explanation is given in that tutorial for how this will work for sockets. Now we setup our Node server(server.js), a very nice tutorial can be found here.

var data = {};
var http = require(“http”);
var url = require(‘url’);
var fs = require(‘fs’);
var io = require(‘socket.io‘);
var path;
var server = http.createServer(function(request, response){
        console.log(‘Request Accepted’);
        path = url.parse(request.url).pathname;
        switch(path){
            case ‘/’:
                response.writeHead(200, {‘Content-Type’: ‘text/html’});
                response.write(‘hello world’);
                response.end();
                break;
            case ‘/live’:
                fs.readFile(__dirname + ‘/socket_io.html’, function(error, data){
                    if (error){
                        response.writeHead(404);
                        response.write(“opps this doesn’t exist – 404”);
                        response.end();
                    }
                    else{
                        response.writeHead(200, {“Content-Type”: “text/html”});
                        response.write(data, “utf8”);
                        response.end();
                    }
                });
                break;
            default:
                response.writeHead(404);
                response.write(“opps this doesn’t exist – 404  –“+path);
                response.end();
                break;
        }
    });
 server.listen(8001);
 var listener = io.listen(server);
 listener.sockets.on(‘connection’, function(socket){
    console.log(‘Socket Made.’);
    setInterval(function(){
        socket.emit(‘showdata’, {‘data’: data});
    }, 1000);
 socket.on(‘disconnect’, function(){
    console.log(“Socket Closed.”);
 });
});

Load socket.io.js on the client side in your socket_io.html which will be used to create event to create a persistent connection. (Please don’t bang your head for how would it find socket.io.js)

/socket.io/socket.io.js

     var socket = io.connect(); // your initialization code here.
     socket.on('showdata', function(data){
          console.log(data);
     });

Now you can see all the data in your browser’s console. You can put this data at the right place of your analytics html. Now you can easily send continuous data from node server to your client.

Are you still wondering how would we gather data? Suppose we want to track number of live users, for that we will use a key “live” in data variable and initialize with 0. We will increment it as soon as there is a socket made and decrement it as soon as the socket is closed(Make sure io.connect() is called once and only once for a page load). So the data[‘live’] will determine the number of live users.

In server.js,

listener.sockets.on(‘connection’, function(socket){
    console.log(‘Socket Made.’);
    data[‘live’] +=1;
    setInterval(function(){
        socket.emit(‘showdata’, {‘data’: data});
    }, 1000);
 socket.on(‘disconnect’, function(){
 data[‘live’]-=1;
    console.log(“Socket Closed.”);
 });

As simple as that. It is just the logics in node to be done and you can achieve any data. Now for temporary data(by temporary I mean the machine hosting node server is until rebooted), we don’t need any extra storage.

If we want to use some durable data, or store some information, we can choose database of our choice and send data from node to database.

Now we are also using Nginx as a reverse proxy which is helpful in load handling and better scaling. We can extract other information like user ip, upstream responses(php), and other valuable information and send to node.

So yes, it is really interesting to make such tool, I told you so. You are surely going to stuck in somewhere or make it up or for any suggestion or for confusion, we can always discuss.

Great to see you people with your own analytics tool. 🙂

Categories
bypass caching configuration fastcgi full-page-caching mastering-nginx microcaching nginx performance static upstream

Microcaching : How to do caching in nginx web server?

Caching is a technique to speed up the response of your website’s static content, content which does not change with time. Microcaching is a type of caching which has short expiry time of cache. This article is about how to set up microcaching in nginx web server.

If you have a website and it contain webpages which do not change, then you are at the right place. Yes you can improve your website’s performance by many folds.

How caching improves performance?

Whenever some request on your website is made, it first goes to your Nginx web server (reverse proxy server). Then it is forwarded to some upstream server to run php-code. But if you have some static content, calling upstream servers is just an overhead. You would always want to keep your upstream servers as free as possible because they are already slow. What can be done is unnecessary or repeated request are served by Nginx itself(this guy is damn fast), relieving upstream servers. This is where caching shows up. Whenever there is some static content request, they are cached by Nginx. On further request of same data they are served by Nginx from its cache.

Nginx does full page caching i.e., it caches the data in its html form. The cache data might be encoded depending on the response from Upstream servers(first time response).

How is Caching done?

We will see a simple configuration for caching using Nginx. It might be made more efficient on further deep study of the same.

First we need to define a caching region, in http context of your Nginx configuration,

fastcgi_cache_path /var/nginx/cache levels=1:2 keys_zone=MYCACHE:10m;

Then, we got to use this cache region, [following should be included in proper context, possibly server context]

fastcgi_cache MYCACHE;

Define the cache key,

fastcgi_cache_key $server_name|$request_uri;

You can also create conditions to bypass and to avoid the caching using following parameters,

fastcgi_cache_bypass ByPass; [Bypass is “1” to bypass]

fastcgi_cache_nocache NoCache; [NoCache is “1” to avoid cache]

This is it, this much should do it. You are set for microcaching of static content of your website on your nginx web server.

Have a rocking Deepawali with Caching !

Do contact me in case of any query.