Bootstrap + CSS
Why is Bootstrap bad?
In this post, I'm telling you why Bootstrap is so bad 😱 for our project and give you an effective solution to improve web speed.
Let's start it
We discuss some basic key points. These are essential for all web developers.
Demo For Gaming
Note: Check Out Here unused CSS using the browser dev tool
- File size
- Unused CSS
- Code readability
- Solution
File size
My Big problem is that Bootstrap increases HTML and CSS files. Most of the time, when writing code with Bootstrap. We use a requirement div tag or Some Other Tag. that Tag increases the HTML file also CSS file size.
Unused CSS
A lot of time in the bootstrap project, Find the unused class that is commonly for us. But this is a big problem for decreasing website speed.
Code readability
Bootstrap code provides a third big problem for a beginner developer code readability.
Solution
Bootstrap provides Two types of solutions to avoid File size and unused CSS.
- Customize and download
- Sass
Customize and download
When using NPM or CDN, we use all functionality with all Bootstrap Components. But we need only some bootstrap Components for a web project. So in case, we select a component after downloading local and using it.
More Read on Bootstrap And Use it
Sass
The second solution is Sass because Bootstrap builds with Sass. Import selected Nested files to decrease a bootstrap file and unused CSS.
Read All Sass Advantage
Reference
- https://getbootstrap.com/
- https://getbootstrap.com/docs/3.4/customize/
- https://developers.google.com/web/tools/chrome-devtools/coverage/
- https://getbootstrap.com/docs/4.4/getting-started/theming/#sass
Read More on Medium
Conclusion
I hope you understand Why Bootstrap is bad.
If you have any queries, mistakes, or suggestions, please tell me in the comment box after we update our article.
