lazy.js

lazy.js é uma biblioteca que permite criar facilmente objetos inicializados lentamente em JavaScript, o que significa que um objeto será inicializado no momento de seu primeiro uso.

Eu criei esta pequena biblioteca porque um de nossos clientes teve alguns problemas de desempenho em um aplicativo da web pesado em JavaScript que construímos para eles há pouco tempo. Simplificado, este aplicativo é um editor de listas de listas. Para cada item folha, cada sublista e a lista de nível superior na página, um objeto controlador JavaScript separado é criado, resultando em uma estrutura de árvore de controladores semelhante a esta:

ListController
|
+- SubListController
| |
| +- ItemController
| |
| +- ItemController
| |
| ...
|
+- SubListController
| |
| +- ItemController
| |
| ...
|
...

Na verdade, a árvore do controlador do aplicativo em questão tem mais de três níveis, mas acho que você entendeu. Agora, no carregamento da página, toda a árvore do controlador é inicializada, desde a raiz ListControlleraté cada SubListControllerramificação até cada ItemControllerfolha. A criação de perfil do JavaScript do aplicativo mostrou que os ItemControllerobjetos eram bastante pesados ​​para a CPU em sua inicialização. Especificamente, a inicialização contém código para fornecer a edição dos itens folha, e isso acabou sendo o principal gargalo de desempenho quando uma página com uma grande lista de listas era carregada.

Fazer uma grande mudança estrutural no aplicativo não era viável em um período de tempo limitado e, além desse gargalo, o aplicativo funcionou bem. Uma vez que os recursos de edição de item não são necessários – ou mesmo mostrados – diretamente após o carregamento da página, mas em vez disso tornam-se ativos após a entrada do usuário, imaginei que a inicialização lenta desses recursos de edição poderia aumentar o desempenho (e fez isso, substancialmente ) É por isso que criei esta biblioteca.

Em JavaScript, é bastante fácil manipular objetos, e é isso que esta biblioteca faz. Ele substitui métodos em um objeto por métodos de invólucro que chamam o método de inicialização do objeto antes de executar o método que ele substitui.

Usar a biblioteca é fácil, tudo o que é preciso para fazer um objeto inicializado lentamente é passar o objeto para uma única função:

obj = Lazy.lazy('initMethodName', obj);

Mais informações sobre como usar o lazy.js podem ser encontradas na página GitHub desta biblioteca.