ডেফার এবং অ্যাসিঙ্ক ব্যবহার করে ওয়ার্ডপ্রেসে জাভাস্ক্রিপ্টের পার্সিং কীভাবে স্থগিত করা যায়

দর্শকদের জন্য ব্যবহারকারীর অভিজ্ঞতা বাড়ানো, সার্চ ইঞ্জিনে আপনার ওয়েবসাইটের দৃশ্যমানতা উন্নত করা এবং আপনার সাইটের অর্গানিক ট্রাফিক বাড়ানোর ক্ষেত্রে দ্রুত-লোড হওয়া ওয়ার্ডপ্রেস সাইটগুলি গুরুতর সুবিধা প্রদান করে।

একটি ওয়েব পেজে এইচটিএমএল, সিএসএস, জাভাস্ক্রিপ্ট এবং ইমেজ থাকে এবং পৃষ্ঠা লোডের সময় কমানোর জন্য এগুলির প্রতিটিকে অপ্টিমাইজ করতে হবে। পৃষ্ঠার আকারে চিত্রগুলির একটি সর্বাধিক প্রভাব রয়েছে তাই ওয়ার্ডপ্রেস ইমেজ অপ্টিমাইজেশান প্লাগইন ব্যবহার করে চিত্র ফাইলের আকার হ্রাস করা গুরুত্বপূর্ণ।

পৃষ্ঠার কর্মক্ষমতা আরও উন্নত করতে, আপনি WordPress-এ জাভাস্ক্রিপ্ট পার্সিং স্থগিত করতে পারেন যার মানে জাভাস্ক্রিপ্ট লোড হওয়ার আগে আপনি ব্রাউজারদের পৃষ্ঠার বিষয়বস্তু এবং ছবি লোড করার পরামর্শ দিতে পারেন। এই পরিমাপ নেওয়ার অর্থ হল জাভাস্ক্রিপ্ট উপাদানগুলি যেমন ফর্ম এবং স্লাইডারগুলি লোড হতে কয়েক সেকেন্ড অতিরিক্ত সময় নিতে পারে, তবে পৃষ্ঠা লোড করার সময়গুলি উল্লেখযোগ্যভাবে উন্নত হওয়ার কারণে এটি দিতে একটি ছোট মূল্য৷

জাভাস্ক্রিপ্ট কোড পরে ডিফার নামে দুটি কৌশল ব্যবহার করে কার্যকর করা যেতে পারে এবং অসিঙ্ক . উভয় পদ্ধতিই জনপ্রিয় ওয়ার্ডপ্রেস ক্যাশিং প্লাগইন দ্বারা সমর্থিত, যদিও ডেডিকেটেড সলিউশন আপনাকে জাভাস্ক্রিপ্ট ফাইলগুলি পরে লোড করা হয় তার উপর একটু বেশি নিয়ন্ত্রণ দেবে৷

এই নিবন্ধে, আমি ব্যাখ্যা করব জাভাস্ক্রিপ্ট ফাইলের লোডিং স্থগিত করার সুবিধা কী এবং আপনাকে পাঁচটি দরকারী ওয়ার্ডপ্রেস প্লাগইন দেখাব যা আপনার জন্য প্রক্রিয়া সহজতর করবে।

আমি আপনাকে এই বিষয়ে সম্পূর্ণ বোঝার জন্য পুরো নিবন্ধটি পড়ার জন্য উত্সাহিত করছি, তবে আপনি যদি একজন শিক্ষানবিস হন, তবে এই নিবন্ধটি থেকে আপনার একটি জিনিস সরিয়ে নেওয়া উচিত তা হল বিলম্বিত করুন এবং অসিঙ্ক আপনার ওয়েবসাইটের পৃষ্ঠা লোড হওয়ার সময় উল্লেখযোগ্যভাবে উন্নত করতে পারে।

ওয়ার্ডপ্রেস এ জাভাস্ক্রিপ্ট পার্সিং স্থগিত করার বিভিন্ন উপায় (বিলম্বিত এবং অ্যাসিঙ্ক সহ)

