Audio player: Throttle concurrent loading of audio metadata.

ui/file_manager/audio_player/js/audio_player.js

Index: ui/file_manager/audio_player/js/audio_player.js
diff --git a/ui/file_manager/audio_player/js/audio_player.js b/ui/file_manager/audio_player/js/audio_player.js
index 0bb4ee2b6d3076ff1548fd1b1ee849b8fb4c8a12..498c47765ccbe950bf2f2c114fbea59dfd9de9b9 100644
--- a/ui/file_manager/audio_player/js/audio_player.js
+++ b/ui/file_manager/audio_player/js/audio_player.js
@@ -47,6 +47,12 @@ function AudioPlayer(container) {
     /** @type {AudioPlayerElement} */ (document.querySelector('audio-player'));
   this.player_.tracks = [];
 
+  /**
+   * Queue to throttle concurrent reading of audio file metadata.
+   * @private {AsyncUtil.ConcurrentQueue}
+   */
+  this.loadMetadataQueue_ = new AsyncUtil.ConcurrentQueue(25);

[oka, 2016/10/28 07:10:18]

Could you explain why 25 is chosen?

[fukino, 2016/10/28 09:31:51]

I elaborated it a bit more.

+
   // Restore the saved state from local storage, and update the local storage
   // if the states are changed.
   var STORAGE_PREFIX = 'audioplayer-';
@@ -216,8 +222,12 @@ AudioPlayer.prototype.load = function(playlist) {
  * @private
  */
 AudioPlayer.prototype.loadMetadata_ = function(track) {
-  this.fetchMetadata_(
-      this.entries_[track], this.displayMetadata_.bind(this, track));
+  this.loadMetadataQueue_.run(function(trackIndex, callback) {

[oka, 2016/10/28 07:10:18]

fetchMetadata_ looks like more appropriate place to have throttle.

[fukino, 2016/10/28 09:31:51]

I think loadMetadata_ is better.
We want to throttle the initial bulk metadata load, but when a user changed the
current track, loading metadata for the current track should be done before we
completely finish the bulk load.
(For example, when there are 1000 tracks in a directory and the user click
"Prev" button after the audio player is opened, the last song will be selected
and we want to show the metadata asap.)

+    this.fetchMetadata_(this.entries_[trackIndex], function(metadata) {
+      this.displayMetadata_(trackIndex, metadata);
+      callback();
+    }.bind(this));
+  }.bind(this, track));

[oka, 2016/10/28 07:13:43]

I wonder if binding |track| is needed.
Can't you use |track| from the closure?

[fukino, 2016/10/28 09:31:51]

You're right. Thanks!

 };
 
 /**