Browserगाइडअनुकूलन लागत

लागत का अनुकूलन

परिचय

डेटा स्क्रैपिंग के लिए पुपेटियर का उपयोग करते समय, ट्रैफ़िक खपत एक महत्वपूर्ण विचार है। विशेष रूप से प्रॉक्सी सेवाओं का उपयोग करते समय, ट्रैफ़िक लागत में उल्लेखनीय वृद्धि हो सकती है। ट्रैफ़िक उपयोग को अनुकूलित करने के लिए, हम निम्नलिखित रणनीतियों को अपना सकते हैं:

  1. संसाधन अवरोधन: अनावश्यक संसाधन अनुरोधों को रोककर ट्रैफ़िक खपत को कम करें।
  2. अनुरोध URL अवरोधन: URL विशेषताओं के आधार पर विशिष्ट अनुरोधों को रोककर ट्रैफ़िक को और कम करें।
  3. मोबाइल उपकरणों का अनुकरण: हल्के पृष्ठ संस्करण प्राप्त करने के लिए मोबाइल डिवाइस कॉन्फ़िगरेशन का उपयोग करें।
  4. व्यापक अनुकूलन: सर्वोत्तम परिणाम प्राप्त करने के लिए उपरोक्त विधियों को मिलाएँ।

अनुकूलन योजना 1: संसाधन अवरोधन

संसाधन अवरोधन परिचय

पुपेटियर में, page.setRequestInterception(true) ब्राउज़र द्वारा शुरू किए गए प्रत्येक नेटवर्क अनुरोध को कैप्चर कर सकता है और जारी रखने (request.continue()), समाप्त करने (request.abort()), या प्रतिक्रिया को अनुकूलित करने (request.respond()) का निर्णय ले सकता है।

यह विधि बैंडविड्थ खपत को काफी कम कर सकती है, विशेष रूप से क्रॉलिंग, स्क्रीनशॉटिंग और प्रदर्शन अनुकूलन परिदृश्यों के लिए उपयुक्त है।

अवरोध्य संसाधन प्रकार और सुझाव

संसाधन प्रकारविवरणउदाहरणअवरोधन के बाद प्रभावअनुशंसा
imageछवि संसाधनJPG/PNG/GIF/WebP छवियाँछवियाँ प्रदर्शित नहीं होंगी⭐ सुरक्षित
fontफ़ॉन्ट फ़ाइलेंTTF/WOFF/WOFF2 फ़ॉन्ट्ससिस्टम डिफ़ॉल्ट फ़ॉन्ट्स का उपयोग किया जाएगा⭐ सुरक्षित
mediaमीडिया फ़ाइलेंवीडियो/ऑडियो फ़ाइलेंमीडिया सामग्री नहीं चलाई जा सकती⭐ सुरक्षित
manifestवेब ऐप मैनिफेस्टPWA कॉन्फ़िगरेशन फ़ाइलPWA कार्यक्षमता प्रभावित हो सकती है⭐ सुरक्षित
prefetchप्रीफ़ेच संसाधन<link rel="prefetch">पृष्ठ पर न्यूनतम प्रभाव⭐ सुरक्षित
stylesheetCSS स्टाइलशीटबाहरी CSS फ़ाइलेंपृष्ठ शैलियाँ खो जाती हैं, लेआउट को प्रभावित कर सकती हैं⚠️ सावधानी
websocketवेबसॉकेटवास्तविक समय संचार कनेक्शनवास्तविक समय कार्यक्षमता अक्षम⚠️ सावधानी
eventsourceसर्वर-सेंट ईवेंट्ससर्वर पुश डेटापुश कार्यक्षमता अक्षम⚠️ सावधानी
preflightCORS प्रीफ़्लाइट अनुरोधOPTIONS अनुरोधक्रॉस-ओरिजिन अनुरोध विफल⚠️ सावधानी
scriptजावास्क्रिप्ट स्क्रिप्ट्सबाहरी JS फ़ाइलेंगतिशील कार्यक्षमता अक्षम, SPA रेंडर नहीं हो सकता है❌ बचें
xhrXHR अनुरोधAJAX डेटा अनुरोधगतिशील डेटा प्राप्त करने में असमर्थ❌ बचें
fetchफ़ेच अनुरोधआधुनिक AJAX अनुरोधगतिशील डेटा प्राप्त करने में असमर्थ❌ बचें
documentमुख्य दस्तावेज़HTML पृष्ठ स्वयंपृष्ठ लोड नहीं हो सकता❌ बचें

