लागत का अनुकूलन
परिचय
जब आप डेटा स्क्रैपिंग के लिए Puppeteer का उपयोग करते हैं, तो ट्रैफ़िक की खपत एक महत्वपूर्ण विचार है। विशेष रूप से जब प्रॉक्सी सेवाओं का उपयोग किया जाता है, तो ट्रैफ़िक लागत काफी बढ़ सकती है। ट्रैफ़िक उपयोग को अनुकूलित करने के लिए, हम निम्नलिखित रणनीतियाँ अपना सकते हैं:
- संसाधन इंटरसेप्शन: अनावश्यक संसाधन अनुरोधों को इंटरसेप्ट करके ट्रैफ़िक की खपत कम करें।
- अनुरोध URL इंटरसेप्शन: URL विशेषताओं के आधार पर विशिष्ट अनुरोधों को इंटरसेप्ट करके ट्रैफ़िक को और कम करें।
- मोबाइल उपकरणों का अनुकरण: हल्के पृष्ठ संस्करण प्राप्त करने के लिए मोबाइल उपकरण कॉन्फ़िगरेशन का उपयोग करें।
- व्यापक अनुकूलन: सर्वोत्तम परिणाम प्राप्त करने के लिए उपरोक्त तरीकों को संयोजित करें।
अनुकूलन योजना 1: संसाधन इंटरसेप्शन
संसाधन इंटरसेप्शन का परिचय
Puppeteer में, page.setRequestInterception(true) ब्राउज़र द्वारा आरंभ किए गए प्रत्येक नेटवर्क अनुरोध को कैप्चर कर सकता है और जारी रखने (request.continue()), समाप्त करने (request.abort()), या प्रतिक्रिया को अनुकूलित करने (request.respond()) का निर्णय ले सकता है।
यह विधि बैंडविड्थ खपत को काफी कम कर सकती है, विशेष रूप से क्रॉलिंग, स्क्रीनशॉटिंग, और प्रदर्शन अनुकूलन परिदृश्यों के लिए उपयुक्त है।
इंटरसेप्ट किए जा सकने वाले संसाधन प्रकार और सुझाव
| संसाधन प्रकार | विवरण | उदाहरण | इंटरसेप्शन के बाद प्रभाव | अनुशंसा |
|---|---|---|---|---|
image | छवि संसाधन | JPG/PNG/GIF/WebP छवियाँ | छवियाँ प्रदर्शित नहीं होंगी | ⭐ सुरक्षित |
font | फ़ॉन्ट फ़ाइलें | TTF/WOFF/WOFF2 फ़ॉन्ट | इसके बजाय सिस्टम डिफ़ॉल्ट फ़ॉन्ट का उपयोग किया जाएगा | ⭐ सुरक्षित |
media | मीडिया फ़ाइलें | वीडियो/ऑडियो फ़ाइलें | मीडिया सामग्री चलाई नहीं जा सकती | ⭐ सुरक्षित |
manifest | Web App Manifest | PWA कॉन्फ़िगरेशन फ़ाइल | PWA कार्यक्षमता प्रभावित हो सकती है | ⭐ सुरक्षित |
prefetch | प्रीफ़ेच संसाधन | <link rel="prefetch"> | पृष्ठ पर न्यूनतम प्रभाव | ⭐ सुरक्षित |
stylesheet | CSS स्टाइलशीट | बाहरी CSS फ़ाइलें | पृष्ठ शैलियाँ खो जाती हैं, लेआउट प्रभावित हो सकता है | ⚠️ सावधानी |
websocket | WebSocket | रीयल-टाइम संचार कनेक्शन | रीयल-टाइम कार्यक्षमता अक्षम | ⚠️ सावधानी |
eventsource | Server-Sent Events | सर्वर पुश डेटा | पुश कार्यक्षमता अक्षम | ⚠️ सावधानी |
preflight | CORS प्रीफ़्लाइट अनुरोध | OPTIONS अनुरोध | क्रॉस-ओरिजिन अनुरोध विफल | ⚠️ सावधानी |
script | JavaScript स्क्रिप्ट | बाहरी JS फ़ाइलें | गतिशील कार्यक्षमता अक्षम, SPA रेंडर नहीं हो सकता | ❌ टालें |
xhr | XHR अनुरोध | AJAX डेटा अनुरोध | गतिशील डेटा प्राप्त करने में असमर्थ | ❌ टालें |
fetch | 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({
sessionName: 'sdk_test',
sessionTTL: 180,
proxyCountry: 'ANY',
sessionRecording: 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 इंटरसेप्शन रणनीतियाँ
- डोमेन के आधार पर इंटरसेप्ट करें: किसी विशिष्ट डोमेन से सभी अनुरोध ब्लॉक करें
- पथ के आधार पर इंटरसेप्ट करें: किसी विशिष्ट पथ से अनुरोध ब्लॉक करें
- फ़ाइल प्रकार के आधार पर इंटरसेप्ट करें: विशिष्ट एक्सटेंशन वाली फ़ाइलें ब्लॉक करें
- कीवर्ड के आधार पर इंटरसेप्ट करें: ऐसे अनुरोध ब्लॉक करें जिनके 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 संसाधन | स्थैतिक संसाधन CDN | cdn.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({
sessionName: 'sdk_test',
sessionTTL: 180,
proxyCountry: 'ANY',
sessionRecording: 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: मोबाइल उपकरणों का अनुकरण
मोबाइल उपकरणों का अनुकरण करना एक और प्रभावी ट्रैफ़िक अनुकूलन रणनीति है क्योंकि मोबाइल वेबसाइटें आमतौर पर हल्की पृष्ठ सामग्री प्रदान करती हैं।
मोबाइल उपकरण अनुकरण के लाभ
- हल्के पृष्ठ संस्करण: कई वेबसाइटें मोबाइल उपकरणों के लिए अधिक संक्षिप्त सामग्री प्रदान करती हैं
- छोटे छवि संसाधन: मोबाइल संस्करण आमतौर पर छोटी छवियाँ लोड करते हैं
- सरलीकृत CSS और JavaScript: मोबाइल संस्करण आमतौर पर सरलीकृत शैलियों और स्क्रिप्ट का उपयोग करते हैं
- कम विज्ञापन और गैर-मुख्य सामग्री: मोबाइल संस्करण अक्सर कुछ गैर-मुख्य कार्यक्षमता को हटा देते हैं
- अनुकूली प्रतिक्रिया: छोटी स्क्रीन के लिए अनुकूलित सामग्री लेआउट प्राप्त करें
मोबाइल उपकरण अनुकरण कॉन्फ़िगरेशन
यहाँ कुछ सामान्य रूप से उपयोग किए जाने वाले मोबाइल उपकरणों के लिए कॉन्फ़िगरेशन पैरामीटर दिए गए हैं:
const iPhoneX = {
viewport: {
width: 375,
height: 812,
deviceScaleFactor: 3,
isMobile: true,
hasTouch: true,
isLandscape: false
}
};या मोबाइल उपकरणों का अनुकरण करने के लिए सीधे puppeteer के अंतर्निहित तरीकों का उपयोग करें
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({
sessionName: 'sdk_test',
sessionTTL: 180,
proxyCountry: 'ANY',
sessionRecording: 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({
sessionName: 'sdk_test',
sessionTTL: 180,
proxyCountry: 'ANY',
sessionRecording: 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({
sessionName: 'sdk_test',
sessionTTL: 180,
proxyCountry: 'ANY',
sessionRecording: 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 % |
उपरोक्त अनुकूलन योजनाओं को संयोजित करके, प्रॉक्सी ट्रैफ़िक की खपत को काफी कम किया जा सकता है, स्क्रैपिंग दक्षता में सुधार किया जा सकता है, और यह सुनिश्चित किया जा सकता है कि आवश्यक मुख्य सामग्री प्राप्त हो।