100+ column with 10 rows rendering performance is very worst

if i have 1000+ rows with 10 to 30 columns it works fine but if i have 10 rows with 200+ columns it rendering after 2 to 3 minute. some time while horizontal scrolling the data is not visible. some time page become unresponsive.

any one have solution please share to me

the code is here $http.post($scope.url + "/getPagingRecordImportedTable", { 'dbname': $stateParams.dbname, 'tableName': tablename, 'pageNumber': 1 }).success( function (response) {

                                    $scope.names = response.records;
                                    $scope.mdata = response.metadata;

                                    $scope.gridOptions.data = response.records;
                                    var columnsize = 0;
                                    for (var obj in $scope.mdata) {
                                       if ($scope.mdata[obj]['columnsize'] > 20) {
                                            columnsize = 20;
                                        } else {
                                            columnsize = $scope.mdata[obj]['columnsize'];
                                        }
                                        $scope.columns.push({
                                            field: $scope.mdata[obj]['columnname'],
                                            width: columnsize

                                       });
                                   }

                                    console.log("-----------Data received");
                                }).

after firing http request immediately "-------------Data received" log printed.but rendering data it takes too much time.