ExpressJS and SSR

There are a number of issues with code currently executed by the ExpressJS server (think SSR).

First, the code cannot be executed in async mode and is executed synchronously, meaning that the API server responses add up until all requests are done.

We already minimized the static needs for pages where filters are used (BrowsePages), but some pages require full SSR: that's the details pages. These are primarily generated for robots that can't handle javascript and for users who don't like seeing Loading indicator when they hit a page.

We explored load times in #167 (closed):

Auth token checked. Check took 595ms

Need function(){return c.serverInfoRequest()} took 760
Need function(){return u.loadCrops()} took 1726
Fetched all component data. Fetch took 1729ms

Render took 115ms

Server render time: 1547118744385 1547118746832 2447ms

Updates

We generate a Docker image for this project (see https://gitlab.croptrust.org/genesys-pgr/genesys-ui/tree/master/docker) and each docker image then starts 3 instances of the server.

There is no need to reload most of these requests every time a request is made. We should keep some of this data stored in each instance so that it can immediately reuse the data:

1. checkToken is handled in #249 (closed). That saves 600ms.
2. Each expressJs service should maintain its own instance of the OAuth token. It should obtain an access token on startup and then use setTimeout to refresh it's copy of the access token before it actually expires.
3. list of crops should be maintained by each expressJs service and it should be refreshed every now and then.
4. same for serverInfoRequest.

Objective: Minimize the number of API calls the server.ts has to make before sending the response to the client.

Should we bring memcached into play for our expressjs services?

Explore https://expressjs.com/en/advanced/best-practice-performance.html and see if we can adjust our server-side code.