अनुशंसा स्तर स्पष्टीकरण:

  • सुरक्षित: अवरोधन का डेटा स्क्रैपिंग या पहले स्क्रीन रेंडरिंग पर लगभग कोई प्रभाव नहीं पड़ता है; इसे डिफ़ॉल्ट रूप से ब्लॉक करने की अनुशंसा की जाती है।
  • ⚠️ सावधानी: शैलियों, वास्तविक समय कार्यों या क्रॉस-ओरिजिन अनुरोधों को तोड़ सकता है; व्यावसायिक निर्णय की आवश्यकता है।
  • बचें: SPA/गतिशील साइटों के सामान्य रूप से रेंडर करने या डेटा प्राप्त करने में विफल होने की उच्च संभावना, जब तक कि आपको पूरा यकीन न हो कि आपको इन संसाधनों की आवश्यकता नहीं है।

संसाधन अवरोधन उदाहरण कोड

import { Scrapeless } from '@scrapeless-ai/sdk';
import puppeteer from 'puppeteer-core';
 
const client = new Scrapeless({ apiKey: 'API Key' });
 
const { browserWSEndpoint } = client.browser.create({
    session_name: 'sdk_test',
    session_ttl: 180,
    proxy_country: 'ANY',
    session_recording: true,
    fingerprint,
});
 
async function scrapeWithResourceBlocking(url) {
    const browser = await puppeteer.connect({
        browserWSEndpoint,
        defaultViewport: null
    });
    const page = await browser.newPage();
 
    // Enable request interception
    await page.setRequestInterception(true);
 
    // Define resource types to block
    const BLOCKED_TYPES = new Set([
        'image',
        'font',
        'media',
        'stylesheet',
    ]);
 
    // Intercept requests
    page.on('request', (request) => {
        if (BLOCKED_TYPES.has(request.resourceType())) {
            request.abort();
            console.log(`Blocked: ${request.resourceType()} - ${request.url().substring(0, 50)}...`);
        } else {
            request.continue();
        }
    });
 
    await page.goto(url, {waitUntil: 'domcontentloaded'});
 
    // Extract data
    const data = await page.evaluate(() => {
        return {
            title: document.title,
            content: document.body.innerText.substring(0, 1000)
        };
    });
 
    await browser.close();
    return data;
}
 
// Usage
scrapeWithResourceBlocking('https://www.scrapeless.com')
    .then(data => console.log('Scraping result:', data))
    .catch(error => console.error('Scraping failed:', error));

अनुकूलन योजना 2: अनुरोध URL अवरोधन

संसाधन प्रकार द्वारा अवरोधन के अलावा, URL विशेषताओं के आधार पर अधिक सूक्ष्म अवरोधन नियंत्रण किया जा सकता है। यह विज्ञापनों, विश्लेषणात्मक स्क्रिप्ट और अन्य अनावश्यक तृतीय-पक्ष अनुरोधों को अवरुद्ध करने के लिए विशेष रूप से प्रभावी है।

URL अवरोधन रणनीतियाँ

  1. डोमेन द्वारा अवरोधन: किसी विशिष्ट डोमेन से सभी अनुरोधों को ब्लॉक करें
  2. पथ द्वारा अवरोधन: किसी विशिष्ट पथ से अनुरोधों को ब्लॉक करें
  3. फ़ाइल प्रकार द्वारा अवरोधन: विशिष्ट एक्सटेंशन वाली फ़ाइलों को ब्लॉक करें
  4. कीवर्ड द्वारा अवरोधन: ऐसे अनुरोधों को ब्लॉक करें जिनके URL में विशिष्ट कीवर्ड हों

सामान्य अवरोध्य URL पैटर्न

