Is there any improvement in tracking time-on-site Real-time without depending on the request option/Localstorage (as of November 2021)?

[saleemkce]

Short answer: Yes, with increased sendBeacon/Fetch API support from most browsers, you can track time on site real-time now. For N "pageviews", you'll have N "time on site" records in your favorite database table.

Long answer: We know, a lot of our users have been quite interested for real-time tracking of time on site parameter for web analytics since our tracker is more transparent, open and accurate in terms of leveraging this metric. The problem with most analytics providers is that this metric is captured with the help of polling or ping techniques. That is, the API will hit the DB table every 5 or 10 seconds continuously to update the time on page & time on site for the given user session. On the other hand, this tracker, from the very beginning, has been on the goal that it should not overload the server with polling or pings (you'll see that on Network tab when using other analytics) thus preventing CPU overheads and costs incrementally.

So, what's the change/Update on this?
We have been working with various browser vendors by raising the issue to fix the problems associated with sendBeacon and Fetch API so that we can experience "time on site" real-time and avoid the old, boring polling/ping techniques. As per our requests and other developers all over the world, sendBeacon and Fetch API's security issue have been fixed and allowed now back again in leading browsers like Chrome, Firefox, Edge, Safari etc. It's a great and big news for all of us interested in user analytics.

As your know, we have two ways to save data with this state-fo-the-art time-on-site tracker,
1, callback function option: this is real-time. For N page views, you'll have N "time on site" records grouped by unique sessions in your DB table (most preferred and lossless approach in analytics)
2, request object option: this is not real-time but delayed approach. For N page views, you'll have N-1 "time on site" records grouped by unique sessions in your DB table(lossy approach. Last 1 record will be available in next page load). But, this option has been used by our users using this timeonsitetracker.js around the world since the mid of 2018 due to "sendBeacon" security issue in Chrome/Firefox and other browsers.

Are there any known problems we need to overcome?
Mostly "Big NO" for most browsers except one scenario. "beforeunload" event is not at all supported in IOS devices like Iphone, Ipad and mobile safari browser. For these devices alone, we have to fallback to "request option/localStorage" for the time being by checking Navigator.platform while initiating the tracker. It's a win-win situation for us since we can track all devices real-time except IOS devices for which we can safely apply "request object option" and get the last record later on for now.

Could you share that configuration that will help us achieve this efficiency while tracking in my websites?

var Tos;
(function(d, s, id, file) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s);
    js.id = id;
    js.onload = function() {
        // give your endpoint URL/ server-side URL that is going to handle your TOS/activity data which is of POST method. Eg. PHP, nodejs or python URL which saves this data to your DB
        var endPointUrl = 'http://localhost:4500/tos'; // replace with your endpoint URL

        // checking for IOS based browser or not
        var isIOS = (/iPad|iPhone|iPod/i.test(navigator.platform)) && !window.MSStream;

        if (!isIOS) { /* All browsers desktop and mobile except IOS devices */
            var config = {
                // track page by seconds. Default tracking is by milliseconds
                trackBy: 'seconds',
    
                callback: function(data) { /* callback denotes your data tracking is real-time */
                    console.log(data);
                    if (data && data.trackingType) {
                        if (data.trackingType == 'tos') {
                            if (Tos.verifyData(data) != 'valid') {
                                console.log('Data abolished!');
                                return; 
                            }
                        }
                        
                        // make use of sendBeacon if this API is supported by your browser.
                        if (navigator && typeof navigator.sendBeacon === 'function') {
                            data.trasferredWith = 'sendBeacon';
                            var blob = new Blob([JSON.stringify(data)], {type : 'application/json'});
                            navigator.sendBeacon(endPointUrl, blob);
                        }
                    }
                }
            };

        } else { /* For IOS devices only since "beforeunload" event is not supported */
            var config = {
                // track page by seconds. Default tracking is by milliseconds
                trackBy: 'seconds',
            
                request: { /* Presence of request object denotes we're going to use Localstorage */
                    url: endPointUrl
                }
            };

        }
        
        if (TimeOnSiteTracker) {
            Tos = new TimeOnSiteTracker(config);
        }
    };
    js.src = file;fjs.parentNode.insertBefore(js, fjs);
} (document, 'script', 'TimeOnSiteTracker', 'timeonsitetracker.min.js'));

If you are testing in non-production environment, I'd recommend you setting,
developerMode: true
in configuration since that will help you tracking any issues in setting up the tracker.

• You hitting a "star" gives more confidence for us to keep building the tracker more transparent, accurate & free for non-production & non-profit organizations.

Adding all members who have contributed to this tracker in one way or other to increase the visibility of the feature.
@evonsdesigns @hoangtrucit @skaught @evandrix @skpear @blueoceanideas @Manikant92 @D33P4K @Akimyou @AndreaMorone
@littlethumb123 @mtasuandi @awright415 @XPilot @milton-alvarenga @bfblackjack @JStika @rene-giretzlehner @niitprachi @nomanilyas16 [only a small set of users have been added for notification]

Our blogs on time-on-site tracking & analytics, if you had missed (these links not for ones who already visited these bogs):
Introducing time-on-site Analytics For Businesses And High-end Applications
Understand the content significance of web pages with time on-site metrics to maximize business

[saleemkce]

As an avidence for this post, following are the real-time time-on-site metric analytics captured this month (November, 2021) with visual, free & pre-configured reporting & analytics tool for timeonsitetracker.js

Reporting Dashboard View

Analytics Dashboard View