Bootstrap is without a doubt the most popular layout framework for frontend development. The release of Bootstrap 4 prompted me to log on and see exactly what has changed in the framework with its latest version. And there are a lot of interesting improvements: such as the grid system now being flexbox based as opposed to float based, using rems instead of pixel units, becoming a sass first project etc. These updates while alluring don’t exactly change the core of what’s already there.

Besides my day job, it’s been a while since I’ve actually used bootstrap in any of my projects. I find myself avoiding it personally because I like writing my own layouts and not having any restrictions. I also feel that not using bootstrap or other layout frameworks benefits a developer by putting your CSS skills to the test. With this mindset and the release of Bootstrap 4 I found myself wondering: is Bootstrap even worth using anymore?

Before I explain why I’m questioning the integrity of this framework let me preface this by saying that I do think it’s still applicable for certain situations. For example: if you needed to create a mock up layout you could easily create responsive layout in minutes using bootstrap's grid. Be it in a local environment, through a CDN or even in an in-browser environment such as codepen, it’s easy to set up.

Now for where I think Bootstrap has its problems.

Too Easy

Now I know I stated that I think it’s a good thing that Bootstrap is easy to implement two seconds ago, but hear me out! For demonstration purposes and quick mock-ups yes it is very much a benefit that Bootstrap is easy to use. However, I feel that as a result of being easy to use developers are getting into bad habits. Let me explain:

With bootstrap being so easy to integrate, young developers tend to default to using the framework and not thinking about how it works or how they would go about doing it themselves. And if this seems like speculation, I have witnessed it first hand. I’ve conducted several interviews over the last couple of years, with junior/graduate developers. Since they are on an entry level one of the questions I commonly throw their way would be how to create a responsive three column layout. I found myself shocked that the majority of the answers given would be how to do it using bootstrap and then having no idea how to implement a solution using vanilla CSS…

Performance Heavy

It’s no secret that the more scripts/stylesheets you include in your site or application, the more taxing it will be on your performance. And bootstrap is a particularly heavy package... To implement bootstrap you need to include 3 depencies:

  • jQuery
  • Bootstrap JS
  • Bootstrap CSS

That is quite the load. It’s seems especially heavy if you’re not utilising a lot of custom javascript. jQuery on it’s own is quite a big library and only using it for a layout seems like quite the waste.

CSS Grid

Personally for me, this is the final nail in the coffin. CSS grid is a recent addition to the CSS standard, it allows for creation of 2 dimensional responsive grid layouts. It is the first time that it is possible to create a grid layout natively in the browser using CSS with no media queries. Obviously this spells trouble bootstrap since we can now implement responsive grid layouts without the need for all the overhead I mentioned before. In the long term implementing a grid layout using CSS will result in better development practice and better performance.

Summary

So yeah. Bootstrap is still alive and kicking but overall I feel that it should no longer be a go-to option for designing your layouts. There are too many drawbacks that are made even worse with the ever improving standards of CSS making it much easier to create these layouts without having to use any frameworks. Do you agree? Completely disagree? Either way I would love to hear your thoughts on this. Thank you so much for reading and feel free to share this post!