Comparing two codes, what's the difference / better approach?

This was the issue:
Removing a line causes the browser to freeze

apiIsReady = true; / Line Removed:

Try clicking on a play button on the image and the browser freezes.

apiIsReady = true; / Line Added:

Which was explained to me here:
https://stackoverflow.com/a/53580992/10641025


Both of these codes bellow are aimed at preventing an ‘infinite loop’ from ever happening.
Which is what I’m told it’s called.

What I’m confused about is which of these is a better option.

i.e., If I were to save one of these codes, which would it be?

Can someone explain for me what’s the difference between

This way:

If you want to prevent infinite loop, you can just check apiIsReady inside your load_all_waitting_inits function and if it was true then do your loop other wise do nothing.

https://jsfiddle.net/h93qzu0t/1/

Top:

const waitting_inits = [];

function load_all_waitting_inits() {
    if (!apiIsReady) return
    for (let opts of waitting_inits) {
        init(opts);
    }
}

Bottom:

let apiIsReady = false;
window.onYouTubePlayerAPIReady = function() {
    apiIsReady = true;
    load_all_waitting_inits()
};

function init(opts) {
    loadPlayer();
    if (apiIsReady) {
        addVideo(opts.video, opts.playerVars || {});
    } else {
        waitting_inits.push(opts)
    }
}

And how this does it?

Check if array includes object.

https://jsfiddle.net/5umd9zfg/54/

Top:

    const waitting_inits = [];

    function load_all_waitting_inits() {
        for (let opts of waitting_inits) {
            init(opts);
        }
    }

Bottom:

    let apiIsReady = false;
  window.onYouTubePlayerAPIReady = function() {
      apiIsReady = true;
      load_all_waitting_inits()
  };

  function init(opts) {
      loadPlayer();
      if (apiIsReady) {
          addVideo(opts.video, opts.playerVars || {});
      } else if (!waitting_inits.includes(opts)) // if array doesn't include opts then push
      {
          waitting_inits.push(opts)
      }
  }

With the first code, the onYouTubePlayerAPIReady event guaratees that the api is ready, before running load_all_waitting_inits so it’s a complete waste for load_all_waitting_inits to check if the api is ready.

I’d use the second set of code.

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.