জাভাস্ক্রিপ্ট নিজেকে ওয়ার্ডপ্রেস ওয়েবসাইটগুলির একটি গুরুত্বপূর্ণ বিল্ডিং ব্লক হিসাবে প্রতিষ্ঠিত করেছে, যা বোতাম, ফর্ম, মিডিয়া গ্যালারী, অডিও, ভিডিও, কাউন্টডাউন টাইমার, সোশ্যাল মিডিয়া টাইমলাইন এবং আরও অনেক কিছু প্রদর্শন করতে ব্যবহৃত হচ্ছে৷

দুর্ভাগ্যবশত, জাভাস্ক্রিপ্ট হল ওয়েব পৃষ্ঠাগুলি ধীরে ধীরে লোড হওয়ার অন্যতম প্রধান কারণ কারণ ব্রাউজারটিকে প্রতিটি স্ক্রিপ্ট পৃষ্ঠার HTML মার্কআপ পার্স করা চালিয়ে যাওয়ার আগে থামাতে, ডাউনলোড করতে এবং কার্যকর করতে হয়।

পার্সিং হল এমন একটি প্রক্রিয়া যেখানে ব্রাউজার পৃষ্ঠার কোডটিকে এমন একটি ফর্ম্যাটে বিশ্লেষণ করে রূপান্তর করে যা এটি কার্যকর করতে পারে। যেকোন কোড যা এই প্রক্রিয়াটিকে বন্ধ করে দেয় তাকে "রেন্ডার-ব্লকিং" বলা হয় কারণ এটি ভিজিটরদের জন্য পেজ রেন্ডার করার প্রক্রিয়াকে বিলম্বিত করছে৷

রেন্ডার-ব্লকিং রিসোর্স একটি সাধারণ কারণ যে একটি WordPress ওয়েবসাইট ধীরে ধীরে লোড হচ্ছে। রেন্ডার-ব্লকিং প্রতিরোধ করার জন্য সমালোচনামূলক CSS ইনলাইনে প্রদর্শিত হতে পারে, তবে ডিফার ব্যবহার করে জাভাস্ক্রিপ্ট লোডিং পিছিয়ে দেওয়া ভাল অথবা অসিঙ্ক পৃষ্ঠা রেন্ডারিং ব্লক করা থেকে জাভাস্ক্রিপ্ট কোড প্রতিরোধ করতে।

অব্যবহৃত জাভাস্ক্রিপ্ট কোড মুছে ফেলা এবং জাভাস্ক্রিপ্ট এক্সিকিউশনের সময় কমানোও ভাল অভ্যাস। আপনি এটি করতে পারেন এমন একটি উপায় হল মিনিফিকেশন নামক একটি প্রক্রিয়ার মাধ্যমে বড় জাভাস্ক্রিপ্ট ফাইলের আকার হ্রাস করা , যা প্রতিটি জাভাস্ক্রিপ্ট ফাইল থেকে হোয়াইটস্পেস এবং অপ্রয়োজনীয় কোড সরিয়ে দেয়।

Google PageSpeed ​​Insights এবং GTmetrix-এর মতো ওয়েবসাইট বেঞ্চমার্কিং পরিষেবাগুলির মধ্যে সবচেয়ে গুরুত্বপূর্ণ মেট্রিকগুলির মধ্যে একটি হল ফার্স্ট কনটেন্টফুল পেইন্ট, যা দর্শকদের কাছে প্রথম বিষয়বস্তু প্রদর্শিত হতে সময় লাগে৷ গুগল বলেছে যে একটি FCP সময় 0 থেকে 1.8 সেকেন্ড ভালো হতে এবং 1.8 থেকে 3 সেকেন্ড মাঝারি। 3 সেকেন্ডের উপরে যেকোনো কিছুকে ধীর বলে ধরা হয়।

জাভাস্ক্রিপ্ট এবং CSS ফাইলগুলি দেখতে যা পৃষ্ঠাটির রেন্ডারকে ব্লক করছে তা দেখতে আপনাকে যা করতে হবে তা হল একটি ওয়েবসাইট বেঞ্চমার্কিং পরিষেবাতে একটি পৃষ্ঠার URL প্রবেশ করান৷ আপনি নীচের স্ক্রিনশট থেকে দেখতে পাচ্ছেন, রেন্ডার-ব্লকিং সিএসএস এবং জাভাস্ক্রিপ্ট ফাইলগুলি ডাউনলোড হতে কয়েক সেকেন্ড সময় নিতে পারে তাই আপনি যদি এই সংস্থানগুলি মুছে ফেলতে পারেন তবে আপনার পৃষ্ঠাগুলি উল্লেখযোগ্যভাবে দ্রুত লোড হবে৷