URL पैटर्नविवरणउदाहरणअनुशंसा
विज्ञापन सेवाएँविज्ञापन नेटवर्क डोमेनad.doubleclick.net, googleadservices.com⭐ सुरक्षित
विश्लेषणात्मक सेवाएँसांख्यिकी और विश्लेषणात्मक स्क्रिप्टgoogle-analytics.com, hotjar.com⭐ सुरक्षित
सोशल मीडिया प्लगइन्ससोशल शेयरिंग बटन, आदिplatform.twitter.com, connect.facebook.net⭐ सुरक्षित
ट्रैकिंग पिक्सेलपिक्सेल जो उपयोगकर्ता व्यवहार को ट्रैक करते हैंURL जिसमें pixel, beacon, tracker शामिल हैं⭐ सुरक्षित
बड़ी मीडिया फ़ाइलेंबड़ी वीडियो, ऑडियो फ़ाइलें.mp4, .webm, .mp3 जैसे एक्सटेंशन⭐ सुरक्षित
फ़ॉन्ट सेवाएँऑनलाइन फ़ॉन्ट सेवाएँfonts.googleapis.com, use.typekit.net⭐ सुरक्षित
CDN संसाधनस्थिर संसाधन CDNcdn.jsdelivr.net, unpkg.com⚠️ सावधानी

URL अवरोधन उदाहरण कोड

import puppeteer from 'puppeteer-core';
import { Scrapeless } from '@scrapeless-ai/sdk';
import puppeteer from 'puppeteer-core';
 
const client = new Scrapeless({ apiKey: 'API Key' });
 
const { browserWSEndpoint } = client.browser.create({
    session_name: 'sdk_test',
    session_ttl: 180,
    proxy_country: 'ANY',
    session_recording: true,
    fingerprint,
});
 
async function scrapeWithUrlBlocking(url) {
    const browser = await puppeteer.connect({
        browserWSEndpoint,
        defaultViewport: null
    });
    const page = await browser.newPage();
 
    // Enable request interception
    await page.setRequestInterception(true);
 
    // Define domains and URL patterns to block
    const BLOCKED_DOMAINS = [
        'google-analytics.com',
        'googletagmanager.com',
        'doubleclick.net',
        'facebook.net',
        'twitter.com',
        'linkedin.com',
        'adservice.google.com',
    ];
 
    const BLOCKED_PATHS = [
        '/ads/',
        '/analytics/',
        '/pixel/',
        '/tracking/',
        '/stats/',
    ];
 
    // Intercept requests
    page.on('request', (request) => {
        const url = request.url();
 
        // Check domain
        if (BLOCKED_DOMAINS.some(domain => url.includes(domain))) {
            request.abort();
            console.log(`Blocked domain: ${url.substring(0, 50)}...`);
            return;
        }
 
        // Check path
        if (BLOCKED_PATHS.some(path => url.includes(path))) {
            request.abort();
            console.log(`Blocked path: ${url.substring(0, 50)}...`);
            return;
        }
 
        // Allow other requests
        request.continue();
    });
 
    await page.goto(url, {waitUntil: 'domcontentloaded'});
 
    // Extract data
    const data = await page.evaluate(() => {
        return {
            title: document.title,
            content: document.body.innerText.substring(0, 1000)
        };
    });
 
    await browser.close();
    return data;
}
 
// Usage
scrapeWithUrlBlocking('https://www.scrapeless.com')
    .then(data => console.log('Scraping result:', data))
    .catch(error => console.error('Scraping failed:', error));

अनुकूलन योजना 3: मोबाइल उपकरणों का अनुकरण

मोबाइल उपकरणों का अनुकरण एक और प्रभावी ट्रैफ़िक अनुकूलन रणनीति है क्योंकि मोबाइल वेबसाइटें आमतौर पर हल्की पृष्ठ सामग्री प्रदान करती हैं।

मोबाइल डिवाइस सिमुलेशन के लाभ

  1. हल्के पृष्ठ संस्करण: कई वेबसाइटें मोबाइल उपकरणों के लिए अधिक संक्षिप्त सामग्री प्रदान करती हैं
  2. छोटे छवि संसाधन: मोबाइल संस्करण आमतौर पर छोटी छवियाँ लोड करते हैं
  3. सरलीकृत CSS और जावास्क्रिप्ट: मोबाइल संस्करण आमतौर पर सरलीकृत शैलियों और स्क्रिप्ट का उपयोग करते हैं
  4. कम विज्ञापन और गैर-कोर सामग्री: मोबाइल संस्करण अक्सर कुछ गैर-कोर कार्यक्षमता को हटा देते हैं
  5. अनुकूली प्रतिक्रिया: छोटी स्क्रीन के लिए अनुकूलित सामग्री लेआउट प्राप्त करें

मोबाइल डिवाइस सिमुलेशन कॉन्फ़िगरेशन

