Handle buildId mismatch properly

[arunoda]

Related to #786

In this case, we'll do a reload when we detect a buildId mismatch.
With the reload, it'll load the newest version of the app.

With this reload, it might destroy the app's state. So, we've a way to restore the state.

Let's assume our client side state stored in a variable called state. Then this is how we use reload hooks to restore the state .

let state = {}

Router.onBeforeReload = function (key) {
  localStorage.setItem(key, JSON.stringify(state))
}

Router.onAfterReload = function (key) {
  const data = (localStorage.getItem(key))
  if (!data) return

  const state = JSON.parse(data)
}

[rauchg]

There's an issue with this approach. If the server is performing a partial rollout of new builds, the mismatch could trigger an infinite reload loop for the client.

[nkzawa]

I wonder if we can just get a new Build ID when the mismatch was detected, then you don't have to force users reload 🤔

[arunoda]

@nkzawa Getting a new BUILD_ID is not the problem here.
See: https://github.com/zeit/next.js/wiki/Handle-BUILD_ID-Mismatch-Error