Timeonsitetracker.js has been released this week to improve web analytics with accuracy, page significance and wide browser support in mind. This software is created to better understand usage patterns and content significance of web sites and web applications. It tries to overcome two problems in time on site metric that has been prevalent for long time; accuracy and real-time metric of time on page(TOP) and time on site(TOS). This implementation is so far very successful in measuring these two key parameters by finding and making use of right JavaScript APIs and browser capabilities to deliver this solution. This article elaborates some of the features and APIs of timeonsitetracker.js that can be used to immediately collect most important metric in web analytics “time on site”.
Tos.getTimeOnPage() API
This is the most important API in this software. When timeonsitetracker.js is injected into page and initialized, you get “Tos” window object. Using this, you can retrieve current time on page information as long as you stay in web page by calling Tos.getTimeOnPage(), it returns…
{
TOSId: 1129620185532,
TOSSessionKey: “14802525481391382263”,
TOSUserId: “anonymous”,
title: “Blog application — Nature & Wildlife”,
URL: “http://tos-localdata.chennai/home.php"
entryTime: “2012–11–27 13:15:48.663”,
exitTime: “2012–11–27 13:17:31.663”,
timeOnPage: 103,
timeOnSite: 0,
timeOnPageTrackedBy: “second”,
timeOnPageByDuration: “0d 00h 01m 43s”,
timeOnSiteByDuration: “0d 00h 00m 00s”,
trackingType: “tos”,
}As you see, it captures “timeOnPage” as 103 and more readable “timeOnPageByDuration” as “0d 00h 01m 43s”. Along with this, it captures page URL, page title and generated TOSSessionKey that helps you track analytics nicely. This same API when called on page refresh or close would have returned back,
{
……
TOSSessionKey: “14802525481391382263”,
……
timeOnPage: 103,
timeOnSite: 103,
……
timeOnPageByDuration: “0d 00h 01m 43s”,
timeOnSiteByDuration: “0d 00h 01m 43s”,
……
}This first page visit always contains same timeOnPage and timeOnSite value. On subsequent page visits, timeOnSite would be greater than timeOnPage and contains the final/latest “time on site” metric of user session.
Timeonsitetracker.js: Key features
* Multi browser tab tracking
It can track time on site concurrently in multiple browser tabs. Only the active tab’s time on page is measured/updated. Other tabs resume tracking when users switch back to respective tabs. Inactive browser tab time is ignored by default. This has been a major concern and found to be a problem in other time tracking software available. timeonsitetracker.js solves this nicely by active session monitoring in multi tab browser environment.
* User session segregation
Time on site can be captured as anonymous or authenticated. All sessions captured with timeonsitetracker.js are anonymous by default. You can use Tos.startSession() API to convert the given session to “authenticated” when user logs in to your site. When user logs out, use Tos.endSession() to mark the authenticated session to be over. This helps you find usage patterns of normal users and authenticated yours in your application. It gives you new insights about why certain pages are used more by anonymous users over authenticated ones. The “TOSSessionKey” is your unique session indicator.
* Domain based and path based tracking in URL
It helps you segregate user session identification by sub-domains and paths. It allows you to set this configuration just like setting sub-domain and path in cookies. For example, if a blog application has paths http://example-blog.com/travel and http://example-blog.com/health and you don’t want to mingle user sessions when a user browsers /travel and /health pages in multi-tab environment, it basically allows you to do so with traditional cookie setting. This concept applies to sub-domains also.
* Real-time tracking: time on site
This is a problem in all time tracking software available today, yet timeonsitetracker.js tries to overcome and provide a way for this. In any time tracking software, you cannot get time on page of single page visits because before you calculate it and send the data to server reliably, page is closed immediately when user clicks “close” button. That is the reason why, for n page visits, you always get (n-1) page data. This means last page visit data is processed in current page access by storing it in cookies and local storage. This is config->request->object approach in this software. This is usually non-blocking by nature and can be used reliably.
Other than this, this software provides a way to send the data to server immediately on page close. This is achieved with callback function that you provide on initializing the tracker. This is config->callback->function approach. This is blocking the UI by nature in case server is hung or takes more time to save data in back-end and return a success message. This is real-time tracking approach because for n page accesses, you get n number of time on page data. For example if there are 3 page visits in given session, you get (1st page visit + 2nd page visit + 3rd page visit) = time on site immediately at the end of current session. This can be tested in non-production environments but not usually recommended unless you are sure that the server is ready and process requests immediately without delay.
* Full control over data
All the TOS data collected is sent to your own server and it allows you full control over your data. Your data is free from intrusion since you own the database servers and data privacy is ensured.
* Simple & easy configuration
// use call back data "time on site" data
var config = {
trackBy: 'seconds',
callback: function(data) { // if you give callback, it becomes real-time tracking
console.log(data);
// give your end-point URL to save data to DB
}};Including timeonsitetracker.js in web page is quite easy and highly customizable. It also allows you quick and simple configuration to get started quickly.
Visual: dashboard and reporting application
The reporting application enables you query data and find interesting stats about your application. It uses DataTables and dc.js library to visualize data and generate reports. It can be used to track web usage analytics in business critical applications and find key insights about usage of your applications. It’s only a starting point for visualization of your web applications; otherwise, you can use the time on site data to build your own custom reports and advanced reporting capabilities. This is available readily on Github. More information about Visual is available on project page linked below.
Learn more about timeonsitetracker.js at https://github.com/saleemkce/timeonsite (project site) and https://saleemkce.github.io/timeonsite (docmentation and reporting application)