রেন্ডার-ব্লকিং জাভাস্ক্রিপ্ট ফাইলগুলিকে নির্মূল করার সবচেয়ে কার্যকর উপায় হল defer ব্যবহার করা এবং অসিঙ্ক গুণাবলী এই বুলিয়ান অ্যাট্রিবিউটগুলি শুধুমাত্র স্ক্রিপ্ট HTML উপাদানের সাথে ব্যবহার করা যেতে পারে যখন SRC অ্যাট্রিবিউটটি বহিরাগত ফাইলগুলিকে কল করার জন্য ব্যবহার করা হয়৷

<script src="javascript.js"></script>

জাভাস্ক্রিপ্ট ফাইল

<script defer src="javascript.js"></script>

ডিফার সহ জাভাস্ক্রিপ্ট ফাইল

<script async src="javascript.js"></script>

Jঅ্যাসিঙ্ক সহ অ্যাভাস্ক্রিপ্ট ফাইল

আপনি যখন এইচটিএমএল স্ক্রিপ্ট উপাদানে ডিফার বা অ্যাসিঙ্ক অ্যাট্রিবিউট যোগ করেন, আপনি ব্রাউজারকে পৃষ্ঠাটি পার্স করার সাথে সাথে ফাইলটি ডাউনলোড করার পরামর্শ দিচ্ছেন। স্থগিত করার সাথে, পৃষ্ঠাটি সম্পূর্ণভাবে পার্স হয়ে গেলে ফাইলটি কার্যকর করা হয়।

বিপরীতে, async অ্যাট্রিবিউট হল একটি অ্যাসিঙ্ক্রোনাস অপারেশন যা ফাইলটি ডাউনলোড হওয়ার সাথে সাথেই চালায়। যেমন, অ্যাসিঙ্ক সহ একটি পৃষ্ঠা পার্স করার মোট সময় সামান্য বেশি হবে কারণ ব্রাউজার ফাইলটি চালানোর জন্য HTML পার্স করা সংক্ষিপ্তভাবে বন্ধ করবে।

আপনি যদি ডিফার এবং অ্যাসিঙ্ক উভয়ই নির্দিষ্ট করতেন, ব্রাউজারগুলি অ্যাসিঙ্ক ব্যবহার করবে৷

বোঝার জন্য একটি গুরুত্বপূর্ণ মান হল ডকুমেন্ট অবজেক্ট মডেল, যাকে প্রায়শই DOM বলা হয়। DOM একটি সম্পূর্ণ নথির প্রতিনিধিত্ব করে, যেমন একটি XML ফাইল বা HTML পৃষ্ঠা, একটি একক বস্তু হিসাবে। হেড, বডি এবং হেডারের মতো গুরুত্বপূর্ণ উপাদানগুলোকে DOM-এর শাখা হিসেবে বিবেচনা করা যেতে পারে।

যদি একটি জাভাস্ক্রিপ্ট ফাইলের জন্য অন্য ফাইল বা DOM থেকে তথ্যের প্রয়োজন না হয়, তবে এটি অ্যাসিঙ্ক পদ্ধতি ব্যবহার করে সার্থক হতে পারে আপনার পৃষ্ঠার গুরুত্বপূর্ণ উপাদানগুলি দ্রুত প্রদর্শিত হবে। শুধু জেনে রাখুন যে যদি ফাইলটি এখনও লোড করা হয়নি এমন তথ্যের অনুরোধ করে তাহলে অ্যাসিঙ্ক আপনার ওয়েবসাইটের সাথে ত্রুটির কারণ হতে পারে৷

একটি Javascript ফাইলের তথ্যের প্রয়োজন হলে, স্থগিত করুন এটি পছন্দের বিকল্প কারণ এটি নিশ্চিত করে যে ফাইলটি কার্যকর করার আগে সমস্ত বিষয়বস্তু সঠিকভাবে পুনরুদ্ধার করা হয়েছে।

ডিফার এবং অ্যাসিঙ্ক করার লক্ষ্য হল পেজ রেন্ডারিং ব্লক করা কমানো এবং আপনি যে পদ্ধতিই ব্যবহার করুন না কেন পৃষ্ঠা লোড হওয়ার সময়ে একটি বড় উন্নতি দেখতে পাবেন।

