I feel bootstrap is heavy to use in production which is using more bandwidth. is there way to short this issue ? I hope lot ways are there. As a new to development i had keen interest to know .. thanks

I feel bootstrap is heavy to use in production which is using more bandwidth. is there way to short this issue ? I hope lot ways are there. As a new to development i had keen interest to know .. thanks

• javascript
• html
• css
• twitter-bootstrap

Share Improve this question Follow edited Sep 10, 2017 at 13:50 Farhad 4,18188 gold badges4545 silver badges6767 bronze badges asked Sep 10, 2017 at 13:49 UserUser 6111 silver badge44 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 6

You can download the less files (scss files in v4) and build your own "bootstrap css" with parts you only need. Or you can customise it here if the "less" part is to plicated for you. As mentioned by Daren, make sure you use the minified version of it. Also a bit more friendly would be to use a CDN as that helps with browser caching.

You can use following methodologies to improve site performance while you using bootstrap.

Method 1 : Use the minified versions of all the .css and .js

Method 2 : Use gzip pression to press everything sent to client browsers

Method 3 : Use CDN , content delivery networks are really helping to serve monly used css js contents. You can use one of the bootstrap cdn instructed by Bootstrap itself (https://getbootstrap./docs/3.3/getting-started/)

<!-- Latest piled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn./bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn./bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

<!-- Latest piled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn./bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

Method 4 You can customise using https://getbootstrap./docs/3.3/customize/ . Here you can choose needed ponents. This will also improve performance

If you are not already, you should use the minified version of bootstrap (essentially it is the same as the normal bootstrap without any whitespaces/ spaces so the file size is smaller and it runs faster).