পেজ সাইজ এবং HTTP Request কমানো

PhantomJS একটি headless browser (গ্রাফিকাল ইউজার ইন্টারফেস ছাড়া ব্রাউজার) যা WebKit ইঞ্জিনের উপর ভিত্তি করে তৈরি। এটি মূলত JavaScript API ব্যবহার করে স্ক্রিপ্টিং এবং ওয়েব পেজের বিভিন্ন ধরনের টেস্টিং বা কার্যক্রম স্বয়ংক্রিয়ভাবে করার জন্য ব্যবহৃত হয়। PhantomJS ব্রাউজারের মত আচরণ করে কিন্তু এটি UI ছাড়া কাজ করে, যা এটিকে খুব দ্রুত এবং হালকা করে তোলে। এর মাধ্যমে আপনি পেজ স্ক্রিনশট, টেস্টিং, ওয়েব স্ক্র্যাপিং এবং আরও অনেক কিছু করতে পারেন।

এখানে আমরা দেখব কিভাবে PhantomJS ব্যবহার করে পেজ সাইজ কমানো এবং HTTP requests কমানো যায়।

1. PhantomJS দিয়ে পেজ সাইজ এবং HTTP Request কমানোর কৌশল

PhantomJS ব্যবহার করে আপনি বিভিন্ন optimization techniques প্রয়োগ করতে পারেন যা আপনার ওয়েব পেজের পারফরম্যান্স উন্নত করবে এবং HTTP requests কমাবে।

1.1. পেজ সাইজ কমানো (Reducing Page Size)

পেজ সাইজ কমানোর জন্য PhantomJS এর মাধ্যমে কিছু সাধারণ কৌশল প্রয়োগ করা যায়:

• Resources লোড বন্ধ করা: আপনি PhantomJS দিয়ে পেজে প্রয়োজনীয় রিসোর্স ছাড়া অন্য রিসোর্স যেমন ইমেজ, ফন্ট, CSS বা JavaScript লোড বন্ধ করতে পারেন।
• Lazy loading ব্যবহার করা: পেজের কিছু উপাদান কেবল তখনই লোড করুন যখন সেগুলি স্ক্রিনে আসে।

PhantomJS স্ক্রিপ্ট:

var page = require('webpage').create();
page.settings.loadImages = false;  // Disable image loading
page.settings.userAgent = 'Mozilla/5.0';  // Set a custom user agent

page.open('http://example.com', function(status) {
    if(status === "success") {
        console.log("Page loaded successfully!");
        page.render('screenshot.png');  // Save screenshot
    }
    phantom.exit();
});

Explanations:

• page.settings.loadImages = false;: এখানে ইমেজ লোডিং বন্ধ করা হয়েছে। এটি আপনার পেজের সাইজ কমাতে সাহায্য করবে, কারণ অনেক ওয়েবসাইটে বড় আকারের ইমেজ থাকে যা পেজ লোডিং টাইম বাড়ায়।
• page.settings.userAgent: আপনি কাস্টম User-Agent সেট করতে পারেন, যা কিছু রিসোর্স লোড করতে সাহায্য করে বা বন্ধ করে দেয়।

এছাড়া, আপনি JavaScript বা CSS এর মাধ্যমে অনুরোধ করা কিছু ফাইল লোড করতে পারবেন বা বন্ধ করতে পারবেন, যেমন Google Fonts, তৃতীয় পক্ষের স্ক্রিপ্ট ইত্যাদি।

1.2. HTTP Requests কমানো (Reducing HTTP Requests)

PhantomJS ব্যবহার করে আপনি HTTP requests কমানোর জন্য কিছু কৌশল প্রয়োগ করতে পারেন:

