The Cost of Convenience

It’s morning, you’ve decided scrambled eggs is the fuel you need to start your day, so the logical choice is to reach for the KitchenAid mixer, right? Of course not. You’re grabbing a bowl and a whisk, or a fork. Heck, maybe you’re doing it live in the pan. But here’s the thing. If the only tool in your kitchen is a KitchenAid, scrambled is all you’re ever making. No over easy, no poached, no soft-boiled. You picked a tool for one job and quietly gave up every other job along the way.

Small problems deserve small solutions

I’ve come across the KitchenAid solution too many times. TomSelect for a select box that just needs to be searchable. Native functionality often goes further than we assume. Moment.js to format a date. At face value, the library saved you a little time on the first feature. But if it’s a big one, you spent that time back configuring it, learning its API, and fitting your design to its opinions. And every future feature now has to live inside those opinions too.

Here’s a searchable dropdown with no library, no config, no opinions to fight:

  <label for="egg-style">How to prepare eggs</label>
  <input list="egg-styles" id="egg-style" name="egg-style" />

  <datalist id="egg-styles">
    <option value="Scrambled"></option>
    <option value="Poached"></option>
    <option value="Fried"></option>
    <option value="Boiled"></option>
    <option value="Omelet"></option>
    <option value="Frittata"></option>
  </datalist>

It won’t give you multi-select, and you’ll style the dropdown yourself if the browser defaults aren’t enough. If you genuinely need those things, a library is the right call. Most of the time, you don’t.

And here’s another. Most projects still install Moment.js just to render relative time:

  // Moment.js
  moment(postDate).fromNow();

Similar output, no library required:

  // Native
  const rtf = new Intl.RelativeTimeFormat('en', { numeric: 'auto' });
  const hours = Math.round((postDate - Date.now()) / (60 * 60 * 1000));
  rtf.format(hours, 'hour');

After this post sat in limbo for a day, the Moment.js code switched from hours to days on its own. Of course I hadn’t read through the docs before grabbing a one-line snippet, so that was unexpected.

This drives two points home:

1. When you pull-in a library it (should) come with an investment of time on the front-end to begin using it properly and without surprises, and
2. Though vanilla JS can be more self-documenting, it takes longer to build out the edge cases.

The Moment.js one-liner works great for a blog post timestamp, but not necessarily for tracking somebody’s work hours or payroll, where DST disagreeing with the calendar twice a year actually costs money.

On the flip side, nobody should be overcomplicating their week to save 70kb when they have a good use case. Some problems are genuinely large, like a WYSIWYG editor, or charting that has to stay consistent across a dozen variants. Reaching for a library there isn’t laziness. A large team really benefits from a shared dependency with real docs over a tangle of internal conventions. The question isn’t “could a plugin or library solve this problem?” A library can almost always help. The better question is: “is the cost of integrating and maintaining this dependency worth the benefit(s) provided?”

Writing and maintaining custom code can also be a cost. If your code doesn’t do a good job of describing itself, you may need docs. This is where naming conventions and self-documenting code shine over the cryptic one-liners you might find yourself debugging in a year from now, but that’s a post for another day.

There are still users on Netscape Navigator, but modern browsers do more than we give them credit for, the frameworks we’re using do more than they used to, and a lot of the libraries in our Gemfile or package.json were answers to questions that aren’t being asked anymore. Being a good steward of software means asking the small questions before reaching for the big answer.

Sometimes the answer is the library.

Sometimes it’s a spatula and a pan.