Should you consider Bootstrap 5 for your next project with htmlBurger?

Bootstrap 5 recently came out in a more stable beta 2 version and we’re really excited to talk about it. If you are starting a new project, you might be asking yourself whether it’s worth trying Bootstrap 5 or should you stick to Bootstrap 4. So let’s sum things up for you. Okay, here goes.

What You Need To Know About Bootstrap 5: Overview

So first, Bootstrap has ironed most of its issues with third-party libraries and also made some major changes. This came right before the release of the final beta (which might be promoted to stable), and things seem pretty good so far. Below is a quick list of the most major updates that should matter to you, but there are more as well.

• RTL Support
• Updated Grid System
• Improved Forms
• No jQuery
• No IE10 and IE11 Support
• Responsive Font Sizes
• Bootstrap 5 Beta 2: Summary

And before we go any further, here is something to quickly note. The migration process from Bootstrap 4 to Bootstrap 5, is far easier than from version 3 to version 4. What this means is that choosing 4 now, and then going to Bootstrap 5, won’t be such a big deal. Still, we would highly recommend going with the newer one. According to the Bootstrap developers, this version is already very very stable, and moreover, it really does come with great improvements.

The new version allows you to enable right-to-left text across the Bootstrap layout, components, and utilities. So far, it’s an experimental feature. It will evolve in the future based on feedback and performance. You can check out some examples of the feature in Bootstrap’s documentation here.

The biggest asset of Bootstrap is its fully responsive grid system built with flexbox. And certainly, it gets an upgrade in its latest version.

Amongst the new capabilities is the new XXL grid tier with a 1320px max-width container which is now the sixth default breakpoint.

And some other nice features for the developer’s ease are added like switching the .gutter class with utilities, form layout improvements, etc. but let’s not get into the developer’s world too much 🙂

The new version has a separate forms section with redesigned and deduplicated form controls. Now all custom form controls such as checkboxes and switches, as well radio buttons, select, range and etc. have a customized look for a more consistent rendering across browsers and devices.

Additionally, there are newer input controls like email verification, number selection, and more.

Bootstrap 5 no longer has the jQuery library as a dependency. It’s all good plain vanilla JS now. Surely, this isn’t a surprise as the team opened a pull request to remove the library from the Bootstrap source in 2017. All in all, many of the problems that jQuery was designed to take care of are now CSS and JavaScript standards.

According to the official documentation, it is still possible to use Bootstrap 5 with jQuery but switching to vanilla JS is recommended.

And if the website loading speed matters to you (we know that’s all of you 🙂 ), that is actually very good news.

According to the founder of Bootstrap, Mark Otto, the decision behind removing the support for Internet Explorer 10 and 11 is due to the focus on building tools that are more future-friendly with CSS variables, faster JavaScript, fewer dependencies, and better APIs. In addition, the usage of IE 11 will steadily drop in usage over the coming years which will make it a less demanding feature to have.

From the developer’s perspective, this is great news. No more having to take a step back and make fixes (and some black magic) specifically for IE browsers. We’ve been waiting to embrace this step in the evolution of the web, so kudos from us to the Bootstrap team.

Bootstrap 5 enables responsive font sizes by default. In other words, they will allow text to scale more naturally across device and viewport sizes. This is done thanks to Bootstrap’s RFS resizing engine that scales common CSS properties to utilize available space better according to devices and viewpoints. RFS was originally developed to resize font sizes.

Conclusion

In short, Bootstrap 5 brings to the table some really good reasons to start using it right away. And although it’s still in beta 2, we are convinced it’s worth a try and are very excited to have already started testing the new features.

If you consider using Bootstrap for your upcoming project and are still hesitating about the version, we’d love to discuss with you which is the best option for your particular case. So get in touch with us, and together we will come up with a solution that’s best for you.

Let’s start 2021 bold with Bootstrap 5.