Ember js app load from the beginning instead of using willtransition hook

Hello everyone I'm using ember 3.1. The problem I get is when I move to view my profile page from the dashboard instead of just transitioning it loads the whole page which in result slows down my app. My router.js is like this:

Router.map(function () {
  this.route('login', { path: 'login' });
  this.route('main', { path: '/' }, function () {
    this.route('dashboard', { path: '' }, function () {});
    this.route("review", { path: "/review/:docId" }, function() { 
      this.route("edit", { path: "/edit/:bitId" });
      this.route('window_edit');
    });
    this.route("view", { path: "/view/:docId" });
    this.route('pending_view',{ path: "/pending_view/:docId" });
    this.route('profile');
    this.route('loading');
  });

When I go to for example route main.view it goes directly without loading the whole page. It pass through willTransition() hook I added in my app/route.js file but the profile page goes through model() . Will appreciate any help on this