recherche axios trop lente

edouardos67
PHP Symfony

Bonjour.
Première utilisation de ce forum... Ne m'en veuillez pas si je ne m'exprime pas comme il faut...

J'ai un problème avec un champ de recherche géré avec axios. Dans mon js, je fais appel à une API interne avec
"axios.get(apiPath,{
params: { 'value': value },
cancelToken: source.token
}).then((response)=>{
.....
})
.catch((error)=>{
if(error&&axios.isCancel()){
return;
}
});
"
Dans mon controlleur Symfony, je récupère 'value' qui correspond à la saisie utilisateur dans la barre de recherche et je vais récupérer des objets dans un repository qui interroge une table avec plus de 56000 éléments.

Je gère les évènements "keyup" ou "paste" dans mon champ de recherche...

Mon pb est le suivant : quand je colle une chaine de plusieurs caractères, la recherche est relativement rapide mais dès que j'entre des lettres successivement, ma recherche précédente est bien annulée (grâce au "CancelToken") mais la recherche dure au moins 3-4 fois plus longtemps sur la dernière lettre de la chaîne.... J'en déduis que mes anciennes recherches sont bien annulées côté JS mais pas côté PHP...

Quelqu'un peut-il m'aider ? Merci.

3 réponses

quenti77

Hello,

Plutôt que d'annuler et de relancer pour chaque frappe de touche il faut côté JS passer par du throttle. Cela permet d'exécuter du code à interval régulier pendant la saisie mais dont l'écart est assez haute pour éviter de lancer 10 requête /s.

Voici un lien d'un article qui montre le debounce et throttle : Debounce et throttle : limiter les appels successifs à une fonction Javascript

edouardos67
Auteur

Merci pour l'info mais j'avais déja tenté mon propre debounce et je pensais qu'une solution avec cancelToken serait plus efficace... mais non visiblement.... J'ai du mal à comprendre pourquoi une requête après annulation de requêtes précédentes met 4 fois plus de temps qu'une requête unique (en cas de "paste")... Une explication sur ce phénomène ?

quenti77

En fait le soucis vient du fait que php une fois le process lancé, il continu jusqu'a ce que le code soit exécuté entièrement.

De base PHP peut lancer entre 3 et 5 processus en parallèle. Si tu effectues 6 appuies de touche ça va lancer 6 requêtes HTTP à ton php et du coup il va faire les 5 premières en parallèle mais la 6ième sera en attente. Et ça c'est seulement pour 1 utilisateur de ton site. Si 10 personnes effectuent 5 pressions de touches (qui envoie une requête à chaque fois) cela fait 50 requête à ton serveur PHP.