I have a multi-paged web app, in which users may go to a different page during an ongoing process. For example a user may be at /home and he may click a link to /dashboard while, say some music is being played through an <audio> tag. How can I allow the user to make the transit without pausing that audio? Kind of a smooth transition...
On the internet, I found that smoothState.js may be of help but I have little idea about how should I implement it with my react-apps made using create-react-app.
Thanks
If you are doing a page load, then the ongoing process will be paused. This means that you will need to have a single page, and by visiting other "pages" you would change the content of the page, but will leave your audio intact. You can do this via defining a main content of your page that will not be changed when you click on buttons to see different views and defining a custom content section of your markup that will be replaced when different contents are needed.
Now, if you enable URL rewriting, you can ensure that you only have an index page, which can receive some parameters which would show which content to initialize with at first load and /home or /dashboard would be rewritten under the hood into your main URL in a parameterized manner.
You can achieve this using libraries as well, but this is the main thing to achieve.