Question

Im creating a website and I chose to do it in AJ.
I have two folders:
Gateways => some php files which retrive data from a mysql db and echos the data as json.
Views => Partial html files which are basically the template for each page. eg Users, Items, etc.

then I have a index.js file which handels the request process and routing:

angular.module('Index',['addon'],function($routeProvider,$locationProvider){
    $locationProvider.html5Mode(true).hashPrefix("!");
    $routeProvider.otherwise({
        templateUrl: '/views/index.html',
        controller: "index"
    }).when("/items/",{
        templateUrl: '/views/items.html',
        controller: "items"
    })
}).
controller("index",function($scope,$http){

    $scope.users = [];
    $http.get("gateways/list.php").
    success(function(d){
        console.log(d);
        if(angular.isArray(d)){
            $scope.users = d;
        }
    });

}).
controller("items",function($scope,$http,$routeParams){
    $scope.items = [];
    $http.get("gateways/single.php").
    success(function(d){
        if(angular.isArray(d)){
            $scope.items = d;
        }
    });

}).

What is the point of all this route providers in AJ except its elegancy?
Dont they just slow down the site because of number of the requests?
I could just write the php code from the gateways files directly in the templates files?
Am I doing it in the wrong way?

Answer 1

You might be missing the point of using frameworks like AngularJS. They are mostly for Single Page application and ajax intensive. And let me begin that the number of requests don’t really slow down application. Remember how Gmail used to be at first without Ajax ? Was it faster than the current implementation ?

Now, when you build a single page application, the app sends req to server and server responds in JSON or XML. In frameworks like AngularJS or any other, server sends the JSON response and we render them using client side templates or DOM. This saves enormous resource from the server side since server doesn’t have to parse the array and render the template. So if server had to render a table which has 100 rows, the bandwidth to send to your browser might be 20KB whereas only JSON might be 5KB and a string or DOM template with 1KB to do the rendering. So, you’re actually having your visitor’s browser do a lot of job. It’s all about calculations/computations. Think of a statistics table where there are columns and some computed values to be presented in a data grid. With Client side frameworks, your server would just respond as JSON and browser (with JavaScript) will parse,calculate and render it in template.

As for the question of using a routerProvider, it’s essential to bookmark and use browser navigation button. Just like a traditional url has a view, a URL in client side app has a view which should be bookmarkable and should support navigation.