কখন defer এবং async ব্যবহার করতে হবে তার আরও বিস্তৃত ব্যাখ্যার জন্য আমি Zell Liew-এর নিবন্ধ "কিভাবে এবং কখন Async এবং Defer বৈশিষ্ট্যগুলি ব্যবহার করতে হয়" পড়ার পরামর্শ দিই৷

কিভাবে ওয়ার্ডপ্রেস প্লাগইন ব্যবহার করে জাভাস্ক্রিপ্ট পার্সিং স্থগিত করা যায়

আপনার ওয়েবসাইটের বেশিরভাগ জাভাস্ক্রিপ্ট কল আপনার ওয়ার্ডপ্রেস থিম এবং সক্রিয় ওয়ার্ডপ্রেস প্লাগইন থেকে আসবে, তাই স্ক্রিপ্ট উপাদানগুলিতে ম্যানুয়ালি ডিফার এবং অ্যাসিঙ্ক অ্যাট্রিবিউট যোগ করা অব্যবহারিক।

ওয়ার্ডপ্রেসে জাভাস্ক্রিপ্টের পার্সিং স্থগিত করতে এবং আপনার ওয়েবসাইট জুড়ে ডিফার বা অ্যাসিঙ্ক প্রয়োগ করার প্রক্রিয়াটিকে সহজ করার জন্য একটি পারফরম্যান্স ওয়ার্ডপ্রেস প্লাগইন ব্যবহার করা ভাল৷

মনে রাখবেন যে ভুল কনফিগারেশন সেটিং আপনার ওয়েবসাইট ডিজাইনের সাথে সমস্যা সৃষ্টি করবে। উদাহরণস্বরূপ, আপনি সঠিক কনফিগারেশন সেটিংস নির্বাচন না করলে বা যোগাযোগ ফর্মের ফাইলগুলিকে অপ্টিমাইজেশান থেকে বাদ না দিলে যোগাযোগের ফর্মগুলি সঠিকভাবে প্রদর্শিত নাও হতে পারে৷

তাই আপনার ওয়েবসাইটের জন্য সঠিক কনফিগারেশন সেটিংস এবং সর্বোত্তম কর্মক্ষমতা খুঁজে পেতে ট্রায়াল এবং ত্রুটি প্রয়োজন।

• ওয়েবসাইট ব্যাকআপ – আপনি একটি অপ্টিমাইজেশান ওয়ার্ডপ্রেস প্লাগইন সক্রিয় করার আগে আপনার ওয়েবসাইট ব্যাকআপ করুন
• পরীক্ষা কার্যকারিতা - আপনার ওয়েবসাইটের মূল পৃষ্ঠাগুলির কার্যকারিতা পরীক্ষা করুন এবং প্রতিবার যখন আপনি একটি অপ্টিমাইজেশান কনফিগারেশন সেটিংস পরিবর্তন করেন
• আপনার ওয়েবসাইট পর্যালোচনা করুন – আপনার কনফিগারেশন পরিবর্তন করার পরে আপনার ওয়েবসাইটের কোনো অংশ ভেঙে গেছে কিনা তা পরীক্ষা করুন

জাভাস্ক্রিপ্ট পার্সিং স্থগিত করার সময় আপনি যদি কোনও বড় সমস্যায় পড়েন, প্লাগইনের ডিফল্ট সেটিংসে ফিরে যান। প্লাগইনটি আনইনস্টল করা যেতে পারে যদি এটি আপনার ওয়েবসাইটের সাথে সামঞ্জস্যপূর্ণ না হয়।

1. অটোঅপ্টিমাইজ করুন

অটোঅপ্টিমাইজ হল একটি বহুমুখী ওয়ার্ডপ্রেস অপ্টিমাইজেশান সমাধান যা আপনাকে জাভাস্ক্রিপ্ট, সিএসএস এবং এইচটিএমএলকে একত্রিত এবং ছোট করতে দেয়। অপ্টিমাইজ করা বিষয়বস্তু কর্মক্ষমতা উন্নত করতে ক্যাশ করা হয়. এই ক্যাশে দ্রুত খুব বড় হয়ে যেতে পারে, তাই আমি আপনাকে স্বয়ংক্রিয়ভাবে ক্যাশে সাফ করতে অটোক্লিয়ার অটোঅপ্টিমাইজ ক্যাশে ব্যবহার করতে উত্সাহিত করছি।

