Gestion du cache dans Puppeteer : désactivation, effacement et optimisation des performances

Je veux plus vite Marionnettiste automatisation? La gestion du cache du navigateur est essentielle. Ce guide explique comment désactiver, vider et optimiser le cache pour de meilleures performances.

Principaux plats à emporter:

• Désactivation du cache: Utilisation setCacheEnabled(false) ou des indicateurs de lancement de navigateur comme --disable-cache pour simuler de nouveaux chargements de pages.
• Effacer le cache: Utilisation Network.clearBrowserCache via Protocole Chrome DevTools (CDP) pour des environnements de test propres.
• mise en cache intelligente:Réduisez le transfert de données jusqu'à 92 % grâce à une logique de mise en cache personnalisée et au stockage en mémoire.
• Augmentation des performances:Bloquez les ressources inutiles comme les images ou les publicités pour accélérer les tests et économiser la bande passante.

Une gestion efficace du cache peut réduire considérablement l'utilisation des données, améliorer la précision des tests et accélérer les workflows d'automatisation. Découvrez comment !

Marionnettiste Tutoriel n° 4 | Lancer le navigateur avec les options

Désactiver le cache dans Puppeteer

Désactiver le cache dans Puppeteer peut s'avérer utile pour les tâches de test et d'automatisation nécessitant de nouveaux chargements de pages. Voici comment procéder et ce qu'il faut retenir.

Le setCacheEnabled() Méthode

Vous pouvez désactiver la mise en cache dans Puppeteer avec le setCacheEnabled() méthode:

await page.setCacheEnabled(false);

Exécutez cette commande avant d'accéder à une page. Par défaut, la mise en cache est activée ; vous devez donc la désactiver lorsque vos tests nécessitent une charge de ressources propre. Pour une solution plus adaptée à l'ensemble du navigateur, consultez la section suivante.

Indicateurs de lancement du navigateur pour le cache

Pour désactiver la mise en cache au niveau du navigateur, lancez Chromium avec des drapeaux spécifiques :

const browser = await puppeteer.launch({
    args: ['--disable-cache']
});

Cette méthode fonctionne bien lorsque vous devez contrôler la mise en cache pour l'ensemble de la session du navigateur, en complément de la setCacheEnabled() approche.

Que se passe-t-il lorsque vous désactivez le cache ?

Lorsque le cache est désactivé, chaque ressource est téléchargée à nouveau, ce qui peut ralentir le processus et augmenter la consommation de données. Par exemple, les tests sur CNNLe site web de a montré une augmentation de 88 % du transfert de données lorsque la mise en cache était désactivée. Pour trouver le juste équilibre entre précision et performances, suivez ces conseils :

• Utilisez Chrome DevTools pour vérifier si le contenu de la page peut être mis en cache.
• Ajoutez la mise en cache en mémoire pour des ressources spécifiques, le cas échéant.
• Désactivez le cache uniquement lorsque votre scénario de test l'exige.
• Gardez un œil sur la fiabilité du réseau lorsque le cache est désactivé.

La désactivation du cache est idéale pour simuler le comportement d'un utilisateur novice, mais évaluez les compromis en fonction de vos objectifs de test.

Suppression des données du cache dans Puppeteer

Les tests automatisés nécessitent souvent un cache vidé pour maintenir des résultats cohérents.

Vider le cache avec setCacheEnabled()

Vous pouvez effacer les données du cache à l'aide des commandes du protocole Chrome DevTools (CDP) :

const client = await page.target().createCDPSession();
await client.send('Network.clearBrowserCache');
await page.setCacheEnabled(false);

Cette approche efface le cache du navigateur et désactive la mise en cache, garantissant ainsi une table rase pour vos tâches d’automatisation.

Vous pouvez également effacer le cache et les cookies simultanément :

const client = await page.target().createCDPSession();
await client.send('Network.clearBrowserCache');
await client.send('Network.clearBrowserCookies');

