বুটস্ট্রাপ ৪ এবং বুটস্ট্রাপ ৫ দুটোই জনপ্রিয় এবং শক্তিশালী ওয়েব ফ্রেমওয়ার্ক, কিন্তু বুটস্ট্রাপ ৫ কিছু নতুন বৈশিষ্ট্য এবং উন্নয়ন নিয়ে এসেছে যা বুটস্ট্রাপ ৪ এর থেকে আলাদা। এখানে বুটস্ট্রাপ ৪ এবং বুটস্ট্রাপ ৫ এর মধ্যে কিছু মূল পার্থক্য তুলে ধরা হলো:
বুটস্ট্রাপ ৪: বুটস্ট্রাপ ৪ jQuery এবং Popper.js ব্যবহার করত UI কম্পোনেন্ট যেমন ড্রপডাউন, টুলটিপ, মডাল ইত্যাদির কার্যকারিতা সম্পন্ন করার জন্য।
বুটস্ট্রাপ ৫: বুটস্ট্রাপ ৫ এ jQuery এবং Popper.js সরিয়ে ফেলা হয়েছে। এখন শুধুমাত্র ক্লিন, নেটিভ জাভাস্ক্রিপ্ট ব্যবহার করা হয়, যার ফলে কোডের সাইজ ছোট এবং দ্রুত কার্যকরী হয়।
বুটস্ট্রাপ ৪: গ্রিড সিস্টেমে ১২ কলাম (columns) ছিল এবং বিভিন্ন স্ক্রীন সাইজের জন্য আলাদা ক্লাস যেমন col-lg-
, col-md-
, col-sm-
ইত্যাদি ছিল। তবে col-
ক্লাসটি সকল স্ক্রীনের জন্য একটি সাধারণ সাইজ নির্ধারণ করত।
বুটস্ট্রাপ ৫: বুটস্ট্রাপ ৫ এ গ্রিড সিস্টেমে নতুন ক্লাস col-xxl-
যোগ করা হয়েছে, যা বড় স্ক্রীনের জন্য আরও নির্দিষ্ট কন্ট্রোল দিতে সহায়তা করে। এছাড়া, g-
ক্লাস ব্যবহারের মাধ্যমে গ্রিড গ্যাপ (grid gap) নিয়ন্ত্রণ করা সম্ভব হয়েছে, যা আগে gutters
ক্লাসের মাধ্যমে করা হতো।
বুটস্ট্রাপ ৪: বুটস্ট্রাপ ৪ এ বেশ কিছু জনপ্রিয় UI কম্পোনেন্ট ছিল, যেমন: মডাল, ড্রপডাউন, নেভিগেশন বার, বাটন ইত্যাদি।
বুটস্ট্রাপ ৫: বুটস্ট্রাপ ৫ এ নতুন কিছু ইউআই কম্পোনেন্ট যুক্ত করা হয়েছে:
collapse
কম্পোনেন্টের উন্নত সংস্করণ।বুটস্ট্রাপ ৪: বুটস্ট্রাপ ৪ এর কাস্টম ফন্ট এবং রঙ নিয়ন্ত্রণ কিছুটা সীমিত ছিল, তবে আপনি CSS এর মাধ্যমে কিছু পরিবর্তন করতে পারতেন।
বুটস্ট্রাপ ৫: বুটস্ট্রাপ ৫ এ CSS ভ্যারিয়েবলস (CSS variables) এর মাধ্যমে কাস্টমাইজেশন আরও সহজ এবং শক্তিশালী করা হয়েছে। এখন আপনি সরাসরি বুটস্ট্রাপের ডিফল্ট রঙ, ফন্ট এবং অন্যান্য সিএসএস প্রপার্টি পরিবর্তন করতে পারবেন।
বুটস্ট্রাপ ৪: বুটস্ট্রাপ ৪ এ মার্জিন এবং প্যাডিং নিয়ন্ত্রণ করার জন্য m-
, p-
এর পর বিভিন্ন সংখ্যার মান ব্যবহার করা হতো।
বুটস্ট্রাপ ৫: বুটস্ট্রাপ ৫ এ মার্জিন এবং প্যাডিং নিয়ন্ত্রণের জন্য আরও নির্দিষ্ট ক্লাস যুক্ত করা হয়েছে। যেমন, m-{breakpoint}-{size}
, যেখানে breakpoint
হতে পারে sm
, md
, lg
এবং size
হতে পারে 0
, 1
, 2
, 3
, ইত্যাদি। এই নতুন ক্লাস সিস্টেমটি অনেক বেশি ফ্লেক্সিবল এবং কাস্টমাইজেবল।
বুটস্ট্রাপ ৪: বুটস্ট্রাপ ৪ ফন্ট অ্যাওয়েসোম আইকন ইন্টিগ্রেশন সমর্থন করতো, তবে এটি একটি বাহ্যিক লাইব্রেরি হিসেবে ব্যবহৃত হত।
বুটস্ট্রাপ ৫: বুটস্ট্রাপ ৫ এ ফন্ট অ্যাওয়েসোম এর পরিবর্তে SVG আইকন সমর্থন যোগ করা হয়েছে। এতে ডেভেলপাররা এখন SVG আইকন ব্যবহার করতে পারবেন, যা স্কেলেবল এবং দ্রুত লোড হতে সাহায্য করে।
বুটস্ট্রাপ ৪: বুটস্ট্রাপ ৪ কিছু পুরনো ব্রাউজার যেমন Internet Explorer 10 এবং 11 সাপোর্ট করতো।
বুটস্ট্রাপ ৫: বুটস্ট্রাপ ৫ এ Internet Explorer সাপোর্ট সরিয়ে ফেলা হয়েছে। এখন এটি শুধু আধুনিক ব্রাউজারগুলো যেমন Chrome, Firefox, Safari, Edge সাপোর্ট করে, যার ফলে কোডের পারফরম্যান্স এবং ফিচারের উন্নতি ঘটেছে।
বুটস্ট্রাপ ৪: বুটস্ট্রাপ ৪ এর থিম কাস্টমাইজেশনের জন্য SCSS ব্যবহার করা হতো, এবং সেখানে বেশ কিছু পূর্বনির্ধারিত ভ্যারিয়েবল ছিল।
বুটস্ট্রাপ ৫: বুটস্ট্রাপ ৫ এ SCSS এবং CSS ভ্যারিয়েবলস এর মাধ্যমে আরও সহজ এবং শক্তিশালী কাস্টমাইজেশন করা সম্ভব হয়েছে। এখন আপনি অনেক সহজেই থিম পরিবর্তন, রঙ কাস্টমাইজ এবং ডিজাইন চেঞ্জ করতে পারবেন।
বুটস্ট্রাপ ৪ এবং বুটস্ট্রাপ ৫ এর মধ্যে প্রধান পার্থক্যগুলো হল: jQuery এবং Popper.js এর অবলুপ্তি, গ্রিড সিস্টেমে পরিবর্তন, নতুন ইউআই কম্পোনেন্টস, CSS ভ্যারিয়েবলস এর ব্যবহার এবং ব্রাউজার সাপোর্ট। বুটস্ট্রাপ ৫ এর মাধ্যমে উন্নত কাস্টমাইজেশন, নতুন ফিচার এবং কোডের পারফরম্যান্সের ক্ষেত্রে অনেক উন্নতি এসেছে।