যদিও অটোঅপ্টিমাইজ ফাইল একত্রিতকরণের জন্য পরিচিত, এটি জাভাস্ক্রিপ্ট ফাইলগুলির পার্সিং স্থগিত করতেও ব্যবহার করা যেতে পারে যাতে সেগুলি রেন্ডার-ব্লকিং না হয়। জাভাস্ক্রিপ্ট এবং সিএসএস কোড ইনলাইনেও প্রদর্শিত হতে পারে এবং ছবি, গুগল ফন্ট, ইমোজি এবং আরও অনেক কিছুর জন্য অতিরিক্ত অপ্টিমাইজেশন বিকল্প রয়েছে।

2. অ্যাসিঙ্ক জাভাস্ক্রিপ্ট প্লাগইন

অটোঅপ্টিমাইজের স্রষ্টার দ্বারা তৈরি, Async JavaScript আপনাকে আপনার ওয়েবসাইট জুড়ে জাভাস্ক্রিপ্ট ফাইলগুলিতে অ্যাসিঙ্ক প্রয়োগ করতে এবং বিলম্বিত করতে দেয়৷ এটি আপনাকে প্রতিটি জাভাস্ক্রিপ্ট ফাইলের উপর সম্পূর্ণ নিয়ন্ত্রণ দেয়, আপনাকে jQuery, নির্দিষ্ট জাভাস্ক্রিপ্ট ফাইল, ওয়ার্ডপ্রেস প্লাগইন এবং ওয়ার্ডপ্রেস থিম বাদ দিতে দেয়। আপনি যদি চান, আপনি ঠিক কোন জাভাস্ক্রিপ্ট ফাইলগুলিকে অ্যাসিঙ্ক করতে হবে এবং কোনটি স্থগিত করতে হবে তা নির্দিষ্ট করতে পারেন৷

Async জাভাস্ক্রিপ্টের একটি দুর্দান্ত বৈশিষ্ট্য হল সেটআপ উইজার্ড যা আপনার ওয়েবসাইটের জন্য সমস্ত সম্ভাব্য কনফিগারেশন সেটিংসের জন্য GTmetrix-এ কর্মক্ষমতা পরীক্ষা চালায়। এটি একটি দুর্দান্ত সময়-সংরক্ষণকারী কারণ ফলাফলগুলি দেখায় যে প্রতিটি কনফিগারেশনের সাথে আপনার ওয়েবসাইটটি কত দ্রুত হবে, তবে আপনার ওয়েবসাইটের কোনও দিক নষ্ট না হয়েছে তা নিশ্চিত করতে প্রতিবার আপনার ওয়েবসাইটটি পরীক্ষা করতে ভুলবেন না।

3. পারফম্যাটারস

পারফম্যাটার্স হল একটি প্রিমিয়াম ওয়ার্ডপ্রেস পারফরম্যান্স টুলবক্স যা কয়েক ডজন অনন্য পারফরম্যান্স বৈশিষ্ট্য নিয়ে গর্ব করে। প্রতি বছর $24.95 থেকে খুচরা বিক্রি, প্লাগইন আপনাকে আপনার ওয়েবসাইটে জাভাস্ক্রিপ্ট ফাইল (সমস্ত JS ফাইল) পার্সিং স্থগিত করতে দেয়। jQuery ফাইলগুলি ডিফারেলগুলিতে অন্তর্ভুক্ত করা যেতে পারে এবং আপনি নির্দিষ্ট জাভাস্ক্রিপ্ট ফাইলগুলিও বাদ দিতে পারেন। আরেকটি দুর্দান্ত বিকল্প এটি আপনাকে দেয় জাভাস্ক্রিপ্ট বিলম্ব, যা শুধুমাত্র জাভাস্ক্রিপ্ট ফাইল লোড করবে যখন ব্যবহারকারীর মিথস্ক্রিয়া থাকবে।