यहाँ कई सामान्यतः उपयोग किए जाने वाले मोबाइल उपकरणों के लिए कॉन्फ़िगरेशन पैरामीटर दिए गए हैं:

const iPhoneX = {
    viewport: {
        width: 375,
        height: 812,
        deviceScaleFactor: 3,
        isMobile: true,
        hasTouch: true,
        isLandscape: false
    }
};

या सीधे पुपेटियर के अंतर्निहित तरीकों का उपयोग करके मोबाइल उपकरणों का अनुकरण करें

import { KnownDevices } from 'puppeteer-core';
const iPhone = KnownDevices['iPhone 15 Pro'];
 
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.emulate(iPhone);

मोबाइल डिवाइस सिमुलेशन उदाहरण कोड

import puppeteer from 'puppeteer-core';
import { Scrapeless } from '@scrapeless-ai/sdk';
 
const client = new Scrapeless({ apiKey: 'API Key' });
 
const { browserWSEndpoint } = client.browser.create({
    session_name: 'sdk_test',
    session_ttl: 180,
    proxy_country: 'ANY',
    session_recording: true,
    fingerprint,
});
 
async function scrapeWithMobileEmulation(url) {
    const browser = await puppeteer.connect({
        browserWSEndpoint,
        defaultViewport: null
    });
 
    const page = await browser.newPage();
 
    // Set mobile device simulation
    const iPhone = KnownDevices['iPhone 15 Pro'];
    await page.emulate(iPhone);
 
    await page.goto(url, {waitUntil: 'domcontentloaded'});
    // Extract data
    const data = await page.evaluate(() => {
        return {
            title: document.title,
            content: document.body.innerText.substring(0, 1000)
        };
    });
 
    await browser.close();
    return data;
}
 
// Usage
scrapeWithMobileEmulation('https://www.scrapeless.com')
    .then(data => console.log('Scraping result:', data))
    .catch(error => console.error('Scraping failed:', error));

व्यापक अनुकूलन उदाहरण

यहाँ सभी अनुकूलन योजनाओं को मिलाने वाला एक व्यापक उदाहरण दिया गया है:

import puppeteer, {KnownDevices} from 'puppeteer-core';
import { Scrapeless } from '@scrapeless-ai/sdk';
 
const client = new Scrapeless({ apiKey: 'API Key' });
 
const { browserWSEndpoint } = client.browser.create({
    session_name: 'sdk_test',
    session_ttl: 180,
    proxy_country: 'ANY',
    session_recording: true,
    fingerprint,
});
 
async function optimizedScraping(url) {
    console.log(`Starting optimized scraping: ${url}`);
 
    // Record traffic usage
    let totalBytesUsed = 0;
 
    const browser = await puppeteer.connect({
        browserWSEndpoint,
        defaultViewport: null
    });
 
    const page = await browser.newPage();
 
    // Set mobile device simulation
    const iPhone = KnownDevices['iPhone 15 Pro'];
    await page.emulate(iPhone);
 
    // Set request interception
    await page.setRequestInterception(true);
 
    // Define resource types to block
    const BLOCKED_TYPES = [
        'image',
        'media',
        'font'
    ];
 
    // Define domains to block
    const BLOCKED_DOMAINS = [
        'google-analytics.com',
        'googletagmanager.com',
        'facebook.net',
        'doubleclick.net',
        'adservice.google.com'
    ];
 
    // Define URL paths to block
    const BLOCKED_PATHS = [
        '/ads/',
        '/analytics/',
        '/tracking/'
    ];
 
    // Intercept requests
    page.on('request', (request) => {
        const url = request.url();
        const resourceType = request.resourceType();
 
        // Check resource type
        if (BLOCKED_TYPES.includes(resourceType)) {
            console.log(`Blocked resource type: ${resourceType} - ${url.substring(0, 50)}...`);
            request.abort();
            return;
        }
 
        // Check domain
        if (BLOCKED_DOMAINS.some(domain => url.includes(domain))) {
            console.log(`Blocked domain: ${url.substring(0, 50)}...`);
            request.abort();
            return;
        }
 
        // Check path
        if (BLOCKED_PATHS.some(path => url.includes(path))) {
            console.log(`Blocked path: ${url.substring(0, 50)}...`);
            request.abort();
            return;
        }
 
        // Allow other requests
        request.continue();
    });
 
    // Monitor network traffic
    page.on('response', async (response) => {
        const headers = response.headers();
        const contentLength = headers['content-length'] ? parseInt(headers['content-length'], 10) : 0;
        totalBytesUsed += contentLength;
    });
 
    await page.goto(url, {waitUntil: 'domcontentloaded'});
 
    // Simulate scrolling to trigger lazy-loading content
    await page.evaluate(() => {
        window.scrollBy(0, window.innerHeight);
    });
 
    await new Promise(resolve => setTimeout(resolve, 1000))
 
    // Extract data
    const data = await page.evaluate(() => {
        return {
            title: document.title,
            content: document.body.innerText.substring(0, 1000),
            links: Array.from(document.querySelectorAll('a')).slice(0, 10).map(a => ({
                text: a.innerText,
                href: a.href
            }))
        };
    });
 
    // Output traffic usage statistics
    console.log(`\nTraffic Usage Statistics:`);
    console.log(`Used: ${(totalBytesUsed / 1024 / 1024).toFixed(2)} MB`);
 
    await browser.close();
    return data;
}
 
