I'm building a small personal website. Basically, they are 20 short sound files. Clicking a button will play one of those files randomly. Once played, that file will no longer be played. So in total, the user clicks the button 20 times, each time getting a new random sound.
My question is should the frontend (angularjs) keep track of this list of sound files or should it be done in the backend.
- An array of file names is populated from an initial server call
- When the 'Play' button is clicked, a name is selected randomly from the list
- A server call is made to get this soundfile, e.g.
- That filename is then removed from the list
- A collection is initially populated with sound file names
- When the 'Play' button is clicked, a server call is made to get a random sound file, e.g.
- The server randomly selects a filename in this collection, removes it from the collection, finds the corresponding file and returns it to the browser.
Are there pros / cons to each approach? Personally, I would prefer to keep the front-end as light as possible so I am leaning toward the backend approach but I'm wondering if I am overlooking something that would make the frontend approach preferable. Thanks.
EDIT: Question title changed to reflect correct terminology