Optimizing Bootstrap Admin Panel Load Speed
Performance Enhancement Guide

Learn how to properly configure your lists with the CRUD Generator to avoid long loading times.


Optimize the loading speed of your administration panel

With PHP CRUD Generator, the loading time of your admin panel READ lists should generally be fast and not exceed a few seconds at most. Abnormally long loading times are either due to the configuration of your filters or the number of queries needed to display the data.

In both cases, the solution is simple to implement using the CRUD Generator. Here is how to proceed to reduce your loading time.


1. Record Filters

Operation

Select with all records loaded
Select with all records loaded

When you add a record filter to your READ list, the program sends the SQL query and retrieves all records from the database. It then generates a select field that will include as many options as you have records.

This is perfect for a table that contains a few dozen or even hundreds of records, but if your table contains thousands, it will significantly increase the page loading time.

Solution

In this case, you need to enable Ajax loading when creating your filter from the CRUD generator.
With Ajax loading enabled, the page will load a simple input field attached to an autocomplete plugin. The plugin will fetch the records on demand for auto-completion. This way, you avoid loading heavy and unnecessary data when loading your main page.

Enable Ajax loading for your filter from the generator
Enable Ajax loading for your filter from the generator
Admin filter with Ajax loading enabled
Admin filter with Ajax loading enabled

Note: Filters are interdependent. For example, if a movie list can be filtered by title and language, if you only display the English movies, the title filter will only offer titles of the English films.


2. Queries Sent to the Database

Operation

When you load a list of records from your database, the program performs the following queries:

  • A query to retrieve the total number of records, which allows building the pagination.
  • A query to retrieve the records displayed on the page.
  • A query per filter if you have enabled filters and they are not loaded with Ajax.

If you have enabled external relations, the program will also perform the following queries:

  • A query per record and per relation to retrieve the related records (if you have enabled external relations).

Example

Admin panel count queries
Admin panel count queries

For example, if you have a movie table linked to an actor table and a category table, and you have enabled the display of actor names and categories in the movie list, the program will perform two queries for each movie to retrieve the actor names and categories.
If you display 20 movies per page, you get this:

  1. Pagination: 1 query
  2. Records: 1 query
  3. Non-Ajax filters: 1 query per filter
  4. Actors (external relation): 20 queries
  5. Categories (external relation): 20 queries

Total: 42 queries (+ filters)

Solution

Usually, even if there are a relatively large number of queries, it won't be a problem because these queries only return a limited number of records. They are therefore efficient and fast. If nevertheless, you have excessively long loading times, you can disable the display of certain external relations in the main list and display them on another page. You can also limit the number of records displayed per page.


3. Use MySQL Indexes

Operation

This does not concern PHPCG, but directly the structure of your database. Add an index to each field that will be used regularly in your queries. The MySQL engine is faster and more efficient with indexed fields.

Solution

To index your fields:

  1. Open your database manager (phpMyAdmin or other).
  2. Show the structure of your table.
  3. Check the fields that you want to index.
  4. Click the index button.

PHP CRUD tutorial main page