1

Olá, estou com uma dúvida em relação ao carregamento de uma biblioteca Javascript. Estou para construir uma aplicação que construa componentes com a praticidade de reuso, e para isso a estrutura de cada componente estaria sendo criada como esta:

//componente foo
.foo = {
    style : "foo.css",
    template : "foo.html",
    script : "script.js",
    "imgDir" : "img",
    //etc...
};

Pensando em uma lógica para facilitar a manutenção e o reuso desses componentes, e também no sistema de classes de uma aplicação fortemente tipada eu tenho o interesse de incluir todas as dependências dos script's desse componente no mesmo componente, assim, caso tal script não fosse carregado antes, ele deveria ser para somente então o sistema funcionar.

Eu tirei essa idéia de previnir o carregamento da mesma biblioteca a partir do require_once do PHP. Existe alguma maneira de, eu forçar o DOM ver se o script ja existe na página para não ocorrer do mesmo duplicar o link dele? Já me ocorreu isso em outro momento e acabava que a nova inserção do Jquery meio que travava a minha aplicação, porque ele estava recriando o conteúdo de uma biblioteca dentro do documento e com isso eu perdia instâncias e métodos já declarados e em uso.

3
  • "com isso eu perdia instâncias e métodos já declarados e em uso", isso não é verdade. É impossível perder uma instância em uso. Quando uma instância está em uso, seu construtor ainda vai existir porque há possibilidade de ele ser usado, ele é apagado pelo navegador automaticamente quando é largado e não pode ser mais usado. Só porque o construtor de uma instância está declarado em uma variável, propriedade de um objeto ou expressão, etc., não significa que ele vai sumir do nada; funções/objetos não são valores primitivos, e para serem acessados eles são 'referenciados'.
    – user37626
    Commented 19/10/2016 às 20:53
  • se em você tiver em uma biblioteca algo como window.foo = new foo() ele irá sim sumir com tudo que ja foi manipulado ou inserido dentro de um prototype Commented 21/10/2016 às 10:36
  • Vai sumir, mas ainda vai existir, ou seja, você "não" vai perder instâncias, e você não vai perder o que está na prototype
    – user37626
    Commented 21/10/2016 às 11:10

2 Respostas 2

2

Vc poderia criar uma variável pra cada biblioteca que vc carrega... Daí na hora de carregar, vê se já existe. Se não existe, carrega. Tb dá pra aumentar o nível da parada:

https://stackoverflow.com/questions/5154915/require-once-like-for-javascript

I would suggest that you use either require.js or head.js for this kind of thing. They are fully-featured and provide performance benefits as well.

2
  • pensando dessa forma realmente é interessante, mas nesse caso eu teria que em toda vez ver se existe esses elementos... eu já uso o requirejs, o que não gosto nele é que se eu registro no app.js que uma tela deverá usar o mesmo, o require sai carregando todos os scripts depois do sistema ter aberto, ate mesmo os que não estarão sendo usandos naquele momento. Commented 21/10/2016 às 10:47
  • estava lendo na documentação do RequireJS, creio que eu que estava usando o mesmo de maneira errônea... posso realmente carregar informações ondemand, a partir do que eu solicito pra página rs Commented 21/10/2016 às 10:52
0

Primeiramente, como meu comentário diz, você não perde instância de uma classe se ela for redefinida em um identificador ou propriedade, por exemplo:

class A {
    method() {}
}

let instance = new A
A = null

instance.method // Function
instance.constructor // A

Espero que finalmente entenda o meu comentário.


Voltando ao assunto:

Existe alguma maneira de, eu forçar o DOM ver se o script ja existe na página para não ocorrer do mesmo duplicar o link dele?

E por que aconteceria isso? Anyway, você não pode impedir essa duplicação através do HTML, precisaria de uma das linguagens que tem acesso ao DOM e que são suportadas pelos navegadores, frequentemente JavaScript, e VBScript também pode ser usado em <= MS IE 10.

Se você preferir não carregar o script duplicado, você pode fazer uma pesquisa no DOM para verificar se o link dele não foi usado em outro script antes de carregar o mesmo.

let findScript = (el, src) => {
    var children = el.childNodes

    for (var child of children) {
        var name = child.tagName
        if (name) name = name.toLowerCase()

        if (name === 'script' &&
            child.src === src) {
            return child
        } else {
            let result = findScript(child, src)
            if (result) {
                return result
            }
        }
    }
}

let scriptPath = ""

if (!findScript(document, scriptPath)) {
    // Pode carregar o script
}

E outra alternativa para impedir a duplicação: dependendo da biblioteca, você pode verificar se não existe pegada dela no objeto global antes de carregar o script duplicado:

// jQuery, se definido, deveria ser uma função
if (typeof self.jQuery === 'undefined') {
    // Carregue o script
}

Outra alternativa seria parar a execução do código dessa biblioteca, lá no topo do código, caso ela tem algum rastro no objeto global.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .