Web developers: Beware framework bloat

Web design frameworks can be useful tools but be wary of adding too much bloat to your website app.

Another week, another contract, another project. And another framework.

In the next few weeks I'll mostly be using the Twitter Bootstrap framework, with the Haml markup language and the Sass CSS preprocessor.

The whole idea of Bootstrap is to provide everything you need to get a website up running very, very quickly. There's a CSS grid, CSS styles, jQuery and jQuery plugins, heck, even the buttons are styled nicely. You hardly have to think.

And therein lies the problem. The danger of switching off your brain and letting default take over. Versus getting the job done.

Luckily for me, my noble predecessors on my new project have customised Bootstrap, getting rid of some stuff that's not needed and creating a 10-pixel grid.

At the other extreme is starting from scratch. My favourite framework is from Rachel Andrew:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <title></title>
</head>
<body>
</body>
</html>

I have started with this template on numerous projects, and then started adding what was required. Perhaps this approach is a way forward. The idea of a library is that you take out the books you need as you need them, not a whole mobile library lorry load.

Frameworks such as Bootstrap, Boilerplate and Blueprint provide all that you need, including the kitchen sink, to get your website up and running with minimal effort.

Modernizr Download Builder
The Modernizr JavaScript library builder - a way to pick just what you need, not the kitchen sink

Maybe a library should come to mean something like the JavaScript detection library Modernizr, where you configure your production build by adding the features you need.

Do let me know if there's an equivalent CSS library out there in the wild.

Newsletters

You have been successfully signed up. To sign up for more newsletters or to manage your account, visit the Newsletter Subscription Center.
Subscription failed.
See All
See All