অব্যবহৃত জাভাস্ক্রিপ্ট আপনার পৃষ্ঠা লোডের গতি কমিয়ে দিতে পারে:
- যদি JavaScript রেন্ডার-ব্লকিং হয়, তাহলে পৃষ্ঠাটি রেন্ডার করার জন্য প্রয়োজনীয় অন্যান্য সমস্ত কাজের সাথে এগিয়ে যাওয়ার আগে ব্রাউজারটিকে অবশ্যই স্ক্রিপ্টটি ডাউনলোড, পার্স, কম্পাইল এবং মূল্যায়ন করতে হবে।
- এমনকি যদি জাভাস্ক্রিপ্ট অ্যাসিঙ্ক্রোনাস হয় (রেন্ডার-ব্লকিং নয়), কোডটি ডাউনলোড করার সময় অন্যান্য সংস্থানগুলির সাথে ব্যান্ডউইথের জন্য প্রতিযোগিতা করে, যার উল্লেখযোগ্য কার্যকারিতা প্রভাব রয়েছে। সীমাহীন ডেটা প্ল্যান নেই এমন মোবাইল ব্যবহারকারীদের জন্য নেটওয়ার্কের মাধ্যমে অব্যবহৃত কোড পাঠানোও অযথা।
কিভাবে অব্যবহৃত জাভাস্ক্রিপ্ট অডিট ব্যর্থ হয়
বাতিঘর প্রতিটি জাভাস্ক্রিপ্ট ফাইলকে 20 কিবিবাইটের বেশি অব্যবহৃত কোড সহ পতাকা দেয়:
![অডিটের একটি স্ক্রিনশট।](https://developer.chrome.com/static/docs/lighthouse/performance/unused-javascript/image/a-screenshot-the-audit-5e55ec7ebbacf.jpg?authuser=0&hl=bn)
কিভাবে অব্যবহৃত জাভাস্ক্রিপ্ট অপসারণ করা যায়
অব্যবহৃত জাভাস্ক্রিপ্ট সনাক্ত করুন
Chrome DevTools-এর কভারেজ ট্যাব আপনাকে অব্যবহৃত কোডের লাইন-বাই-লাইন ব্রেকডাউন দিতে পারে।
Puppeteer-এ Coverage
ক্লাস আপনাকে অব্যবহৃত কোড সনাক্তকরণ এবং ব্যবহৃত কোড বের করার প্রক্রিয়া স্বয়ংক্রিয় করতে সাহায্য করতে পারে।
অব্যবহৃত কোড অপসারণের জন্য সমর্থনের জন্য টুল তৈরি করুন
নিম্নলিখিত টুলিং দেখুন। আপনার বান্ডলার এমন বৈশিষ্ট্যগুলিকে সমর্থন করে যা অব্যবহৃত কোড এড়ানো বা সরানো সহজ করে কিনা তা জানতে পরীক্ষাগুলি রিপোর্ট করুন:
স্ট্যাক-নির্দিষ্ট নির্দেশিকা
কৌণিক
আপনি যদি কৌণিক CLI ব্যবহার করেন, আপনার বান্ডেলগুলি পরিদর্শন করতে আপনার উত্পাদন বিল্ডে উত্স মানচিত্র অন্তর্ভুক্ত করুন৷
ড্রুপাল
অব্যবহৃত জাভাস্ক্রিপ্ট সম্পদগুলি সরানোর কথা বিবেচনা করুন এবং শুধুমাত্র প্রয়োজনীয় ড্রুপাল লাইব্রেরিগুলিকে একটি পৃষ্ঠার প্রাসঙ্গিক পৃষ্ঠা বা উপাদানে সংযুক্ত করুন৷ বিস্তারিত জানার জন্য একটি লাইব্রেরির সংজ্ঞা দেখুন।
জুমলা
আপনার পৃষ্ঠায় অব্যবহৃত জাভাস্ক্রিপ্ট লোড করা জুমলা এক্সটেনশনের সংখ্যা হ্রাস বা পরিবর্তন করার কথা বিবেচনা করুন।
ম্যাজেন্টো
Magento এর অন্তর্নির্মিত JavaScript বান্ডলিং অক্ষম করুন।
প্রতিক্রিয়া
আপনি সার্ভার-সাইড রেন্ডারিং না হলে, আপনার জাভাস্ক্রিপ্ট বান্ডিলগুলিকে React.lazy()
দিয়ে বিভক্ত করুন। অন্যথায়, একটি তৃতীয় পক্ষের লাইব্রেরি যেমন লোডযোগ্য-কম্পোনেন্ট ব্যবহার করে কোড-বিভক্ত।
Vue
আপনি যদি সার্ভার-সাইড রেন্ডারিং না করেন এবং Vue রাউটার ব্যবহার করেন, তাহলে অলস লোডিং রুট দ্বারা বান্ডিলগুলিকে বিভক্ত করুন৷
ওয়ার্ডপ্রেস
আপনার পৃষ্ঠায় অব্যবহৃত জাভাস্ক্রিপ্ট লোড করা ওয়ার্ডপ্রেস প্লাগইনগুলির সংখ্যা হ্রাস বা পরিবর্তন করার কথা বিবেচনা করুন৷