I had been toying with the idea of using an HTML, CSS & JavaScript framework for quite some time. Will it save me time? Will it help me code more quickly? Everyone else seems to be doing it, maybe it’s time I gave it a try? I did some digging and quickly realised that these frameworks weren’t going to be for me and here’s why.

I started with Twitter Bootstrap – you know because everyone has heard of it and it is everywhere. The first thing I notice is a big “Aww yeah, Bootstrap 4 is coming” banner at the top. OK, so I can download v3.x today, but v4 will be better, right? So I’m out of date already… ok that’s cool I guess, I’ll click on the banner announcement and take a look at what is in v4.

Initially, I read the v4 blog post and think wow, these guys are amazing – they put so much work into this thing! Then I saw the line:

Bootstrap 4 has been a massive undertaking that touches nearly every line of code

Oh ok, right… so if I built something on v3 and wanted to update to v4 then this is going to be a lot of work, surely there is a clever update development path – what happened in 2 to 3?

I read further down the post and hit this line:

When we shipped Bootstrap 3, we immediately discontinued all support for v2.x, causing a lot of pain for all our users out there. That was a mistake we won’t be making again.

Well done for admitting the mistake and working on a better path for v3 to v4 – but this didn’t exactly fill me with confidence.

So, I’m already feeling a little underwhelmed by the framework experience, but hey let’s give this a go, so many people are using this – it must be brilliant.

Downloading

I hit the download page and the page itself is absolutely huge! Great documentation but holy moly this thing is a giant! So now I immediately start thinking about file sizes.

At this point I fire up Foundation – which is another well known HTML, CSS & JS framework.

I download both standard full package files and the minified CSS files are twice as big as my most complicated projects, the JS files are up to 3 times bigger and this is me comparing their minified versions to my unminified versions.

Well that’s okay, I’ll just customise the download, they both have customisers. Visiting each framework’s customise page has an overwhelming amount of on/off toggles. I’m going to need to sit down and work out what I need and what I don’t.

Downloading an HTML, CSS & JS Framework is not going to save me time, it is going to do the opposite.

It was at this point that I realised that downloading an HTML, CSS & JS Framework is not going to save me time, it is going to do the opposite. Yes an initial investment up-front perhaps, but we’re talking about a learning curve for something I don’t need to learn. You see, I know HTML and CSS very well, I’m pretty good at jQuery too. I’m sure I could learn lots of things from digging through both frameworks. I’m sure the people that put them together are smarter than me, faster than me and probably better looking than me – but I’m not going to spend the time learning about someone elses framework when I could do it myself or up-skill my own core skills.

Is this the beginning of the end?

This leads me on to a troubling tweet I saw from someone I follow.

Following on from that, if I ask how you build your front-end, answering with “Bootstrap” is not an acceptable answer. — Ed Poole (@_ewp) April 5, 2016

This kind of statement worries me. I earned my front-end chops long before any frameworks, hell I started when framesets were cool and CSS was just for making text look pretty!

I know of some developers and past clients who have used Bootstrap and Foundation and can’t answer me why or how it works. This is troublesome. One answer I got was “Well I don’t know why we use Foundation it was a developer’s idea who left the company”. Another answer was “I just used Bootstrap because it is an industry standard”.

Consider your options

I’m not saying do not use frameworks, what I am saying is that you need to consider your options here wisely.

Do you want to add code bloat to a project or have to learn a framework in depth on a basic website? probably not.

Would you want to do this on a mid-sized website, probably not.

Would you want to do this on a large scale website, possibly – but it would depend on how many people were involved in the project and how concerned you are with optimisation and speed.

Let’s break things down a little more:

Bugs & Updates

As good as a framework is, you are always going to either a) Have to wait for functionality updates and bug fixes or b) Make your own fixes and updates and try to submit them for merging into the core framework at a later date.

On one hand, you have a massive community surrounding a framework so it is likely people will already have the answers for you. On the other hand, you’re suddenly fixing someone elses code or making it do something that isn’t in the core – will this cause you issues if you update the framework at a later date?

Ongoing maintenance

What if the framework you are using suddenly disappears or the owners refuse to patch bugs in an old version. Browsers are always updating, imagine if there was a critical bug that was never patched – this bug is then up to you to fix. Imagine you built a number of websites with a framework and now the bug is in all of them instead of just one or two.

Design

I know Bootstrap comes with themes and people have done amazing things with the framework at the core. However, many people throw up a website or product page and it looks the same as everyone elses. You are not going to stand out if you do this. I’ve lost count of the websites I’ve visited and thought “Bootstrap”.

Extraneous Code

If you are concerned with performance and you use a framework, even when you customise the download, you are probably still going to end up with code you do not need or don’t fully understand. If you are able to minimise extraneous code, this is probably only manageable after you have invested a serious amount of time learning the framework.

Ownership

As amazing as a framework can be, ultimately you are going to have to take ownership of the code in terms of maintaining it for your client or customer. Your client probably isn’t going to be interested if there is a bug in the framework or a piece of functionality they’ve requested is conflicting with some core file somewhere, they are just going to want to have it fixed and working.

Do you still know how to code?

Coming back round to the tweet I quoted earlier. Bootstrap, Foundation and any other HTML, CSS and JS framework make it so easy to build a website, many new developers and front-end coders are learning from Bootstrap or even worse just using Bootstrap because it works. If you are doing this, stop, it will come back to bite you in the end. You need to go back to basics and learn it all, learn how to write good code and bug fix it.

The future of web development

I seriously hope frameworks don’t become the norm, I hope designers and developers take responsibility for their learning and their code. Bespoke websites, coded in a way that is fit for the purpose of the task at hand will always be better than a framework. Or they should be, they should be faster, smaller and easier to understand.

When do you use a framework then?

I’m aware that most of this post seems like it is against using HTML, CSS and JS frameworks. I’m not against using a frameworks. What I am against is people blindly using one without a moment to think about why.

I can think of some great examples for using a framework: Prototyping, Back End Administration Systems, holding pages, single use campaign based web pages and I’m sure that frameworks can work on websites, but think before you start using one;

Is a framework right for this project?

Sign up for more

I’m committed to blogging every Friday now, so Sign up and never miss a post again!