ক্লোজার কমপাইলার সার্ভিস এমন একটি টুল যেটা দিয়ে অনেকগুলি জাভাস্ক্রিপ্টকে একত্রে এনে কমপ্রেশানের মাধ্যমে দ্রুত লোডিংয়ের আয়োজন করা যেতে পারে। আজকাল আমাদের জাভাস্ক্রিপ্টের ব্যবহার বেড়ে গেছে, ওয়ার্ডপ্রেসের অনেক থিম এবং প্লাগিনের কারনে ৪-১০’টি জাভাস্ক্রিপ্ট লোড করাতেই হয়। কিন্তু এতোগুলি স্ক্রিপ্ট লোড হতে সময় লেগে যায় বেশ কিছুটা, ক্লোজার কমপাইলার সার্ভিস দিয়ে আমরা একাধিক জাভাস্ক্রিপ্ট ফাইলকে একটি ফাইলের মধ্যে আনতে পারবো এবং এই পর্যন্ত আমি যতোগুলি পরীক্ষা করেছি তাতে সব জাভাস্ক্রিপ্ট ফাইলের মিলিত সাইজের অর্দ্ধেক সাইজের একটি ফাইল বানিয়ে দিয়েছে। এটি PageSpeed‘এর সাথে একযোগে কাজ করবে।
সরল একটি ওয়েব ইন্টারফেসের মাধ্যমে এই কাজটি সম্পন্ন করতে পারবেন। বর্তমানে ব্লগে যেসব জাভাস্ক্রিপ্ট চলছে তার ইউআরএল দিয়ে দিন এক এক করে, সাধারনভাবে স্ক্রিপ্টগুলি থাকে থিম ডাইরেক্টরির মধ্যে সাবফোল্ডারে, নির্দিষ্ট ইউআরএল ঠিকানাটি দিন এবং Add ক্লিক করুন, এইভাবে একে একে সব জাভাস্ক্রিপ্ট ফাইল যুক্ত করে নিয়ে অপ্টিমাইজেশান লেভেল পছন্দ করুন। পছন্দগুলি পাবেন Whitespace only, Simple এবং Advanced। আপাতত Simple দিয়েই শুরু করা ভালো, তবে বিশদে জানতে এই পাতায় দেখুন।
আপনার ব্লগে কতোগুলি জাভাস্ক্রিপ্ট চলছে?
সাধারনভাবে থিম ফোল্ডারের মধ্যেই /js কিম্বা /javascript নামে ফোল্ডার পাবেন, সেখানেই মূলত সব জাভাস্ক্রিপ্ট ফাইল রাখা থাকে। এই ফোল্ডারের নামের হেরফের হতে পারে, যেমন থিসিস থিম যারা ব্যবহার করছেন, সেখানে /lib/scripts ফোল্ডারে আছে জাভাস্ক্রিপ্ট। এছাড়াও /wp-includes/js/ ফোল্ডার থেকেও প্লাগিন লোড হয়। মোট কতোগুলি এবং কি কি জাভাস্ক্রিপ্ট লোড হচ্ছে সেইটা জানার সবচেয়ে সহজ উপায় ব্রাউজারে ব্লগের প্রধান পাতা এবং যেকোনো একটি পোস্ট পাতা খুলে নিয়ে পেজ সোর্স দেখুন। খুঁজে পেতে যদি অসুবিধা হয়, তাহলে সার্চ করুন “.js” লিখে, এর পরে Next বোতাম চেপে একে একে দেখে নিন সব জাভাস্ক্রিপ্টের ইউআরএল ঠিকানা।
কিভাবে করবেন কমপাইল প্রক্রিয়াটি?
দুটি উপায় আছে। যাদের ব্লগ ইতিমধ্যেই সক্রিয় আছে, তারা উপরের পদ্ধতিতে সব স্ক্রিপ্টের ইউআরএল ঠিকানা একে একে নিয়ে Closure Compiler পাতায় Add A URL পদ্ধতিতে একে একে যুক্ত করে দিতে পারেন। এই পদ্ধতিতে কমপাইলার আপনার ব্লগ থেকে সরাসরি সংগ্রহ করে নেবে আপনার বলে দেওয়া স্ক্রিপ্ট ফাইলগুলি। অন্যথায়, থিমের ফোল্ডার থেকে স্ক্রিপ্ট ফাইল খুলে সবটা কপি করে নিয়ে কমপাইলার পাতায় দেওয়া বাক্সে পেস্ট করে দিতে পারেন। এই পদ্ধতিতে অনেক কপি/পেস্ট করতে হতে পারে।
যেসব স্ক্রিপ্ট ফাইল একেবারেই ধরবেন না
আপনারা জানেন যে গুগল এডসেন্স, গুগল এনালিটিক্স ইত্যাদির জাভাস্ক্রিপ্ট আছে যা গুগল নিজে নিয়ন্ত্রণ করতে পছন্দ করে। আমরা এইসব ফাইলে নিজেদের কর্তৃত্ব ফলাই তা গুগল একেবারেই চায়না। সুতরাং ga.js এবং show_ads.js এই দুটি ফাইল কমপাইলারে দেবেন না। পরিবর্তন না করেও এই দুটিকে কমপাইলারের মাধ্যমে অন্যান্য স্ক্রিপ্টের সঙ্গে একত্রে একটি জাভাস্ক্রিপ্ট ফাইলে নেওয়ায় নিয়মবিরুদ্ধ হিসেবেই গণ্য হবে। যদি গুগল নাও ধরতে পারে, তার পরেও কিছু অনাকাঙ্খিত পরিস্থিতির সম্মুখিন হতে পারেন, তার একটাই কারন, গুগল তার সার্ভিস আপডেটের সময়ে এইসব ফাইলে কিছু পরিবর্তন করতে পারে যার লাভ আপনি পাবেন না যদি কমপাইলার দিয়ে অন্য একটি ফাইলে নিয়ে নেন স্ক্রিপ্ট। সুতরাং, গুগলের উন্নত সার্ভিস থেকে বঞ্চিত হতে না চাইলে এই দুটি জাভাস্ক্রিপ্ট ফাইলকে গুগলের সার্ভার থেকেই লোড হতে দিন।
থার্ড পার্টি জাভাস্ক্রিপ্ট
আমরা অনেকেই এমন কিছু সার্ভিস ব্যবহার করি যেসবের জাভাস্ক্রিপ্ট সার্ভিস প্রদানকারীর ওয়েবসাইট থেকেই লোড হয়। এইসব ক্ষেত্রে এদের স্ক্রিপ্টের ইউআরএল জেনে নিয়ে কপি করে কমপাইলারে দিতে পারেন (যদি না তাদের নিয়মে এক্সক্লুসিভ ভাবে বারন করা থাকে), তবে এক্ষেত্রে একটু নজর রাখবেন যে থিমের যেসব পিএইচপি ফাইলে procedure call থাকবে সেইখানেও পরিবর্তন করতে হবে যাতে করে দুইবার call না হয় একই জিনিস। আমরা ব্লগের লোডিং টাইমে গতি আনতে চাইছি, একই স্ক্রিপ্ট দুইবার call যেন নাহয় সেদিকেও সমান নজর রাখতে হবে।
কমপাইল কার্য শেষে আপনি পাবেন একটি নতুন জাভাস্ক্রিপ্ট ফাইল। স্বাভাবিকভাবে এর নাম default.js আছে, এই নাম পরিবর্তন করে নিতে পারেন। পূর্বের সকল স্ক্রিপ্ট ফাইলের মিলিত সাইজের হিসেব করুন এবং নতুন ফাইলের সাইজ দেখুন কতোখানি সাইজ কমেছে। এবারে এই ফাইল ব্যবহারের জন্য প্রথমেই ডাউনলোড করে নিন এবং FTP দিয়ে নিজের হোস্টে আপলোড করে রাখুন। থিমের জাভাস্ক্রিপ্টের ফোল্ডারেও রাখতে পারেন। এবারে থিম এডিট করতে হবে, পূর্বের জাভাস্ক্রিপ্টগুলিকে নিষ্ক্রিয় করুন এবং নতুন ফাইলের ইউআরএল লিখে দিন। (পূর্বের জাভাস্ক্রিপ্টগুলির উল্লেখ মুছে না ফেলে নিষ্ক্রিয় করুন <!– এইভাবে –> ) এবারে থিম ফাইল সেভ করুন এবং ব্রাউজারে ব্লগ লোড করে দেখুন সব ঠিক আছে কিনা। সমস্যা মনে হলেই নিষ্ক্রিয় করা লাইনগুলিকে আবার সক্রিয় করে দিন এবং নতুন ফাইলের লাইনটিকে নিষ্ক্রিয় করে দিন, তাহলেই ব্লগ পূর্বের মতোই লোড হওয়ার কথা।
এই কমপাইলার সার্ভিস দিয়ে সুবিধা যেটুকু হবে তা সাধারন চোখে হয়তো ধরা নাও যেতে পারে। তবে অঙ্কের বিচারে লোডিং টাইমে গতি আসবেই কিছুটা। ভালোভাবে বোঝার জন্য আগে ওয়েবমাস্টার টুলসে গিয়ে পেজস্পিড দিয়ে গতি নির্ধারন করে নিন, তার পরে উপরের পদ্ধতি সেরে নিয়ে আবার পেজস্পিড চালিয়ে দেখুন কিছুটা সুবিধা হয়েছে কিনা।
দুই তিন মাসে একবার করে সমস্ত স্ক্রিপ্ট তাদের মূল সোর্স থেকে নিয়ে আবার কমপাইল
করে নিন। দিন যতো এগোচ্ছে ততো বেশি করে উন্নত করা হচ্ছে সব কোড, প্রোগ্রামাররা
দিনরাত এক করে এই উদ্দেশ্যে কাজ করে চলেছেন। তাই, আপডেটেড থাকার জন্যই
নির্দিষ্ট সময়ের ব্যবধানে আবার নতুন করে কমপাইল করে নিন সবগুলি স্ক্রিপ্ট।
About the author
টেক বিষয়ক জ্ঞান আমার বড়ই অল্প, যেটুকুও বা জানি সেটা সকলের সাথেই ভাগাভাগি করে নিতে চাই; লেখার পাশাপাশি আরো অনেক শিখতেও চাই। আবার সেইসব লিখতে চাই - নিজের মতো করে, নিজে যা বুঝলাম। আপনারাও লিখুন, আমি পড়বো।
- More at
এই ধরনের আরোও কিছু পোস্ট:
- ওয়ার্ডপ্রেস ৩.১ রিলিজ পেয়েছে… আপাতত গুনাগুন বর্ণনা করতে পারছি না
- সার্চ ইঞ্জিনে আপনার Keywords এর অবস্থান জেনে নিন
- অবশেষে কনটেন্ট ডেলিভারী নেটওয়ার্কে (সিডিএন) যোগ দিলাম … ওয়েবসাইট কি দ্রুত লোড হচ্ছে?
- জলদি দেখুন গুগলের নতুন রুপ
- একটি ওয়েবসাইটের সূচনা… CMS হিসেবে ওয়ার্ডপ্রেসের ব্যবহার
- [অতিথি পোষ্ট] কিভাবে cPanel এ MySQL ডেটাবেজ তৈরি করবেন?
- আমি কেন ব্লগিংয়ের জন্য ওর্য়াডপ্রেস ব্যবহার করি ~ ওয়ার্ডপ্রেসই সেরা ব্লগিং প্লাটর্ফম
- [অতিথি পোষ্ট] হাসান ভাইয়ের সাথে অনলাইন আয় আর সার্চ ইঞ্জিন অপটিমাইজেশন বিষয়ক আড্ডার কথা…
{ 20 comments… read them below or add one }
ভাল পোস্ট। পিএইচপির কোড কোড কম্প্রেস করতে কি করতে হবে জানালে উপকৃত হব
পিএইচপি-র কোড কম্প্রেস করার দরকার আছে বলে মনে করি না। আর এ সম্বন্ধে কোনো প্লাগইনের নাম মনে আসছে না।
ওয়ার্ডপ্রেস ক্যাশিং নিয়ে এখানে http://bn.jinnatulhasan.com/2010/02/3301 আলোচনা করা হয়েছে।
এক নি:শ্বাসে পড়ে গেলাম। হয়তো একটু দেরী করে কাজে লাগাবো। ওয়ার্ডপ্রেস এডমিন প্যানেলে অনেক জাভাস্ক্রিপ্ট ওদেরকে আগে সায়েস্তা করতে হবে। আবশ্য প্লাগইনগুলোর ব্যপারেও আমি চিন্তিত।
ধন্যবাদ রিয়া, ধন্যবাদ গুগল ল্যাব।
চমৎকার লেখা । কাজের পোস্ট ।
আচ্ছা একটা কথা। —-
আমি কিভাবে বুঝবো যে আমার থিমে কয়টা জাভাস্ক্রীপ্ট আছে?? এরকমওতো থীম থাকতে পারে যেটাতে কোন জাভাস্ক্রীপ্ট নাই।
থিসিস থিমে কি জাভাস্ক্রীপ্ট আছে??
এতোদিন কাজ করে এতোকিছু শিখে আজ এই প্রশ্ন? আচ্ছা বেশ, অনেক উপায় আছে জানার। থিসিস থিম যদি নিজের ব্লগে হয় তাহলে তুমি নিশ্চয় থিম ফোল্ডারেই দেখতে পাচ্ছো কয়টা জাভাস্ক্রিপ্ট আছে! যদি অন্য কারো ব্লগের স্ক্রিপ্ট দেখতে চাও তাহলে সহজ উপায় পাতা লোড করেই পেজ সোর্স দেখো, CTRL+F চেপে “.js” খোঁজো, তাহলেই জেনে যাবে কয়টা স্ক্রিপ্ট লোড হচ্ছে এবং তার ইউআরএল ঠিকানাও পেয়ে যাবে। কিছু এমন স্ক্রিপ্ট পেতে পারো যেগুলি হয়তো বুঝতে পারবেনা কি জিনিস, কারন অনেকে তাদের নিজস্ব স্ক্রিপ্ট লেখেন, সেক্ষেত্রে স্ক্রিপ্ট ডাউনলোড করে নিয়ে ফাইল পড়ে দেখতে পারো।
লজ্জা পেলাম আপু। আসলে অনেক সময় দেখা যায়—-অনেক বেসিক সহজ সরল জিনিসও জানি না। এরকম হয় কেন?? যেমন .js যে জাভাস্ক্রীপটের এক্সটেনশন এটা জানতাম না
।
আমার একটা বদ অভ্যাস আছে— সবকিছুই স্কিম করে যাই। এ ব্যাপারটায় পরিবর্তন আনতে হবে।
পরামর্শের জন্য ধন্যবাদ।
রিয়া আপু অনেক সুন্দর পোষ্ট।কিন্ত advance লিখা আমরা মনেহয় পারবোনা।চেষ্টা চালিয়ে যাচ্ছি advance ঞবার জন্য ।
ভাল পোস্ট লিখেছেন রিয়া আপু। তবে অনেক sensitive কাজ মনে হচ্ছে।
ঠিক বলেছেন , কাজটা মনে হয় আনেক sensitive
আপু পোষ্টটার কিছু অংশ আগেই আপনার ব্লগে পডেছি ।
এখন পুরাটা পরে নিলাম।
এন্টেনার উপ্রে দিয়ে গেল। জাভাস্ক্রীপ্ট বুঝিনা
তবে পোস্টটা ভাল হয়েছে এটা বুঝতে পেরেছি
সুন্দর ভাবে বিষয়টি উপস্থাপনের জন্য ধন্যবাদ।
তন্ময় ভাই, ১২৫ সাইজের যে বক্সের কথা বলেছিলাম সেই চিন্তাটা বাদ দিছি।বাকী কাজগুলো সময় পেলে একটু দেখবেন আর রিয়া আপুর এই পোষ্টের বিষয়টা আমার দ্বারা সম্ভব না, তাই আপনার সাহায্যপ্রার্থী…
আমার লেখা সবচেয়ে নিকৃষ্টতম পোস্ট এটা
ছি ছি আপু তা কেন হবে?আসলে আমাদের অনেকের টেকনিক্যাল জ্ঞান এতই কম যে অনেক Advanced বিষয়গুলো বুঝি না, এক্ষেত্রে ঠিক তাই হয়েছে।তাতে সমস্যা নাই, তন্ময় ভাইয়ের মতো যারা টেকনিক্যাল্লি Sound তারা সাহায্য করলেই কাজ এগিয়ে যাবে।ভবিষ্যতে আরো এ্যাডভান্সড কিছু আলোচনা করবেন সেই প্রত্যাশা রইল…অনেক ধন্যবাদ এই পোষ্টের জন্য।
ওরে আদনান! আমি কিন্তু অতি বিনয় দেখাচ্ছিনা! সত্যিই এই লেখাটা ভালো হয়নি, তাছাড়া অনেক খামতি থেকে গেছে। কেমন যেন তথ্য অগোছালো হয়ে আছে, বেশ কিছু তথ্য লিখতেই ভুলে গেছি। সবচেয়ে বড় কথা, যেকোনো লেখা আমি চেষ্টা করি সহজ করে বোঝানোর, সেটাই মিসিং এই লেখায়। সাময়িকভাবে অমনোযোগী হয়ে পড়েছিলাম মনে হয়।
হেঃ হেঃ কথা সত্য, লেখাটা কিঞ্চিত না বেশ ভালই কঠিন হইছে, রনি ভাইয়ের ভাষায় “এন্টেনার উপ্রে দিয়ে” গেছে।যাই হোক এই ব্লগে হাসান ভাইয়ের Search Engine Optimization এর উপর অনেকগুলো অনবদ্য পোষ্ট আছে।সামনে আপনিও কিছু লিখবেন এই অনুরোধ রইল, আরো ভাল হয় যদি off page Optimization,Social Networking নিয়ে কিছু লিখেন।হয়তো নতুন কিছু ট্রিকস জানতে পারব।ভাল থাকুন…
হেঃ হেঃ হেঃ মজা পাইলাম “এন্টেনার উপ্রে দিয়ে” !!!