If you have a very high number of results, it will be slow to load all data and filter them only in the front.
Can I filter pagination results in the frontend?
I've been using datatables so far so the results were returned to the frontend and then any filtering was done on the data that was fetched and it was quick.
But now I'm looking at a piece of code that looks very not optimized: they used Laravel pagination and every filtering or searching re-calls the backend and it's very slow. (There are many records)
Should I just refactor the code to fetch JSON data and filter on frontend just as datatables would do?
Ty
@vincent15000 thanks. So what is the correct way to do it if I'm not using datatables?
@Ligonsker It depends on how is built your app. Full Laravel ? API + JS frontend ?
Assuming you have an API and a VueJS frontend, I would proceed with classic Laravel pagination and calling the API each time I need to display another part of datas.
@vincent15000 they used full Laravel :/ It's an internal system so they didn't care about UI UX 😂
Using the backend should be best for alot of records. If it's slow, then it's better to optimize the queries or add indexes
@Sinnbeck Alright, I will check perhaps if there are missing indexes. Also, it's eloquent so it's naturally slower than raw SQL / query builder isn't it? Or it can be optimized to perform as fast or close to it?
Assuming that on load of the page the entire data is fetched, how can I add search and filters to it? I haven't found docs for that. What is the flow? Let's say I add the search box and checkboxes, how do I proceed from here?
@sinnbeck @vincent15000 Also, I checked the resources on dev tools, and the page with the table loads 75 MB of resources! Isn't it way too much? Or that's normal for a table with plenty of data and eloquent pagination? Or they did something wrong?
@Ligonsker It begins to be a pretty heavy load. You should only load / query the paginated datas.
@Ligonsker can you perhaps show the code? Eloquent is a bit slower due to it having to build the models, but with pagination you shouldn't really notice. 75 mb sounds like alot. Is it completely rendered in blade or?
@Sinnbeck yes it's with blade (and bootstrap / css files), I will need to look at the code as well, I don't have it now because it's something new at work which I'm working on but not there now
@vincent15000 indeed something is wrong with that code, it's just that someone made a mess there, I'm working on it
it's eloquent so it's naturally slower than raw SQL / query builder isn't it?
No.
Assuming that on load of the page the entire data is fetched, how can I add search and filters to it?
you pass the current search and filters into the database query
@Snapey Good to know, from some reason I thought it was slower when querying on large amounts of data
How do I pass it? Let's say I have a very simple query: User::get(); in the controller.
Now in the search, I want a keyword "test". How do I append it to this query?
OR I will need a different method in the controller especially for filtering and searching?
@Ligonsker example
$search = $request->input('search');
User::when($search, function ($query, $search) {
$query->where('name', 'like', "%$search%");
})->get();
@Sinnbeck thanks! For the testing right now I made a simple User table and also I'm using paginaton so it's slightly different than your code, how would I try to use your code with this:
public function index()
{
return view('user.index', [
'users' => DB::table('users')->paginate(15)
]);
}
My pagination and table work, now I'm trying to get the search to work with the pagination
@Ligonsker why not use eloquent? I promise you won't see any performance difference
public function index(Request $request )
{
$search = $request->input('search');
$users = User::when($search, function ($query, $search) {
$query->where('name', 'like', "%$search%");
})->paginate(15)
->withQueryString();
return view('user.index', [
'users' => $users
];
}
@Sinnbeck Sorry! I actually am using eloquent now, I copied the code before I changed it (I copied the simple example from the docs to make sure it worked then changed to the other part from the docs that uses eloquent)
So don't worry I believe you 😃
So I will need to submit the same page using GET?
@Ligonsker yeah exactly. And have an input named "search"
@Ligonsker added a little fix to my example to help with pagination
@Sinnbeck Yes! the addition of withQueryString() keeps the search value in the request when there are more results than the pagination number.
Thank you!
Please or to participate in this conversation.