Add window history push and pop state to isomorphic example

[chinedufn]

This PR adds push and pop state to the isomorphic example, making the URL of the page change when you click and making the back button in your browser work.

Note that I threw things into the example without bothering to comment. Planning to re-write the examples later this year since they were first written mid last year and we've learned quite a bit since then.

Closes #99

[cryptoquick]

It doesn't work right out of the box, but I looked at what you did in the Client code in the example, and replicated it in my app. I tested both route detection (when the page is first loaded) and history push/pop.

This example did not meet the former criteria, but it's easy to fix, I just copied and pasted the code you had in on_popstate and made that run when the app is made new, also. This way, the store is updated to the current path when the user refreshes the page, in typical SPA fashion.

I know it's hard to test that behavior with the current isomorphic example, but the actix web server would have to be modified to forward requests to /, or you could use that warp server gist I sent you, which does the same (and then some, i.e., graphql).

So, for this PR to be considered "finished", I would suggest updating the example server to redirect to index, and finding a good way to have on_popstate called on load (Client::new). However, this is very good, it has all the right ingredients, and I now have SPA-like routing functionality hacked together in my own app. Thank you for the hard work!

[cryptoquick]

Also, one thing to note: There is degree of noticeable lag in the routing behavior currently, at least in my app. It's maybe less than a second, but still noticeable, and might contribute to a perception of lack of speed.

Further, in my code at least, I'm seeing the page render before the page routes. I'm trying to think of a good way to fix that. Perhaps that's due to serverside routing...

[luover]

@chinedufn @cryptoquick There is a nice app in typical SPA fashion. but It is written written in actix-web with vuejs.

The actix-web server only need router the view request to "/"(index page), all front view page route use front router(vue-router). Client get date from server all use fetch.

I think Percy router can do this like vue-router out of box will be nice.

[chinedufn]

I've updated this PR to go to the correct route on page load bb38b91 .

You don't actually want to do it on the client side since the client should simply pick up where the server left off. So I've added the routing to the server side.

---

I profiled a debug build of the router (just to see the worst case scenario) and clicking on a route took < 1 ms.

So I'm not too sure where this lag might be coming from. Would you be able to open an issue with some more information? Maybe just going into your browser, going to the performance tab, starting a recording and clicking on some of your routes? Then I'll take a look and fix whatever is going on if it's something in the router.

---

So @cryptoquick it sounds like you use warp, and I'm getting into Rocket.

So I think one thing that could be useful is just having multiple isomorphic servers.

./examples/isomorphic/server-warp ./examples/isomorphic/server-rocket.

If you're ever up for it I'd love to accept a server-warp example!

[chinedufn]

Thanks both of you for reviewing!

Going to merge this - feel free to continue to open issues as you run into even the smallest bit of friction and we can try to erase it!