নিরাপত্তা এবং কর্মক্ষমতা উন্নত করতে মূল ওয়ার্ডপ্রেস বৈশিষ্ট্যগুলি নিষ্ক্রিয় করতে পারফম্যাটারগুলি ব্যবহার করা যেতে পারে। এটি আপনাকে একটি কাস্টম লগইন URL, প্রিলোড সামগ্রী, অলস লোড চিত্র, Google Analytics সংহত করতে, Google ফন্টগুলি অপ্টিমাইজ করতে এবং আরও অনেক কিছু সংজ্ঞায়িত করতে দেয়৷

আমার প্রিয় বৈশিষ্ট্য হল স্ক্রিপ্ট ম্যানেজার কারণ এটি আপনাকে আপনার ওয়েবসাইটের প্রতিটি পৃষ্ঠার জন্য জাভাস্ক্রিপ্ট এবং CSS ফাইলগুলিকে সক্ষম এবং নিষ্ক্রিয় করতে দেয়৷ এটি পৃষ্ঠাগুলির আকারকে উল্লেখযোগ্যভাবে হ্রাস করবে কারণ ওয়ার্ডপ্রেস ডেভেলপারদের আপনার ওয়েবসাইট জুড়ে জাভাস্ক্রিপ্ট এবং CSS ফাইলগুলি লোড করার একটি খারাপ অভ্যাস রয়েছে, এমনকি যখন সেগুলি শুধুমাত্র কয়েকটি পৃষ্ঠায় প্রয়োজনীয়।

4. সম্পদ ক্লিনআপ

অ্যাসেট ক্লিনআপ হল একটি বৈশিষ্ট্য-সমৃদ্ধ অপ্টিমাইজেশান ওয়ার্ডপ্রেস প্লাগইন যা আপনাকে জাভাস্ক্রিপ্ট এবং সিএসএস ফাইলগুলিকে ছোট করতে, একত্রিত করতে এবং পার্সিং স্থগিত করতে দেয়৷ এর CSS এবং JS ম্যানেজার পারফম্যাটারের স্ক্রিপ্ট ম্যানেজারের অনুরূপভাবে কাজ করে, আপনাকে একটি নির্দিষ্ট পৃষ্ঠায় একটি ফাইল লোড করা হয়েছে কিনা তা নির্দিষ্ট করার অনুমতি দেয়। এছাড়াও আপনি মূল ওয়ার্ডপ্রেস সেটিংস অক্ষম করতে, HTML কোড পরিষ্কার করতে, Google ফন্ট অপ্টিমাইজ করতে এবং আরও অনেক কিছু করতে পারেন৷

অ্যাসেট ক্লিনআপ প্রো-এর জন্য একটি একক লাইসেন্স প্রতি বছর €42.36 এ খুচরা বিক্রি হয়। আপগ্রেড করা আপনাকে কোড ইনলাইনে রাখতে এবং জাভাস্ক্রিপ্ট ফাইলগুলির জন্য একটি পৃষ্ঠায় পৃষ্ঠার ভিত্তিতে অ্যাসিঙ্ক এবং বিলম্বিত করতে দেয়৷ এটি একটি প্লাগইন ম্যানেজারকেও আনলক করে এবং কীভাবে আপনার ওয়েবসাইট জুড়ে সম্পদ লোড করা হয় তার উপর আপনাকে আরও বেশি নিয়ন্ত্রণ দেয়।

5. HTTP/2 পুশ প্রিলোড

HTTP/2 পুশ প্রিলোড আপনাকে এনকিউ লোডিং ফাংশন ব্যবহার করে আপনার HTTP2 সমর্থিত সার্ভার জুড়ে জাভাস্ক্রিপ্ট এবং সিএসএস ফাইলগুলিকে পুশ এবং প্রিলোড করতে দেয়। এটি সমস্ত ফাইলগুলিতে প্রয়োগ করা যেতে পারে বা আপনি প্রতিটি সংস্থান আলাদাভাবে কনফিগার করতে বেছে নিতে পারেন। রিসোর্সের প্রকারের মধ্যে রয়েছে স্ক্রিপ্ট, স্টাইল, অডিও, এম্বেড, ফেচ, ফন্ট, ইমেজ, অবজেক্ট এবং ভিডিও।

