JavaScript Network Speed Tester

JavaScript Network Speed Tester

JavaScript Bandwidth Checker

Putting Them All Together

To show the flexibility of the provided network speed tester service we will build now a small app having some basic UI that will use the whole test suite.

<html>
    <head>
        <link rel="stylesheet" href="../bins/lib/bootstrap/css/bootstrap.min.css"/>
        <script type="text/javascript" src="../bins/lib/angular/angular.min.js"></script>
        <script type="text/javascript" src="../bins/wl-ng-network-speed-tester.js"></script>
    </head>
    <body>
        <div class="well well-sm" ng-app="demo-app" ng-controller="demoAppController">
            <div><b>Ping time:</b> {{pingTime}} seconds</div>
            <div><b>Download info:</b> {{downloadData}}</div>
            <div><b>Upload info:</b> {{uploadData}}</div>
            <br/>
            <button class="btn btn-default" ng-click="refresh()"><span class="glyphicon glyphicon-refresh"></span> Refresh</button>
        </div>
        <script type="text/javascript">
            //must set the bins url
            angular.module('wl-ng-network-speed-tester').value('bins', '../bins');

            //create an AngularJS module with a dependency to our bandwidth tester
            var demoApp = angular.module('demo-app', ['wl-ng-network-speed-tester']);
            //declare a controller with a dependency on network speed services
            demoApp.controller('demoAppController', function($scope, wlNgNSTService, wlNgNSTDataGenerator) {

                //initialize the scope
                $scope.pingTime = 0;
                $scope.downloadData = {};
                $scope.uploadData = {};

                //generate 1Mb of data to upload
                var uploadData = wlNgNSTDataGenerator.generate(102400);

                //refresh will be called from UI
                $scope.refresh = function() {

                    wlNgNSTService.ping()
                    .then(function(pingTime) {
                        $scope.pingTime = pingTime;
                    }, function(error) {
                        $scope.pingTime = 0;
                    });

                    wlNgNSTService.download()
                    .then(function(ret) {
                        $scope.downloadData = ret;
                    }, function(error) {
                        $scope.downloadData = {};
                            });

                    wlNgNSTService.upload(uploadData)
                    .then(function(ret) {
                        $scope.uploadData = ret;
                    }, function(error) {
                        $scope.uploadData = {};
                            });
                };

                $scope.refresh();
            });
        </script>
    </body>
</html>

The result:

tut-service-all.png
Network testing speed app with some minimal UI
Note:
Please note that the the directive will call this service methods multiple times (see iteration attribute) and will offer an average result increasing the accuracy of the measurement.
Regular License $6.00
Use by you or one client, in a single end product which end users are not charged for.

Extended License $30.00
Use by you or one client, in a single end product which end users can be charged for.

Short Information

WiseLoop JavaScript Network Speed Tester is an AngularJS module designed to offer a network bandwidth check against your internet server. Many server types are supported such as Apache HTTP, IIS, Node.js, nginx, Tomcat, Oracle HTTP, jetty and based on the download speed, it can also offer an estimation of internet cost that the user should pay for.

Buyer rating:
144 Sales