proxy caching
Pour les opérations répétées, peuvent être utilisés sous la forme de la mise en cache des caches proxy (mode proxy de la connaissance, je peux voir un autre article design patterns - mode proxy ), la requête de recherche de personnes, pour la même page, nous ne voulons pas répéter la demande, après tout ajax est la performance de la consommation, cette fois -ci, nous pouvons utiliser la mise en cache objet proxy, quand il y a une utilisation de cache en cache obtenir directement, sinon présent lorsque le dossier de demande ajax à l'objet.
l'optimisation des requêtes de recherche de personnes
cache proxy d'application des raisons de ajax ajax asynchrone, il utilisera la fonction de rappel ou Promise, sont l'encapsulation suivante de la demande, le module de demandeaxios
function getArticle(currentPage,pageSize){
return Http.mGet('/getArticle',{currentPage,pageSize}).then(e=>Promise.resolve(e.data));
}
export const proxyGetArticle = (function(){
const caches = {};
return async function(currentPage,pageSize){
const cache = Array.prototype.join.call(arguments,',');
// console.log(caches)
if(cache in caches){
return caches[cache];
}
await
getArticle(currentPage,pageSize).then(res=>{
Promise.resolve(caches[cache] = res)
})
// await
return caches[cache];
}
})()
En raison de la boucle d'événements, 调用时多次调用需要使用await
suivant la react-hook
demande
useEffect(() => {
async function fetchData(){
const List = await proxyGetArticle(currentPage,pageSize)
updateBlogList(data);
}
fetchData()
}, [currentPage]);