I'm describing a
SPA. The idea is that you have a single page which just loads in content when the user interacts with the site. It's essentially what you have now already, except entirely client-side.
So the user loads simple HTML page, JS runs, determines if it should display the index or load a fragment page. You can read or modify the URL from JS, which looks to be what you're doing already anyway.
Usually SPAs use routing logic on the server to point all pages to the index so that prettier URLs are possible (eg. hubolhubolhubol.com/love/), but that isn't doable on a server like Github Pages. You're already using query strings for pages anyway though so it would be no problem.
If you did want pretty URLs like above I'd just use a straight static site rather than a SPA. Either by generating them like you mentioned above, or porting to Jekyll.
Sorry if I'm overwhelming you with info. There's a few options and any of them would work, really.