AJAX-LARAVELを使用してデータベースから大量のデータを徐々に表示

Question

laravelを使用してデータベース（100mil ++データ）から大量のデータを取得していますが、データのロードが長すぎるため、私はAJAXを使用してコントローラを呼び出すことで徐々にLaravelビューにデータを追加し、コントローラはLIMITでクエリを使用してデータを取得するため、制限されたデータに従ってビューが徐々に表示されるため、タイムアウトは発生しません

コントローラ：

public function index(){ 
    return view('users.index',compact('users')); 
} 

public function loadAjax(){ 
    // print_r('expression'); 
    $counter = Input::get('counter'); 
    $users = User::take(1)->skip($counter)->get(); 
    return json_encode($users); 
} 

jQueryとAJAX：

の

<script> 
    var ctr = 0; 
    window.onload = function() { 
    getData(); 
    }; 

    window.setInterval(function() { 
    ctr++; //increase the data offset 
    getData(); 
    }, 1000); 

function getData() { 
     jQuery(document).ready(function() { 
      jQuery.ajax({ 
       url: "users/ajax", 
       type: 'GET', 
       data: {counter : ctr}, 
       dataType: "json", 
       success: function(data) { 
        console.log(data.users); 
        for(var i =0; i < data.users.length; i++) { 
         var htm = ''; 
         htm += '<tr id="inside">' 
         htm += '<td>'+data.users[i].id+'</td>'; 
         htm += '<td>'+data.users[i].name+'</td>'; 
         htm += '<td>'+data.users[i].email+'</td>'; 
         htm += '</tr>' 
         $("#inside").append(htm); 
        } 
       }, 
       error: function(data) { 
       } 
      }); 
     }); 
    } 
</script> 

路線：

Route::get('users/ajax','UserController@loadAjax'); 

問題は、私はAjaxで新たなんだと、私の方法は、正しい方法

Answer 1

であれば、あなたが記述しているページネーションパターンは無限スクロールと呼ばれているIDKのです。最初のxレコードがページにロードされ、その後のAJAX呼び出しでさらにデータが要求され、ビューのリストに追加されます。 Infinite Scrollの実装に関する詳細はLaracastです。無限のスクロール要求は、スクロールが底に達したときにonScrollイベントからトリガされます。あるいは、ボタンを使用して次の要求をトリガーすることができます。

クライアントのメモリの制限のため、ブラウザに記録されているすべてのレコードを表示することはできません。一般に、何百万ものオブジェクトがDOMではうまく機能しません。その結果、大きなデータセットはInfinite Scrollには適していません。私は強く古いページネーションを強くお勧めします。

大きなデータセットでうまく動作するAJAXを備えた、すぐに使用できるページ区切りツールキットは、jQuery Datatablesです。がんばろう。