BUG] Issues with Duration Count and Waveform Load Times on Android and iOS

[MwSpaceLLC]

Hello,

First of all, thank you for the fantastic work on this module. We have successfully integrated it with Expo, and it works perfectly. However, we have encountered a few issues and have some suggestions for improvement.

[BUG] ON ANDROID | (dev & prod build)

Issue with Duration Count: When setting the default recording quality and extension to .m4a, the duration count loads the first time but then stops updating and remains at 0. This occurs, for example, when using router navigation to open a chat and then navigating back.

Here are the default recording settings for Expo AV audio that we pass to the waveform:

RecordingOptionsPresets.HIGH_QUALITY = {
  isMeteringEnabled: true,
  android: {
    extension: '.m4a',
    outputFormat: AndroidOutputFormat.MPEG_4,
    audioEncoder: AndroidAudioEncoder.AAC,
    sampleRate: 44100,
    numberOfChannels: 2,
    bitRate: 128000,
  },
  ios: {
    extension: '.m4a',
    outputFormat: IOSOutputFormat.MPEG4AAC,
    audioQuality: IOSAudioQuality.MAX,
    sampleRate: 44100,
    numberOfChannels: 2,
    bitRate: 128000,
    linearPCMBitDepth: 16,
    linearPCMIsBigEndian: false,
    linearPCMIsFloat: false,
  },
  web: {
    mimeType: 'audio/webm',
    bitsPerSecond: 128000,
  },
};

[BUG] ON IOS AND ANDROID | (dev & prod build)

Issue with Waveform Load Times: The waveform spectrum takes about half a second to load on iOS, which disrupts the user experience. On Android, when reloading the chat page (e.g., with a FlatList component), the waveform component loads, but the audio spectrum takes a significant amount of time, about half a second for each message. Thus, if there are 10-20 messages, the spectrum loads asynchronously, appearing visually buggy to the user.

SUGGESTION

It would be very helpful if you could implement a caching mechanism or similar functionality for the spectrum. This way, when the component loads, it does not need to re-render the spectrum by analyzing the audio track every time, but instead, it can load the pre-rendered spectrum. This would significantly optimize the load times of the audio spectrum.

For example, adding a function to the component like the one below could allow the waveform to be generated once and then load from the store, preventing re-render delays:

<Waveform initialWaveData={localData} onWaveLoad={(data) => functionForStoreLocallySpectrumData(data)}/>

[BUG VIDEO REGISTRATION ANDROID 14]

https://github.com/user-attachments/assets/5d4371ae-db20-4f36-aec3-1c4afc905a03

As MwSpace, we are very interested in this implementation to utilize this component in our production app.

If needed, we are also open to commercial collaboration.

Thank you, and we look forward to hearing from you.

Best regards, Alex CEO of MwSpace LLC