Gestion de types de stockage spécifiques

Il peut parfois être nécessaire de vider certaines données stockées plutôt que l'intégralité du cache. Voici comment gérer les cookies :

// Clear all cookies
const cookies = await page.cookies();
await page.deleteCookie(...cookies);

// To delete a specific cookie, use:
// await page.deleteCookie({ name: 'cookie_name', url: 'https://example.com' });

// Set cookies to expire
const cookies = await page.cookies();
for (let cookie of cookies) {
    cookie.expires = -1;
}
await page.setCookies(...cookies);

Cela permet un contrôle précis sur la gestion des cookies lors de vos tests.

Gestion du cache dans plusieurs onglets

Lorsque vous travaillez avec plusieurs onglets, il est judicieux d'isoler les données du cache en utilisant des contextes de navigateur distincts. Voici comment :

const browser = await puppeteer.launch();
const context = await browser.createIncognitoBrowserContext();
const page = await context.newPage();

const client = await page.target().createCDPSession();
await client.send('Network.clearBrowserCache');

// Close the context after tasks are done
await context.close();

L'utilisation de contextes séparés empêche les interférences de cache entre les onglets, ce qui le rend idéal pour l'exécution de tests parallèles.

sbb-itb-23997f1

Paramètres de cache pour une meilleure vitesse

La gestion efficace du cache dans Puppeteer peut réduire le transfert de données jusqu'à 92%, rendant l'automatisation beaucoup plus rapide.

Utilisation intelligente du cache

Pour équilibrer vitesse et actualité des données, vous pouvez intercepter les requêtes et les réponses afin de mettre en œuvre une mise en cache plus intelligente. Voici un exemple :

const cache = new Map();

async function handleRequest(request) {
    const url = request.url();
    if (cache.has(url)) {
        const cachedResponse = cache.get(url);
        if (isFresh(cachedResponse)) {
            return request.respond(cachedResponse);
        }
    }

    // Continue the request if it's not cached
    request.continue();
}

async function handleResponse(response) {
    const headers = response.headers();
    if (headers['cache-control'] && headers['cache-control'].includes('max-age')) {
        const responseData = {
            status: response.status(),
            headers: headers,
            body: await response.buffer()
        };
        cache.set(response.url(), responseData);
    }
}

Cette configuration minimise les requêtes réseau inutiles tout en gardant les données essentielles à jour en validant les cache-control en-tête.

Création de règles de cache personnalisées

Adaptez la mise en cache à vos besoins en créant des règles spécifiques. Par exemple :

const customCacheRules = {
    shouldCache: (response) => {
        const headers = response.headers();
        return headers['cache-control'] && 
               headers['cache-control'].includes('max-age') &&
               Number(headers['cache-control'].match(/max-age=(\d+)/)[1]) > 0;
    },

    getExpirationTime: (headers) => {
        const maxAge = headers['cache-control'].match(/max-age=(\d+)/)[1];
        return Date.now() + (parseInt(maxAge) * 1000);
    }
};

Ces règles aident à déterminer quelles réponses mettre en cache et combien de temps les conserver.

Vérification des performances du cache

Une fois vos règles de mise en cache en place, évaluez leur impact à l’aide de mesures de performance :

const metrics = {
    totalRequests: 0,
    cachedResponses: 0,
    dataSaved: 0
};

async function trackCacheMetrics(request, response) {
    metrics.totalRequests++;
    if (response.fromCache()) {
        metrics.cachedResponses++;
        metrics.dataSaved += parseInt(response.headers()['content-length'] || 0);
    }
}

Suivez des indicateurs clés comme le nombre total de requêtes, les réponses mises en cache et les données enregistrées. Voici une comparaison basée sur des tests :

Ces résultats montrent à quel point une mise en cache bien conçue peut améliorer considérablement les performances de Puppeteer.

Problèmes courants et solutions

