Preload audio

[steinhot]

Interesting and useful in the right situation, however, it would be good to preload the audio on page load rather than on trigger. Haven't tried it, but may be possible to load a new player for each instance of the audio on the page? Or Only do it if you have a preload="true" attribute on it?

Without preload, the hover and the click just lag too much to be useful.

Thanks for making this!

[MahdiF]

Thanks @steinhot , yeah preloading the sounds is my next step, I'll try to update it this weekend and hopefully I'll get it right.
Thanks for your comment and suggestion, glad to hear that you like it.

[Oxicode]

Check:

[MahdiF]

I'm sorry but I don't get the image, are you saying that the load time is
too long or you want to point out the 2 canceled assets with 0B ?

On Mon, Feb 1, 2016 at 4:36 PM, Oxicode [email protected] wrote:

Check:

—
Reply to this email directly or view it on GitHub
#2 (comment).

[steinhot]

206 means that you are just checking e-tags where the assets are already cached locally on your machine. Clear your cached assets and try again and the asset will not begin downloading until you do the hover.

To provide the best user experience, the assets should begin downloading the moment the page is rendered so that by the time the user gets to click on the button or does the hover, all it has to do is start playing.

Certainly if someone was using this library to “audition” a list of sounds you would only want to download them on demand, but for “accent” sounds, I would want them without lag.

Best,

Thom

From: Mahdi Al-Farra
Reply-To: MahdiF/loud-links
Date: Monday, February 1, 2016 at 7:47 AM
To: MahdiF/loud-links
Cc: Thom Steinhoff
Subject: Re: [loud-links] Preload audio (#2)

I'm sorry but I don't get the image, are you saying that the load time is
too long or you want to point out the 2 canceled assets with 0B ?

On Mon, Feb 1, 2016 at 4:36 PM, Oxicode <[email protected]mailto:[email protected]> wrote:

Check:

—
Reply to this email directly or view it on GitHub
#2 (comment).

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/2#issuecomment-178035167.

[MahdiF]

Oh, thanks a lot for explaining this to me Thom.

I'm sorry, I'm still learning all these things, I'm new to Javascript and to all these things including Git.

I hope I get sometime this week to work on adding the option to preload sounds.

Thanks again Thom & Christian for the feedback, I appreciate it.

[shshaw]

The first method off the top of my head to preload audio would be on initialization to create an element for each sound, set the sources, add the preload attribute, then link all the events for that source to that audio element. That way the browser has a chance to preload all the audio files before triggered.

Some rough pseudo code:

var elements = {};

for (i = 0; i < hoverLength; i++) {
var src = getSource(hoverLinks[i]);
if ( ! elements[src] ) { // if the element for this src hasn't been created yet, let's create it now.
elements[src] = document.createElement('audio');
// add preload attribute & sources to new element...
}
trackHover(hoverLinks[i],elements[src]); // Set up hover events, but now it has a second parameter for the element to trigger.

}