I'm trying to implement expo-av to load an audio stream. It works, but it loads the audio in about 25 seconds which I find too slow... I don't see a user waiting 25 seconds for the audio to load, he will just think it doesn't work and quit my app.
this is my code:
import { Audio } from "expo-av";
const streamUr = "https://adminradiosulamita.store:8000/radio.mp3";
import { Sound } from "expo-av/build/Audio";
export default function HomeScreen() {
const [sound, setSound] = useState<Sound>();
const [loading, setLoading] = useState(false);
async function playSound() {
setLoading(true);
// const { sound } = await Audio.Sound.createAsync(
// {
// uri: streamUrl,
// headers: {
// Range: "bytes=0-",
// // pass aditional headers so it knows its an audio stream
// "Content-Type": "audio/mpeg",
// "Icy-MetaData": "1",
// },
// },
// {
// shouldPlay: true,
// }
// );
const sound = new Audio.Sound();
await sound.loadAsync(
{
uri: streamUrl,
},
{
shouldPlay: true,
}
);
setSound(sound);
await sound.playAsync();
setLoading(false);
}
useEffect(() => {
return sound
? () => {
sound.unloadAsync();
}
: undefined;
}, [sound]);
return (
<ParallaxScrollView>
<ThemedView style={styles.titleContainer}>
<TouchableOpacity onPress={playSound}>
<ThemedText type="title">Play</ThemedText>
</TouchableOpacity>
<ThemedText type="title">
{loading ? "Cargando" : "No cargando"}
</ThemedText>
</ThemedView>
</ParallaxScrollView>
);
}
as you can see I've tried different ways but it still loads very slow. How to fix?