Laravel 5.4和Datatables插件：加载缓慢

Question

我正在使用laravel 5.4和datatables插件。我正在使用分页，排序和在管理面板视图中进行搜索的数据表。但是该插件的表记录为7000条，速度非常慢。

在控制器中，我试图显示它们的记录：dd($data['noticias']);这很快，但是在具有数据表的视图中则需要几分钟！

我已经看到了一些答案，但是它们不适合我在做什么，他们使用Ajax，而我对ajax一无所知。如何解决缓慢的负载？谢谢。

控制器：

public function index()
{
    $data['noticias'] = Noticia::with('langs')->get();
    $data['sections']  = Section::all();
    $data['positions']  = Position::all();

    return view('panel.noticias.index', compact('data'));
}

视图：

<table id="listados" class="table table-striped" data-order='[[ 0, "desc" ]]' data-page-length='25'>

<thead>
    <tr>
        <th width="96">Fecha</th>
        <th data-orderable='false' width="60">Hora</th>
        <th>Título</th>
        <th style="min-width:100px">Sección</th>
        <th data-orderable='false' width="60">Fotos</th>
        <th align="center" width="60">Ancla</th>
        <th data-orderable='false' align="right" width="180">Acciones</th>
    </tr>
</thead>

@foreach($data['noticias'] as $new)
    <tr>

        <td>{!! date('Y-m-d', strtotime($new->date)) !!}</td>
        <td>{!! date('H:i', strtotime($new->time)) !!}</td>

        <td>
            @foreach($new->langs as $new_lang)
                @include('panel.partials.list_name', ['value' => $new_lang, 'route' => 'noticias.edit', 'id' => $new->id, 'name' => $new_lang->title])
            @endforeach
        </td>

        <td>
             @foreach($data['sections'] as $section)
                @if($section->id == $new->section_id)
                    {!! $section->name !!}
                @endif
             @endforeach
        </td>

        <td align="center">
            {!! (count($new->images) == 0) ? '' : count($new->images) !!}
        </td>

        <td align="center">
            @foreach($data['positions'] as $position)
                @if($position->id == "1")
                    <span class="position">
                    {!! ($position->pos1 == $new->id) ? '[ 1 ]' : ''  !!}
                    {!! ($position->pos2 == $new->id) ? '[ 2 ]' : ''  !!}
                    {!! ($position->pos3 == $new->id) ? '[ 3 ]' : ''  !!}
                    {!! ($position->pos4 == $new->id) ? '[ 4 ]' : ''  !!}
                    {!! ($position->pos5 == $new->id) ? '[ 5 ]' : ''  !!}
                    </span>
                @endif
            @endforeach
        </td>

        <td align="right">
            <a href="{{ route('noticias.update-active', $new->id) }}"> @include('panel.partials.list_active', ['value' => $new->active]) </a>
            @include('panel.partials.list_edit', ['route' => 'noticias.edit', 'id' =>$new->id])
            @include('panel.partials.list_image', ['route' => 'noticias.dropzone', 'id' =>$new->id])
            @include('panel.partials.list_show', ['route' => 'noticia', 'id' =>$new->id, 'slug' =>$new_lang->slug])
            @include('panel.partials.list_delete', ['route' => 'noticias.delete', 'id' =>$new->id])
        </td>
    </tr>

@endforeach

剧本：

$(document).ready(function(){
$('#listados').DataTable({

    "pageLength": 25,
    "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "Todos"]],

    "language": {
        "paginate":
            {
                "previous": "?",
                "next": "?"
            },
        "search": "Buscar:",
        "decimal": ",",
        "thousands": ".",
        "lengthMenu": "Mostrar:  _MENU_",
        "zeroRecords": "No se ha encontrado nada",
        "info": "[ _START_ - _END_ de <strong>_TOTAL_</strong> ]",
        "infoEmpty": "No hay registros",
        "infoFiltered": "<i>— filtrados de _MAX_</i>"
    }
});
});

我包括了CDN：

{!! HTML::style('https://cdn.datatables.net/v/bs/dt-1.10.16/datatables.min.css') !!}

{!! HTML::script('https://cdn.datatables.net/v/bs/dt-1.10.16/datatables.min.js') !!}
{!! HTML::script('https://cdn.datatables.net/1.10.15/js/dataTables.bootstrap.min.js') !!}

Answer 1

只是因为它不是服务器端分页，所以速度很慢。发生的事情是您获得了所有7000条记录，然后jquery插件将更改dom以与客户端分页一起使用。我建议使用的是这个https://github.com/yajra/laravel-datatables。

该插件是用于数据表的laravel包装器，它将与服务器端分页一起使用。因此，当您更改页面时，它将向您的应用程序上的端点发送一个新的ajax请求，以获取该特定页面数据，因此将仅在数据库中查询几行而不是所有行。

变形金刚

https://github.com/spatie/laravel-fractal，它需要一个collection或collectionItem并更改数据，因此，如果您只需要很少的响应就需要以某种方式更改模型，则可以执行此操作。

现实世界中的快速示例是，如果要发送用户实例，则可以使用转换器在响应中发送用户名和电子邮件，而无需在用户模型等中使用密码和ID或其他字段。

Datatables插件转换器链接：http: //yajrabox.com/docs/laravel-datatables/master/response-fractal