Résolution des problèmes de cache

Lors de l'utilisation de Puppeteer, l'interception des requêtes désactive la mise en cache native du navigateur. Cela peut entraîner un transfert de données plus important et des temps de chargement des pages plus longs. Pour remédier à ce problème, vous pouvez implémenter une mise en cache personnalisée en suivant la méthode suivante :

const browser = await puppeteer.launch();
const page = await browser.newPage();

// Initialize cache storage
const responseCache = new Map();

await page.setRequestInterception(true);
page.on('request', async request => {
    const url = request.url();
    if (responseCache.has(url)) {
        await request.respond(responseCache.get(url));
        return;
    }
    request.continue();
});

page.on('response', async response => {
    const url = response.url();
    const headers = response.headers();

    if (headers['cache-control'] && headers['cache-control'].includes('max-age')) {
        responseCache.set(url, {
            status: response.status(),
            headers: headers,
            body: await response.buffer()
        });
    }
});

Pour éviter d’éventuelles fuites de mémoire, assurez-vous de nettoyer efficacement les ressources :

async function cleanupResources(page) {
    await page.removeAllListeners();
    const client = await page.target().createCDPSession();
    await client.send('Network.clearBrowserCache');
    await client.detach();
    await page.close();
}

En combinant ces techniques, vous pouvez réduire les frais généraux et améliorer les performances de Puppeteer.

Conseils de gestion du cache

Voici quelques conseils pratiques pour gérer le cache plus efficacement, basés sur des tests et des analyses :

Pour de meilleures performances, vous pouvez bloquer certaines ressources comme les images ou les feuilles de style pour accélérer le chargement des pages :

const browserOptions = {
    userDataDir: './cache-directory',
    args: [
        '--disable-background-timer-throttling',
        '--disable-extensions'
    ]
};

await page.setRequestInterception(true);
page.on('request', request => {
    if (request.resourceType() === 'image' || request.resourceType() === 'stylesheet') {
        request.abort();
    } else {
        request.continue();
    }
});

L’utilisation de ces stratégies peut rationaliser vos flux de travail Puppeteer tout en gardant l’utilisation des ressources sous contrôle.

Conclusion

Une gestion efficace du cache dans Puppeteer peut améliorer considérablement les performances tout en réduisant l'utilisation des ressources. Ce guide explique comment désactiver, vider et ajuster les paramètres du cache pour obtenir de meilleurs résultats. Vous trouverez ci-dessous un résumé concis des principales stratégies et de leurs effets.

Résumé des points

Les tests ont montré à quel point une gestion appropriée du cache peut être efficace, soulignant l’importance de le gérer avec précaution.

Voici un aperçu rapide de certaines stratégies clés et de leurs résultats :

Conseils clés de mise en œuvre

• Optimisation des actifs: Compressez les ressources et optimisez les images pour minimiser les charges utiles HTTP.
• Synchronisation précise: Prenez des captures d'écran exactement lorsque le contenu est prêt, évitant ainsi les retards inutiles.
• Efficacité de la mémoire: Utilisez les opérations de tampon au lieu des écritures dans le système de fichiers pour accélérer le traitement.

Lors de l'optimisation de Puppeteer, n'oubliez pas qu'il existe un nombre limité de façons d'accélérer les performances de démarrage et d'arrêt de Puppeteer. Les gains de vitesse les plus importants proviendront probablement de l'optimisation de votre pages cibles à afficher plus rapidement." - Jon Yongfook, fondateur, Bannerbear

articles similaires

• Installation et configuration de Puppeteer : résolution des problèmes courants de dépendance et de Chromium
• Maîtriser la navigation dans les pages avec Puppeteer : utilisation efficace des options Goto et Navigation
• Automatisation du navigateur avec Puppeteer et JavaScript : mise en œuvre pratique dans Node.js
• Gestion des cookies dans Puppeteer : préservation de session, émulation d'authentification et limitations