I’ve run into a couple of bugs in the wild that I thought were interesting:

  • I loaded a confirmation page via e-mail. On the confirmation page, there was a confirmation modal. I navigated to a different part of the site and was presented with a modal after clicking on an element. The loaded modal was the confirmation modal again when it should have been a different modal to complete a different action.
  • On an order page, there was a network request and latency after every keystroke.

Obviously, the above are bugs, but I feel like there are a class of bugs becoming more common now that didn’t used to exist. The first is an issue of state management in a Single Page Application and the second is a performance issue. I’ve noticed a lot of sites with performance issues around text input.

My current theory is that javascript frameworks make things that used to be difficult easier. Since these things are easier, people are able to build more complex systems, but more complex systems have more places where things can go wrong.

If I were to hazard a guess around my original examples:

  • SPAs has more state management. Instead of starting with a new state on every page load, there are elements, like modals, that persist for an entire session. A state mistake can now happen across what used to be separate pages.
  • Modern javascript frameworks make it easy to manage state. This makes it easier to build our own custom components. It also makes building more complex custom components easily. However, this introduces more failure modes as that complexity can more easily affect performance if one is not careful.