Reading files from CD using HTML5, webkitdirectory takes more time compared to reading local files

Question

I have a web application which allows the user to upload DICOM and Non-DICOM files to their account. I am using JavaScript, HTML5, Webkitdirectory, Chrome and Datatable to populate selected files on UI. The issue i am facing is -

While selecting files from their local machine the following code seems to work pretty fast and the selected files are populated immediately on the UI, but while selecting same amount of files from a CD it takes time to render on UI. Here is an example -

For a CD with 20 DICOMs + 2 Non DICOMs studies, and about 2241 images, it takes about 5-6 min to populate the list the first time on UI. If I try to select same CD folder, the list will populate in roughly 60 sec if it’s been populated once before during the same session.

But if i use the same set of files from the local machine then it roughly takes 6 -7 sec to populate on UI.

Here is my code which is executed for each and every DICOM file -

var fileReader = new FileReader();
fileReader.onload = function(evt){
    console.log("Completed Reading");
    var arrayBuffer = fileReader.result;

    var byteArray = new Uint8Array(arrayBuffer);
    _parseDicom(byteArray);
    try {
        if (fileReader.readyState !== 2) {
            fileReader.abort();
        }
    }
    catch (err) {
        console.log('error occured: '+err);
    }
}
var blob = f.slice(0, 50000);
console.log("Starting to Read");
fileReader.readAsArrayBuffer(blob);

After analyzing the issue i came up with,

• The basic thing which i guess is, OS takes time to mount the CD to its memory as it is an external drive. It takes less time if we access the second time, because the CD content is already mounted.

• The time between "Starting to Read" and "Completed Reading" is relatively more while reading files from CD than from local machine.

• I also tried looking for DICOMDIR file, which is an index of all study files contained on the disc, and is included for exactly this reason: to avoid lengthy scans of the disc. But I didn't find any standard or way to parse the DICOMDIR file in JavaScript

Is there any way to reduce the amount of time it takes to read files from CD ??

UPDATE -

I am able to get DICOMDIR file structure now into JavaScript using dicomParser - https://github.com/chafey/dicomParser

var fr = new FileReader();
fr.onload = function(evt){
    var byteArray = new Uint8Array(fr.result);
    try {
        var dataSet = dicomParser.parseDicom(byteArray);
        _searchDicom(dataSet, f);
    } catch (err) {
        if (typeof err.dataSet != 'undefined') {
            _searchDicom(err.dataSet, f);
        }
    }
}
var blob = f.slice(0, 1000000); 
fr.readAsArrayBuffer(blob);

function _searchDicom(dataset,f) {
    var data = dataset.elements.x00041220.items;
    if(data) {
    data.forEach(function (e) {
        if (e.dataSet.string('x00041430') === 'PATIENT') {
            console.log("Patient Name - "+e.dataSet.string('x00100010'));
        }
        else if (e.dataSet.string('x00041430') === 'STUDY') {}
        else if (e.dataSet.string('x00041430') === 'SERIES') {}
        else if (e.dataSet.string('x00041430') === 'IMAGE') {}              
    });
    }
}

The structure of object is similar to what is displayed on - https://rawgit.com/chafey/dicomParser/master/examples/dumpWithDataDictionary/index.html
when we upload any DICOMDIR file.

The problem here is I am not able to collect all patients,studies,series or images at once. The only solution I found is to iterate and check whether it's a patient,study,series or image object

Is there any method/standard to retrieve in a better way ??