আপনি যখন একটি জাভাস্ক্রিপ্ট ফাইলের URL লিখবেন, তখন আপনি অ্যাসিঙ্ক, বিলম্বিত বা সরানো বেছে নিতে পারেন। HTTP/2 পুশ প্রিলোড আপনাকে এই সেটিং কখন প্রযোজ্য হবে তার নিয়ম নির্ধারণ করতে দেয়৷ আপনি সমস্ত পৃষ্ঠার জন্য, মোবাইল বা ডেস্কটপের জন্য, নির্দিষ্ট পোস্ট এবং পৃষ্ঠাগুলির জন্য, বিভাগগুলির জন্য, অনুসন্ধান পৃষ্ঠাগুলির জন্য, WooCommerce পৃষ্ঠাগুলি এবং আরও অনেক কিছুর জন্য একটি সংস্থানের জন্য Javascript নিয়মগুলি সংজ্ঞায়িত করতে পারেন৷

চূড়ান্ত চিন্তা

জাভাস্ক্রিপ্ট ওয়েবসাইটগুলিতে গতিশীল বিষয়বস্তু এবং ইন্টারেক্টিভ উপাদান যুক্ত করার পছন্দের পদ্ধতি হিসাবে অব্যাহত রয়েছে। যেহেতু অনেক ওয়ার্ডপ্রেস থিম এবং প্লাগইন জাভাস্ক্রিপ্ট ব্যবহার করে, তাই ওয়ার্ডপ্রেসে জাভাস্ক্রিপ্ট পার্সিং স্থগিত করা গুরুত্বপূর্ণ এবং পেজগুলি দ্রুত রেন্ডার করা এবং পৃষ্ঠা রেন্ডারিং ব্লক করা কমাতে ডিফার এবং অ্যাসিঙ্ক ব্যবহার করুন৷

আপনি অনেকগুলি ওয়ার্ডপ্রেস প্লাগইনগুলিতে ডিফার এবং অ্যাসিঙ্ক প্রয়োগ করার কার্যকারিতা পাবেন, যদিও আমি এই নিবন্ধে যে সমাধানগুলি উল্লেখ করেছি তা আপনাকে আপনার জাভাস্ক্রিপ্ট ফাইলগুলির উপর আরও নিয়ন্ত্রণ দেয়।

আমার নিজের ওয়েবসাইটে, আমি ফাইল এগ্রিগেশনের জন্য অটোঅপ্টিমাইজ এবং জাভাস্ক্রিপ্ট ডিফারালের জন্য Async JavaScript ব্যবহার করি। আমি Async Javascript নিয়ে খুশি, যদিও HTTP/2 Push Preload অনেক ওয়েবসাইটের মালিকদের জন্য একটি ভাল বিকল্প হতে পারে কারণ এটি আপনাকে যেখানে অপ্টিমাইজেশান সেটিংস প্রয়োগ করা হয় তার উপর আরও ভাল নিয়ন্ত্রণ দেয়৷

অ্যাসেট ক্লিনআপ এবং পারফম্যাটারগুলি একই রকম বৈশিষ্ট্য এবং কার্যকারিতা অফার করে তাই আমি সেগুলি একসাথে ব্যবহার করার পরামর্শ দিই না। অ্যাসেট ক্লিনআপ প্রো নিঃসন্দেহে আরও ভাল নিয়ন্ত্রণ এবং আরও উন্নত বৈশিষ্ট্য সরবরাহ করে, যদিও আমি ওয়ার্ডপ্রেস পরিষ্কার করার জন্য আমার নিজের ওয়েবসাইটে পারফম্যাটার্স ব্যবহার চালিয়ে যাচ্ছি কারণ এটি ব্যবহার করা সহজ। উভয় সমাধানই যেকোন ওয়ার্ডপ্রেস অপ্টিমাইজেশান সেটআপকে উন্নত করবে, এমনকি যদি আপনি পৃষ্ঠা রেন্ডারিং ব্লক করা কমাতে জাভাস্ক্রিপ্ট পার্সিং স্থগিত করতে একটি ভিন্ন ওয়ার্ডপ্রেস প্লাগইন ব্যবহার করেন।

আমি আপনাকে জাভাস্ক্রিপ্ট পার্সিং স্থগিত করার জন্য এই সমস্ত ওয়ার্ডপ্রেস প্লাগইনগুলি পরীক্ষা করতে এবং আপনার সর্বোত্তম কনফিগারেশন নিশ্চিত করতে একাধিক পরীক্ষা করার জন্য উত্সাহিত করছি৷

শুভকামনা।

কেভিন