Solutions to hard parts of web apps

  • Managing UI state. Good solution through unidirectional data flow as popularized by React and Flux (although these concepts can be applied to other frameworks like Angular).
  • Offline-capable / Persistence. When a user goes offline, will it send updates after they reconnect? What if they close the browser and re-open it, will it persist the changes to local storage?
  • Good mobile performance & responsive design. The first part is making sure that even on a less powerful computer like a smart phone (particularly for phones like cheaper Androids) your web app has a reasonable load time. The second part is having a design that's responsive to various dimensions of the viewport.
  • Scaling your data store / database. When you first start out, you can use something as small as SQLite, and then you can use dedicated VMs to host a database like MySQL, Postgres, or MongoDB. Managing a very large dataset will usually require a special solution but things like AWS Aurora are making it more accessible to every development team.
  • Monitoring & health in production. Keeping your web apps running smoothly in production requires sophisticated tooling (sometimes homegrown or open-source projects) but more often using dedicated solutions like New Relic, Loggly, and so on.
  • A/B testing & measuring business metrics. I separate this from monitoring because for more monitoring is more about getting very timely information (e.g. within the last 10 minutes) of how fast your response times, and how many errors you have received. Measuring is more about looking at which parts of the product have the biggest impact on the business. The most obvious KPI is revenue - can you attribute a set of features to an improvement to revenue? Mixpanel seems like an increasingly popular choice for this.
  • Continuous integration & deployment. Few people will disagree these are good practices, yet they are practiced consistently in most places. Using an open-source tool like Jenkins, Go.cd, or Buildbot or a solution like CircleCI, Codeship, and so on can help address this. Dropbox is developing a very interesting solution on Mesos but it's still highly experimental (https://github.com/dropbox/changes)
  • Cross-browser compatibility.  Subtle things break amongst the four different browser vendors like a button that can't be clicked on. The reactive solution is to use a tool like Sauce Labs or Browser Stack to automate cross-browser and the proactive solution is to use a battle-tested framework like Bootstrap or Foundation. While those popular frameworks will deal with most issues, you will still probably need to do some sanity checking to make sure your site is OK across browsers.
  • I18n. Scaling an app from just US to a truly global product takes a lot of effort. First, you need to get translations done (risky to rely on automatic translations using a service even like Google's). Second, you need to properly detect locale and display the right strings of text to users. Finally, you need to QA that the translations really work, which is hard to QA well with an English-speaking staff.
views