// Usage
optimizedScraping('https://www.scrapeless.com')
    .then(data => console.log('Scraping complete:', data))
    .catch(error => console.error('Scraping failed:', error));

अनुकूलन तुलना

हम अनुकूलन से पहले और बाद में ट्रैफ़िक की तुलना करने के लिए व्यापक उदाहरण से अनुकूलित कोड को हटाने का प्रयास करते हैं। यहाँ बिना अनुकूलित उदाहरण कोड दिया गया है:

import puppeteer from 'puppeteer-core';
import { Scrapeless } from '@scrapeless-ai/sdk';
 
const client = new Scrapeless({ apiKey: 'API Key' });
 
const { browserWSEndpoint } = client.browser.create({
    session_name: 'sdk_test',
    session_ttl: 180,
    proxy_country: 'ANY',
    session_recording: true,
    fingerprint,
});
 
async function unoptimizedScraping(url) {
  console.log(`Starting unoptimized scraping: ${url}`);
 
  // Record traffic usage
  let totalBytesUsed = 0;
 
  const browser = await puppeteer.connect({
    browserWSEndpoint,
    defaultViewport: null
  });
 
  const page = await browser.newPage();
 
  // Set request interception
  await page.setRequestInterception(true);
 
  // Intercept requests
  page.on('request', (request) => {
    request.continue();
  });
 
  // Monitor network traffic
  page.on('response', async (response) => {
    const headers = response.headers();
    const contentLength = headers['content-length'] ? parseInt(headers['content-length'], 10) : 0;
    totalBytesUsed += contentLength;
  });
 
  await page.goto(url, {waitUntil: 'domcontentloaded'});
 
  // Simulate scrolling to trigger lazy-loading content
  await page.evaluate(() => {
    window.scrollBy(0, window.innerHeight);
  });
 
  await new Promise(resolve => setTimeout(resolve, 1000))
 
  // Extract data
  const data = await page.evaluate(() => {
    return {
      title: document.title,
      content: document.body.innerText.substring(0, 1000),
      links: Array.from(document.querySelectorAll('a')).slice(0, 10).map(a => ({
        text: a.innerText,
        href: a.href
      }))
    };
  });
 
  // Output traffic usage statistics
  console.log(`\nTraffic Usage Statistics:`);
  console.log(`Used: ${(totalBytesUsed / 1024 / 1024).toFixed(2)} MB`);
 
  await browser.close();
  return data;
}
 
// Usage
unoptimizedScraping('https://www.scrapeless.com')
  .then(data => console.log('Scraping complete:', data))
  .catch(error => console.error('Scraping failed:', error));

अनुकूलित कोड को चलाने के बाद, हम मुद्रित जानकारी से यातायात अंतर को बहुत सहज रूप से देख सकते हैं:

परिदृश्यप्रयुक्त ट्रैफ़िक (MB)बचत अनुपात
अनुकूलित नहीं6.03
अनुकूलित0.81≈ 86.6 %

ऊपर दी गई अनुकूलन योजनाओं को मिलाकर, प्रॉक्सी ट्रैफ़िक की खपत को काफी कम किया जा सकता है, स्क्रैपिंग दक्षता में सुधार किया जा सकता है, और यह सुनिश्चित किया जा सकता है कि आवश्यक मुख्य सामग्री प्राप्त हो।