diff --git a/static/scripts/app/views/dir.js b/static/scripts/app/views/dir.js
index f5c4784603..e14f8dca7c 100644
--- a/static/scripts/app/views/dir.js
+++ b/static/scripts/app/views/dir.js
@@ -190,8 +190,9 @@ define([
                     this.renderDirentsHd();
                 }
 
-                Common.updateSortIconByMode(this);
-                this.dir = Common.sortCollection(this.dir);
+                // sort
+                Common.updateSortIconByMode({'context': this.$el});
+                this.sortDirents();
 
                 this.dir.last_start = 0;
                 this.dir.limit = 100;
@@ -678,18 +679,64 @@ define([
                 }
             },
 
-            sortByName: function() {
-                if (app.pageOptions.sort_mode == 'name_up') {
-                    // change sort mode
-                    Cookies.set('sort_mode', 'name_down');
-                    app.pageOptions.sort_mode = 'name_down';
-                } else {
-                    Cookies.set('sort_mode', 'name_up');
-                    app.pageOptions.sort_mode = 'name_up';
+            sortDirents: function() {
+                var sort_mode = app.pageOptions.sort_mode;
+                switch(sort_mode) {
+                    case 'name_up':
+                        this.dir.comparator = function(a, b) {
+                            if (a.get('is_dir') && b.get('is_file')) {
+                                return -1;
+                            }
+                            if (a.get('is_file') && b.get('is_dir')) {
+                                return 1;
+                            }
+                            var result = Common.compareTwoWord(a.get('obj_name'), b.get('obj_name'));
+                            return result;
+                        };
+                        break;
+                    case 'name_down':
+                        this.dir.comparator = function(a, b) {
+                            if (a.get('is_dir') && b.get('is_file')) {
+                                return -1;
+                            }
+                            if (a.get('is_file') && b.get('is_dir')) {
+                                return 1;
+                            }
+                            var result = Common.compareTwoWord(a.get('obj_name'), b.get('obj_name'));
+                            return -result;
+                        };
+                        break;
+                    case 'time_up':
+                        this.dir.comparator = function(a, b) {
+                            if (a.get('is_dir') && b.get('is_file')) {
+                                return -1;
+                            }
+                            if (a.get('is_file') && b.get('is_dir')) {
+                                return 1;
+                            }
+                            return a.get('last_modified') < b.get('last_modified') ? -1 : 1;
+                        };
+                        break;
+                    case 'time_down':
+                        this.dir.comparator = function(a, b) {
+                            if (a.get('is_dir') && b.get('is_file')) {
+                                return -1;
+                            }
+                            if (a.get('is_file') && b.get('is_dir')) {
+                                return 1;
+                            }
+                            return a.get('last_modified') < b.get('last_modified') ? 1 : -1;
+                        };
+                        break;
                 }
 
-                Common.updateSortIconByMode(this);
-                this.dir = Common.sortCollection(this.dir);
+                this.dir.sort();
+            },
+
+            sortByName: function() {
+                Common.toggleSortByNameMode();
+                Common.updateSortIconByMode({'context': this.$el});
+                this.sortDirents();
 
                 this.$dirent_list_body.empty();
                 this.render_dirents_slice(0, this.dir.limit);
@@ -698,17 +745,9 @@ define([
             },
 
             sortByTime: function () {
-                if (app.pageOptions.sort_mode == 'time_down') {
-                    // change sort mode
-                    Cookies.set('sort_mode', 'time_up');
-                    app.pageOptions.sort_mode = 'time_up';
-                } else {
-                    Cookies.set('sort_mode', 'time_down');
-                    app.pageOptions.sort_mode = 'time_down';
-                }
-
-                Common.updateSortIconByMode(this);
-                this.dir = Common.sortCollection(this.dir);
+                Common.toggleSortByTimeMode();
+                Common.updateSortIconByMode({'context': this.$el});
+                this.sortDirents();
 
                 this.$dirent_list_body.empty();
                 this.render_dirents_slice(0, this.dir.limit);
diff --git a/static/scripts/app/views/group.js b/static/scripts/app/views/group.js
index 3ee7d30f4f..f39fcc0df8 100644
--- a/static/scripts/app/views/group.js
+++ b/static/scripts/app/views/group.js
@@ -3,14 +3,13 @@ define([
     'underscore',
     'backbone',
     'common',
-    'js.cookie',
     'app/collections/group-repos',
     'app/views/group-repo',
     'app/views/add-group-repo',
     'app/views/group-members',
     'app/views/group-discussions',
     'app/views/group-settings'
-], function($, _, Backbone, Common, Cookies, GroupRepos, GroupRepoView,
+], function($, _, Backbone, Common, GroupRepos, GroupRepoView,
     AddGroupRepoView, GroupMembersView, GroupDiscussionsView, GroupSettingsView) {
     'use strict';
 
@@ -67,7 +66,11 @@ define([
                 this.$emptyTip.hide();
                 this.renderReposHd();
                 this.$tableBody.empty();
-                this.repos = Common.sortCollection(this.repos);
+
+                // sort
+                Common.updateSortIconByMode({'context': this.$el});
+                Common.sortLibs({'libs': this.repos});
+
                 this.repos.each(this.addOne, this);
                 this.$table.show();
             } else {
@@ -75,7 +78,6 @@ define([
                 this.$table.hide();
             }
 
-            Common.updateSortIconByMode(this);
         },
 
         renderGroupTop: function(options) {
@@ -172,19 +174,9 @@ define([
         },
 
         sortByName: function() {
-
-
-            if (app.pageOptions.sort_mode == 'name_up') {
-                // change sort mode
-                Cookies.set('sort_mode', 'name_down');
-                app.pageOptions.sort_mode = 'name_down';
-            } else {
-                Cookies.set('sort_mode', 'name_up');
-                app.pageOptions.sort_mode = 'name_up';
-            }
-
-            Common.updateSortIconByMode(this);
-            this.repos = Common.sortCollection(this.repos);
+            Common.toggleSortByNameMode();
+            Common.updateSortIconByMode({'context': this.$el});
+            Common.sortLibs({'libs': this.repos});
 
             this.$tableBody.empty();
             this.repos.each(this.addOne, this);
@@ -194,17 +186,9 @@ define([
         },
 
         sortByTime: function() {
-            if (app.pageOptions.sort_mode == 'time_down') {
-                // change sort mode
-                Cookies.set('sort_mode', 'time_up');
-                app.pageOptions.sort_mode = 'time_up';
-            } else {
-                Cookies.set('sort_mode', 'time_down');
-                app.pageOptions.sort_mode = 'time_down';
-            }
-
-            Common.updateSortIconByMode(this);
-            this.repos = Common.sortCollection(this.repos);
+            Common.toggleSortByTimeMode();
+            Common.updateSortIconByMode({'context': this.$el});
+            Common.sortLibs({'libs': this.repos});
 
             this.$tableBody.empty();
             this.repos.each(this.addOne, this);
diff --git a/static/scripts/app/views/myhome-repos.js b/static/scripts/app/views/myhome-repos.js
index aa1b470166..1e8337eec4 100644
--- a/static/scripts/app/views/myhome-repos.js
+++ b/static/scripts/app/views/myhome-repos.js
@@ -3,11 +3,10 @@ define([
     'underscore',
     'backbone',
     'common',
-    'js.cookie',
     'app/collections/repos',
     'app/views/repo',
     'app/views/add-repo',
-], function($, _, Backbone, Common, Cookies, RepoCollection, RepoView, AddRepoView) {
+], function($, _, Backbone, Common, RepoCollection, RepoView, AddRepoView) {
     'use strict';
 
     var ReposView = Backbone.View.extend({
@@ -50,7 +49,11 @@ define([
                 this.$emptyTip.hide();
                 this.renderReposHd();
                 this.$tableBody.empty();
-                this.repos = Common.sortCollection(this.repos);
+
+                // sort
+                Common.updateSortIconByMode({'context': this.$el});
+                Common.sortLibs({'libs': this.repos});
+
                 this.repos.each(this.addOne, this);
                 this.$table.show();
             } else {
@@ -58,8 +61,6 @@ define([
                 this.$emptyTip.show();
             }
 
-            Common.updateSortIconByMode(this);
-
             if (app.pageOptions.guide_enabled) {
                 $('#guide-for-new').modal({appendTo: '#main', focus:false});
                 $('#simplemodal-container').css({'height':'auto'});
@@ -119,17 +120,9 @@ define([
         },
 
         sortByName: function() {
-            if (app.pageOptions.sort_mode == 'name_up') {
-                // change sort mode
-                Cookies.set('sort_mode', 'name_down');
-                app.pageOptions.sort_mode = 'name_down';
-            } else {
-                Cookies.set('sort_mode', 'name_up');
-                app.pageOptions.sort_mode = 'name_up';
-            }
-
-            Common.updateSortIconByMode(this);
-            this.repos = Common.sortCollection(this.repos);
+            Common.toggleSortByNameMode();
+            Common.updateSortIconByMode({'context': this.$el});
+            Common.sortLibs({'libs': this.repos});
 
             this.$tableBody.empty();
             this.repos.each(this.addOne, this);
@@ -139,17 +132,9 @@ define([
         },
 
         sortByTime: function() {
-            if (app.pageOptions.sort_mode == 'time_down') {
-                // change sort mode
-                Cookies.set('sort_mode', 'time_up');
-                app.pageOptions.sort_mode = 'time_up';
-            } else {
-                Cookies.set('sort_mode', 'time_down');
-                app.pageOptions.sort_mode = 'time_down';
-            }
-
-            Common.updateSortIconByMode(this);
-            this.repos = Common.sortCollection(this.repos);
+            Common.toggleSortByTimeMode();
+            Common.updateSortIconByMode({'context': this.$el});
+            Common.sortLibs({'libs': this.repos});
 
             this.$tableBody.empty();
             this.repos.each(this.addOne, this);
diff --git a/static/scripts/app/views/myhome-shared-repos.js b/static/scripts/app/views/myhome-shared-repos.js
index 24dbe8cdaf..c29117ab57 100644
--- a/static/scripts/app/views/myhome-shared-repos.js
+++ b/static/scripts/app/views/myhome-shared-repos.js
@@ -3,10 +3,9 @@ define([
     'underscore',
     'backbone',
     'common',
-    'js.cookie',
     'app/collections/repos',
     'app/views/shared-repo',
-], function($, _, Backbone, Common, Cookies, RepoCollection, SharedRepoView) {
+], function($, _, Backbone, Common, RepoCollection, SharedRepoView) {
     'use strict';
 
     var SharedReposView = Backbone.View.extend({
@@ -42,7 +41,11 @@ define([
                 this.$emptyTip.hide();
                 this.renderReposHd();
                 this.$tableBody.empty();
-                this.repos = Common.sortCollection(this.repos);
+
+                // sort
+                Common.updateSortIconByMode({'context': this.$el});
+                Common.sortLibs({'libs': this.repos});
+
                 this.repos.each(this.addOne, this);
                 this.$table.show();
             } else {
@@ -50,7 +53,6 @@ define([
                 this.$table.hide();
             }
 
-            Common.updateSortIconByMode(this);
         },
 
         showSharedRepos: function() {
@@ -106,17 +108,9 @@ define([
         },
 
         sortByName: function() {
-            if (app.pageOptions.sort_mode == 'name_up') {
-                // change sort mode
-                Cookies.set('sort_mode', 'name_down');
-                app.pageOptions.sort_mode = 'name_down';
-            } else {
-                Cookies.set('sort_mode', 'name_up');
-                app.pageOptions.sort_mode = 'name_up';
-            }
-
-            Common.updateSortIconByMode(this);
-            this.repos = Common.sortCollection(this.repos);
+            Common.toggleSortByNameMode();
+            Common.updateSortIconByMode({'context': this.$el});
+            Common.sortLibs({'libs': this.repos});
 
             this.$tableBody.empty();
             this.repos.each(this.addOne, this);
@@ -125,17 +119,9 @@ define([
         },
 
         sortByTime: function() {
-            if (app.pageOptions.sort_mode == 'time_down') {
-                // change sort mode
-                Cookies.set('sort_mode', 'time_up');
-                app.pageOptions.sort_mode = 'time_up';
-            } else {
-                Cookies.set('sort_mode', 'time_down');
-                app.pageOptions.sort_mode = 'time_down';
-            }
-
-            Common.updateSortIconByMode(this);
-            this.repos = Common.sortCollection(this.repos);
+            Common.toggleSortByTimeMode();
+            Common.updateSortIconByMode({'context': this.$el});
+            Common.sortLibs({'libs': this.repos});
 
             this.$tableBody.empty();
             this.repos.each(this.addOne, this);
diff --git a/static/scripts/app/views/organization.js b/static/scripts/app/views/organization.js
index e00a126b15..6883c27b45 100644
--- a/static/scripts/app/views/organization.js
+++ b/static/scripts/app/views/organization.js
@@ -87,14 +87,17 @@ define([
                 this.$emptyTip.hide();
                 this.renderReposHd();
                 this.$tableBody.empty();
-                this.repos = Common.sortCollection(this.repos);
+
+                // sort
+                Common.updateSortIconByMode({'context': this.$el});
+                Common.sortLibs({'libs': this.repos});
+
                 this.repos.each(this.addOne, this);
                 this.$table.show();
             } else {
                 this.$table.hide();
                 this.$emptyTip.show();
             }
-            Common.updateSortIconByMode(this);
         },
 
         showRepoList: function() {
@@ -125,17 +128,9 @@ define([
         },
 
         sortByName: function() {
-            if (app.pageOptions.sort_mode == 'name_up') {
-                // change sort mode
-                Cookies.set('sort_mode', 'name_down');
-                app.pageOptions.sort_mode = 'name_down';
-            } else {
-                Cookies.set('sort_mode', 'name_up');
-                app.pageOptions.sort_mode = 'name_up';
-            }
-
-            Common.updateSortIconByMode(this);
-            this.repos = Common.sortCollection(this.repos);
+            Common.toggleSortByNameMode();
+            Common.updateSortIconByMode({'context': this.$el});
+            Common.sortLibs({'libs': this.repos});
 
             this.$tableBody.empty();
             this.repos.each(this.addOne, this);
@@ -145,17 +140,9 @@ define([
         },
 
         sortByTime: function() {
-            if (app.pageOptions.sort_mode == 'time_down') {
-                // change sort mode
-                Cookies.set('sort_mode', 'time_up');
-                app.pageOptions.sort_mode = 'time_up';
-            } else {
-                Cookies.set('sort_mode', 'time_down');
-                app.pageOptions.sort_mode = 'time_down';
-            }
-
-            Common.updateSortIconByMode(this);
-            this.repos = Common.sortCollection(this.repos);
+            Common.toggleSortByTimeMode();
+            Common.updateSortIconByMode({'context': this.$el});
+            Common.sortLibs({'libs': this.repos});
 
             this.$tableBody.empty();
             this.repos.each(this.addOne, this);
diff --git a/static/scripts/common.js b/static/scripts/common.js
index a9d46ccf00..660175cdc4 100644
--- a/static/scripts/common.js
+++ b/static/scripts/common.js
@@ -63,7 +63,8 @@ define([
     'text',                     // Workaround for r.js, otherwise text.js will not be included
     'pinyin-by-unicode',
     'moment',
-], function($, _, text, PinyinByUnicode, Moment) {
+    'js.cookie'
+], function($, _, text, PinyinByUnicode, Moment, Cookies) {
     return {
         INFO_TIMEOUT: 10000,     // 10 secs for info msg
         SUCCESS_TIMEOUT: 3000,   // 3 secs for success msg
@@ -778,67 +779,87 @@ define([
             return (a >= b) - (a <= b);
         },
 
-        updateSortIconByMode: function(current_el) {
-            var sort_mode = app.pageOptions.sort_mode;
-
-            // first hide all icon
-            current_el.$('.by-name .sort-icon, .by-time .sort-icon').hide();
-
-            // show icon according sort mode
-            if (sort_mode == 'name_down') {
-                current_el.$('.by-name .sort-icon').removeClass('icon-caret-up').addClass('icon-caret-down').show();
-            } else if (sort_mode == 'name_up') {
-                current_el.$('.by-name .sort-icon').removeClass('icon-caret-down').addClass('icon-caret-up').show();
-            } else if (sort_mode == 'time_down') {
-                current_el.$('.by-time .sort-icon').removeClass('icon-caret-up').addClass('icon-caret-down').show();
-            } else if (sort_mode == 'time_up') {
-                current_el.$('.by-time .sort-icon').removeClass('icon-caret-down').addClass('icon-caret-up').show();
+        toggleSortByNameMode: function() {
+            if (app.pageOptions.sort_mode == 'name_up') {
+                Cookies.set('sort_mode', 'name_down');
+                app.pageOptions.sort_mode = 'name_down';
             } else {
-                // if no sort mode, show name up icon
-                current_el.$('.by-name .sort-icon').removeClass('icon-caret-down').addClass('icon-caret-up').show();
+                Cookies.set('sort_mode', 'name_up');
+                app.pageOptions.sort_mode = 'name_up';
             }
         },
 
-        sortCollection: function(current_collection) {
+        toggleSortByTimeMode: function() {
+            if (app.pageOptions.sort_mode == 'time_down') {
+                Cookies.set('sort_mode', 'time_up');
+                app.pageOptions.sort_mode = 'time_up';
+            } else {
+                Cookies.set('sort_mode', 'time_down');
+                app.pageOptions.sort_mode = 'time_down';
+            }
+        },
+
+        updateSortIconByMode: function(options) {
             var sort_mode = app.pageOptions.sort_mode;
+
+            var context = options.context;
+            var $byNameIcon = $('.by-name .sort-icon', context),
+                $byTimeIcon = $('.by-time .sort-icon', context);
+
+            // hide icons
+            $byNameIcon.hide();
+            $byTimeIcon.hide();
+
+            // show icon according sort mode
+            switch(sort_mode) {
+                case 'name_down':
+                    $byNameIcon.removeClass('icon-caret-up').addClass('icon-caret-down').show();
+                    break;
+                case 'name_up':
+                    $byNameIcon.removeClass('icon-caret-down').addClass('icon-caret-up').show();
+                    break;
+                case 'time_down':
+                    $byTimeIcon.removeClass('icon-caret-up').addClass('icon-caret-down').show();
+                    break;
+                case 'time_up':
+                    $byTimeIcon.removeClass('icon-caret-down').addClass('icon-caret-up').show();
+                    break;
+                default:
+                    $byNameIcon.removeClass('icon-caret-down').addClass('icon-caret-up').show();
+                    break;
+            }
+        },
+
+        sortLibs: function(options) {
             var _this = this;
+            var sort_mode = app.pageOptions.sort_mode;
+            var libs = options.libs;
 
-            // set collection comparator
-            current_collection.comparator = function(a, b) {
-                if (a.get('is_dir') && b.get('is_file')) {
-                    return -1;
-                }
-                if (a.get('is_file') && b.get('is_dir')) {
-                    return 1;
-                }
-
-                var a_name = a.get('name') || a.get('obj_name');
-                var b_name = b.get('name') || b.get('obj_name');
-
-                var a_time = a.get('mtime') || a.get('last_modified');
-                var b_time = b.get('mtime') || b.get('last_modified');
-
-                if (sort_mode == 'name_down' || sort_mode == 'name_up') {
-                    // if sort by name
-                    var result = _this.compareTwoWord(a_name, b_name);
-                    if (sort_mode == 'name_down') {
-                        return -result;
-                    } else {
+            switch(sort_mode) {
+                case 'name_up':
+                    libs.comparator = function(a, b) {
+                        var result = _this.compareTwoWord(a.get('name'), b.get('name'));
                         return result;
-                    }
-                } else {
-                    // if sort by time
-                    if (sort_mode == 'time_up') {
-                        return a_time < b_time ? -1 : 1;
-                    } else {
-                        return a_time < b_time ? 1 : -1;
-                    }
-                }
-            };
-
-            // sort collection
-            current_collection.sort();
-            return current_collection;
+                    };
+                    break;
+                case 'name_down':
+                    libs.comparator = function(a, b) {
+                        var result = _this.compareTwoWord(a.get('name'), b.get('name'));
+                        return -result;
+                    };
+                    break;
+                case 'time_up':
+                    libs.comparator = function(a, b) {
+                        return a.get('mtime') < b.get('mtime') ? -1 : 1;
+                    };
+                    break;
+                case 'time_down':
+                    libs.comparator = function(a, b) {
+                        return a.get('mtime') < b.get('mtime') ? 1 : -1;
+                    };
+                    break;
+            }
+            libs.sort();
         },
 
         fileSizeFormat: function(bytes, precision) {