• External Resources লোড বন্ধ করা: PhantomJS দিয়ে আপনি বাইরের JavaScript, CSS, এবং অন্যান্য রিসোর্স লোড বন্ধ করতে পারেন যা পেজ লোডের সময় অতিরিক্ত HTTP requests তৈরি করে।
• Inline Resources ব্যবহার করা: আপনি যদি স্ক্রিপ্ট বা স্টাইলশীট ফাইলগুলি ডাউনলোড না করতে চান, তবে সেগুলো ইনলাইন করে পেজের HTML ফাইলে যুক্ত করতে পারেন।

PhantomJS স্ক্রিপ্ট:

var page = require('webpage').create();
page.onResourceRequested = function(requestData, networkRequest) {
    // Block requests for images, CSS, and JS files
    if (requestData.url.match(/\.(jpg|jpeg|png|gif|css|js)$/i)) {
        networkRequest.abort();  // Abort the request
    }
};

page.open('http://example.com', function(status) {
    if (status === "success") {
        console.log("Page loaded successfully without images, CSS, or JS!");
        page.render('screenshot.png');  // Save screenshot
    }
    phantom.exit();
});

Explanations:

• onResourceRequested: এই ইভেন্টটি যখন কোনো রিসোর্স লোড করা হয় তখন ফায়ার হয়। এখানে আপনি abort() মেথড ব্যবহার করে ইমেজ, CSS, বা JavaScript রিসোর্স লোড করতে অস্বীকৃতি জানাতে পারেন।
• requestData.url.match(/\.(jpg|jpeg|png|gif|css|js)$/i): এখানে আমরা regular expression ব্যবহার করে image, CSS, এবং JS রিসোর্স ব্লক করছি।

এই স্ক্রিপ্টটি image, CSS, এবং JavaScript ফাইলগুলোর HTTP request কে abort করে দেয়, যার ফলে এই ফাইলগুলো লোড হওয়ার পর HTTP request কমানো হয় এবং পেজের সাইজ কমে যায়।

1.3. Performance Optimization:

PhantomJS ব্যবহার করে পেজের পারফরম্যান্স উন্নত করতে আরও কিছু টেকনিক প্রয়োগ করা যায়:

• JavaScript Execution Disable: আপনি PhantomJS-এ JavaScript কার্যকরী না করেও পেজের HTML এবং CSS স্টাইলগুলি দেখতে পারেন।
• Font and Image Optimization: ফন্ট এবং ইমেজ অপটিমাইজেশনের জন্য আপনি কম্প্রেসড ইমেজ এবং ওয়েব ফন্ট ব্যবহার করতে পারেন।

Disabling JavaScript:

var page = require('webpage').create();
page.settings.javascriptEnabled = false;  // Disable JavaScript

page.open('http://example.com', function(status) {
    if(status === "success") {
        console.log("Page loaded successfully without JavaScript");
        page.render('screenshot.png');  // Save screenshot
    }
    phantom.exit();
});

Explanation:

• page.settings.javascriptEnabled = false;: এই লাইনটি JavaScript নিষ্ক্রিয় করে দেয়, যার ফলে কোনো JavaScript কোড পেজে রান করবে না। এর ফলে পেজ লোডের সময় কিছু স্ক্রিপ্টের কারণে হতে থাকা অতিরিক্ত HTTP requests বন্ধ হয়ে যাবে এবং লোড টাইম কমে যাবে।

PhantomJS ব্যবহার করে page size এবং HTTP requests কমানো সম্ভব। আপনি resource blocking, image loading disable, এবং JavaScript execution disable এর মতো কৌশল ব্যবহার করে পেজের পারফরম্যান্স এবং লোড টাইম উন্নত করতে পারেন। PhantomJS একধরনের headless browser হিসেবে খুব কার্যকরী, যেখানে আপনি কোড বা স্ক্রিপ্টের মাধ্যমে ওয়েব পেজের পারফরম্যান্স অপটিমাইজেশন করতে পারেন এবং ব্রাউজার ইন্টারফেস ছাড়াই কার্যক্রম পরিচালনা করতে পারেন।