We're all familiar with the phrase, "Keep it simple, stupid!" However over the years I have heard this uttered in a rather dismissive tone. What is really being communicated is, "My criticism of your solution relates to its apparent complexity, therefore you are unintelligent." This is not only mean, but also incorrect. I argue that simplicity is in the eyes of the beholder, so to speak.

Let us examine a hypothetical "pet-store" example. Note that some of the details moving forward are intentionally exaggerated for the sake of making a point. In this pet store application, the existing code base is standard HTML/CSS, with a small amount of javascript (to drive things like analytics, or a twitter feed). It allows the user to browse available pets for adoption, read descriptions, leave comments, etc. Authenticated users can log in to add new pets and remove adopted pets from the list.

Now, as of writing this post, everyone is encouraged to stay home for public safety. So there are far fewer customers than normal at our pet store in-person, where adoptions typically take place. So we decide to add a "virtual" adoption experience with real-time video and chat.

Let's keep it simple! Our stack is HTML/CSS/JS, so we should just write our chat application from scratch using javascript, rendered on our existing HTML page. No need to introduce new libraries or languages into our stack.

Wait, that's re-inventing the wheel! We don't want to write all that new code! It will be a mess! What about cross-browser compatibility? I guess there's a thing called WebRTC for video chat. Is my team prepared to embark on solving unknown problems by writing all this code from scratch?

Let's keep it simple! This problem has been solved before. In 2020 people use React/Vue to program real-time applications. There are several examples and ready-to-use libraries that do exactly what we want. We could easily throw together some isolated testable components, and render them on our page by including a bundle.js.

But now our code base has a mix of HTML/CSS/JS for our main Pet Store, and JS/JSX for our chat application. If there's an issue with one of our pages in the pet store app, we now have two different places to look. We also need to perform an additional step to generate a bundle before we deploy, but only for the javascript we wrote for the chat app (i.e., operational complexity was introduced). It's inconsistent. Some developers of our team are much more comfortable editing the static portion of our site, while other developers prefer working with JS/JSX. This inconsistency has now split the team!

Let's keep it simple! All of our code should be in one language/framework for ease of maintenance. We re-implement the HTML/CSS/JS sections of our site to be react components, and our page is a simple HTML file that serves the "uber-bundle.js." All CSS rules are expressed as inline react stylesheets. All developers can now focus on one standardized way of doing things.

Hold on though, now we've completely bypassed standard HTML. Our users with screen readers have all complained that our site is completely broken. Furthermore, our search engine score has dropped significantly (someone from our team mentioned something about needing server-side rendering for this?). We also have to worry about maintaining browser history and populating the URL bar for bookmarks- something the browser used to do for us! We have introduced problems here that we didn't need to solve before.

In reality, the simplest answer is going to be a compromise. Any new code will introduce at least the complexity of learning/maintaining a "new" way of doing things. We all want to arrive at the simplest solution in the end, and it benefits nobody good to call each other "stupid." Often times complexity is just pushed around from one component to the next. When evaluating a seemingly complex solution, let us all keep in mind that simplicity is not all that simple to discover.

Until next time!