The current wisdom in creating web apps is to either have a fat backend component that serves mostly slim HTML pages, or a fat frontend component that requests data from the backend through a slim API (i.e. a so-called Single Page App). In creating your app you should consider which approach works best for you and how you can make it better for your users. If your needs are special, you can get more creative.

For example, acceleratul.ro is an interface for Romanian train schedules, and as such it has some unique constraints:

  1. the schedule is mostly static, it doesn’t change very often
  2. there are ~1500 trains in Romania, and the whole schedule fits in a <5MB JSON file

Because of this, I managed to push the database on the frontend and eliminate the backend part altogether. At first glance, 5MB looks way too big to send to your users on each request, but there are a few things that make it better:

  • Webpack code minimization — the JSON is packed with all the frontend code, including libraries (e.g. React), and everything has just ~3.7MB
  • GZIP — this reduces the size to ~750KB, which is just fine
  • ServiceWorker — the JSON only has to be downloaded on the first page load a user makes. Afterwards, it gets cached by the browser. This has the added side-effect that the website also works when users don’t have an internet connection.

This allows for storing the actual website anywhere — Amazon S3, Firebase, GitHub pages, etc. I chose Firebase because it also has page rules and I can use the HTML5 history API for dynamic links.

And here it is: www.acceleratul.ro