Skip to content

Instantly share code, notes, and snippets.

@alexrqs

alexrqs/loadUniqueScripts.js

Last active September 4, 2019 12:39
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save alexrqs/b19cc0f45a76b1fbda31ba58a865d4a6 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save alexrqs/b19cc0f45a76b1fbda31ba58a865d4a6 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. alexrqs revised this gist Sep 12, 2018. 1 changed file with 26 additions and 1 deletion.
    27 changes: 26 additions & 1 deletion loadUniqueScripts.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,22 +1,47 @@
    // keep track of the loaded libraries
    const loadedLibraries = []

    function registerLibraryLoaded(id) {
    // record the libs only if the array doesn't contain the same already
    if (loadedLibraries.indexOf(id) < 0) {
    loadedLibraries.push(id)
    }
    }

    // check if the script.id exist already on the page
    // to add a listener because the library you asked to load
    // might be on the loading process
    // and after is loaded register the lib to avid this process twice
    function appendUnique(script, next) {
    const appendedScript = document.getElementById(script.id)
    if (appendedScript) {
    appendedScript.addEventListener('load', function onLoadScript() {
    appendedScript.removeEventListener('load', onLoadScript)
    registerLibraryLoaded(script.id)
    next()
    })
    return
    }


    // this will only add a new script tag if the lib is not already on the DOM
    // the above part of this function will handle the scenario where
    // even tho is already on the DOM might be still loading
    document.body.appendChild(script)
    }

    function loadScript({ id, src }) {
    const script = document.createElement('script')

    return new Promise((resolve, reject) => {
    // once the lib is registered you can resolve immediatelly
    // because it means that is fully loaded
    if (loadedLibraries.indexOf(id) > -1) {
    resolve(`${id} was loaded before`)
    }

    script.addEventListener('load', function onLoadScript() {
    script.removeEventListener('load', onLoadScript)
    registerLibraryLoaded(id)
    resolve(id)
    })

  2. alexrqs created this gist Sep 12, 2018.
    33 changes: 33 additions & 0 deletions loadUniqueScripts.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,33 @@
    function appendUnique(script, next) {
    const appendedScript = document.getElementById(script.id)
    if (appendedScript) {
    appendedScript.addEventListener('load', function onLoadScript() {
    appendedScript.removeEventListener('load', onLoadScript)
    next()
    })
    return
    }

    document.body.appendChild(script)
    }

    function loadScript({ id, src }) {
    const script = document.createElement('script')

    return new Promise((resolve, reject) => {
    script.addEventListener('load', function onLoadScript() {
    script.removeEventListener('load', onLoadScript)
    resolve(id)
    })

    script.onerror = function onErrorLoadingScript() {
    reject()
    }

    script.id = id
    script.src = src
    appendUnique(script, resolve)
    })
    }

    export default loadScript