Task: Scroll Analytics

Provide a solution to the following problem. You can use all appropriate tools you would like within JS environment that are not targeting to solve a following problem directly and project itself has to be based on React. Keep in mind, that application has to run smoothly on mobile devices.

We would like to track the percentage of scroll on a page that user is browsing and send it to our analytics backend, to be able to put our advertisements to more valuable position. To achieve this task you may create a new project, add several pages with long content and manage navigation between them - each page has it's own unique URI - something similar to master-detail layout. Also, it's required to store calculated percentage in a reliable way with the smallest possible data drop, as user can leave without returning back to master page. To simulate API request, you can use console.log(), which will print all data that an application wants to send.